From d89f25af4e907229fd386b8f83630c2f305c681f Mon Sep 17 00:00:00 2001 From: Taras Mankovski Date: Sat, 16 Dec 2023 09:11:55 -0500 Subject: [PATCH] Tweak CSS (#857) * Add a bit of spacing to navbar menus * Created footer component * Moved footer under the article * Made footer a little smaller * Add headers icons * Added wrap to TOC sidebar * Restored footer --- www/components/footer.tsx | 45 ++++++++ www/components/icons/discord.tsx | 15 +++ www/components/icons/github.tsx | 15 +++ www/components/icons/iconextern.tsx | 15 +++ www/routes/app.html.tsx | 157 +++++---------------------- www/routes/docs-route.tsx | 13 ++- www/routes/index-route.tsx | 100 +++++++++--------- www/routes/useAppHtml.tsx | 158 ++++++++++++++++++++++++++++ 8 files changed, 335 insertions(+), 183 deletions(-) create mode 100644 www/components/footer.tsx create mode 100644 www/components/icons/discord.tsx create mode 100644 www/components/icons/github.tsx create mode 100644 www/components/icons/iconextern.tsx create mode 100644 www/routes/useAppHtml.tsx diff --git a/www/components/footer.tsx b/www/components/footer.tsx new file mode 100644 index 000000000..a394ceec9 --- /dev/null +++ b/www/components/footer.tsx @@ -0,0 +1,45 @@ +import { IconExtern } from "./icons/iconextern.tsx"; + +export function Footer(): JSX.Element { + return ( + + ); +} diff --git a/www/components/icons/discord.tsx b/www/components/icons/discord.tsx new file mode 100644 index 000000000..27707238a --- /dev/null +++ b/www/components/icons/discord.tsx @@ -0,0 +1,15 @@ +export const IconDiscord = () => ( + +); \ No newline at end of file diff --git a/www/components/icons/github.tsx b/www/components/icons/github.tsx new file mode 100644 index 000000000..9fccbdacd --- /dev/null +++ b/www/components/icons/github.tsx @@ -0,0 +1,15 @@ +export const IconGithHub = () => ( + +); \ No newline at end of file diff --git a/www/components/icons/iconextern.tsx b/www/components/icons/iconextern.tsx new file mode 100644 index 000000000..aadfe2516 --- /dev/null +++ b/www/components/icons/iconextern.tsx @@ -0,0 +1,15 @@ +export const IconExtern = () => ( + +); \ No newline at end of file diff --git a/www/routes/app.html.tsx b/www/routes/app.html.tsx index 92dba171a..ec4d72e24 100644 --- a/www/routes/app.html.tsx +++ b/www/routes/app.html.tsx @@ -3,17 +3,19 @@ import type { JSXChild } from "revolution"; import { useAbsoluteUrl } from "../plugins/rebase.ts"; import { ProjectSelect } from "../components/project-select.tsx"; +import { IconGithHub } from "../components/icons/github.tsx"; +import { IconDiscord } from "../components/icons/discord.tsx"; export interface Options { title: string; } -export function* useAppHtml( - { title }: Options, -): Operation<({ children }: { children: JSXChild }) => JSX.Element> { +export function* useAppHtml({ + title, +}: Options): Operation<({ children }: { children: JSXChild }) => JSX.Element> { let homeURL = yield* useAbsoluteUrl("/"); let twitterImageURL = yield* useAbsoluteUrl( - "/assets/images/meta-effection.png", + "/assets/images/meta-effection.png" ); return ({ children }) => ( @@ -27,10 +29,7 @@ export function* useAppHtml( content="Introduction | Effection" data-rh="true" /> - + - + - - - + + + - -
- {children} -
- +
{children}
); } - -const IconExtern = () => ( - -); - -const IconGithHub = () => ( - -); - -const IconDiscord = () => ( - -); diff --git a/www/routes/docs-route.tsx b/www/routes/docs-route.tsx index 38588f1ba..18d87c751 100644 --- a/www/routes/docs-route.tsx +++ b/www/routes/docs-route.tsx @@ -14,6 +14,7 @@ import rehypeSlug from "npm:rehype-slug@5.1.0"; import rehypeAutolinkHeadings from "npm:rehype-autolink-headings@6.1.1"; import rehypeAddClasses from "npm:rehype-add-classes@1.0.0"; import rehypeToc from "npm:@jsdevtools/rehype-toc@3.0.2"; +import { Footer } from "../components/footer.tsx"; export function docsRoute(docs: Docs): JSXHandler { return function* () { @@ -51,7 +52,7 @@ export function docsRoute(docs: Docs): JSXHandler { >