From 4265a30fcba31ed23772f5e996bf07e406e51b0b Mon Sep 17 00:00:00 2001 From: Joe George Date: Thu, 4 Dec 2025 14:46:44 -0500 Subject: [PATCH 1/5] fixes --- .vscode/settings.json | 6 +- README.md | 11 - app/[...slug]/layout.tsx | 4 +- app/[...slug]/page.tsx | 10 +- app/globals.css | 231 +- app/hero.tsx | 20 +- app/not-found.tsx | 2 +- app/page.tsx | 6 +- components/analytics/banner.tsx | 12 +- components/analytics/cookie-button.tsx | 4 +- components/code-block.tsx | 4 +- components/copy-button.tsx | 2 +- components/divider.tsx | 2 +- components/icerpc-slice.tsx | 6 +- components/nodes/app-link.tsx | 2 +- components/nodes/document.tsx | 2 +- components/nodes/heading.tsx | 2 +- components/nodes/table.tsx | 10 +- components/shell/feedback/feedback-form.tsx | 14 +- components/shell/feedback/feedback.tsx | 6 +- components/shell/footer.tsx | 4 +- components/shell/page-history.tsx | 2 +- components/shell/search-button.tsx | 4 +- .../shell/side-navigation/mobile-side-nav.tsx | 6 +- .../shell/side-navigation/side-nav-list.tsx | 4 +- .../side-navigation/side-nav-selector.tsx | 2 +- components/shell/side-navigation/side-nav.tsx | 6 +- .../shell/top-navigation/mobile-menu.tsx | 6 +- components/shell/top-navigation/top-nav.tsx | 12 +- .../top-navigation/top-navigation-item.tsx | 2 +- components/slice-selector.tsx | 8 +- components/tags/aside.tsx | 2 +- components/tags/callout.tsx | 6 +- components/tags/card.tsx | 4 +- components/tags/examples.tsx | 4 +- components/tags/explore.tsx | 4 +- components/tags/language-selector.tsx | 2 +- components/tags/step.tsx | 4 +- components/tags/title.tsx | 4 +- components/theme-toggle.tsx | 10 +- components/ui/button.tsx | 2 +- components/ui/dropdown-menu.tsx | 12 +- next.config.js | 12 - next.config.ts | 7 + package-lock.json | 7582 +++++++++++------ package.json | 79 +- postcss.config.js | 3 +- tailwind.config.js | 78 +- tools/pdf/.gitignore | 1 - tools/pdf/generatePdf.ts | 276 - tools/pdf/index.ts | 73 - tools/pdf/package-lock.json | 1462 ---- tools/pdf/package.json | 13 - tools/pdf/tsconfig.pdf.json | 9 - tsconfig.json | 20 +- 55 files changed, 5220 insertions(+), 4861 deletions(-) delete mode 100644 next.config.js create mode 100644 next.config.ts delete mode 100644 tools/pdf/.gitignore delete mode 100644 tools/pdf/generatePdf.ts delete mode 100644 tools/pdf/index.ts delete mode 100644 tools/pdf/package-lock.json delete mode 100644 tools/pdf/package.json delete mode 100644 tools/pdf/tsconfig.pdf.json diff --git a/.vscode/settings.json b/.vscode/settings.json index 9e26dfee..4988eb6e 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -1 +1,5 @@ -{} \ No newline at end of file +{ + "files.associations": { + "*.css": "tailwindcss" + } +} diff --git a/README.md b/README.md index b1b2b648..8a88a45e 100644 --- a/README.md +++ b/README.md @@ -26,14 +26,3 @@ install node, it is recommended to follow the guide provided by Node.js For comprehensive guidelines on writing documentation, including how to use custom nodes and tags, please refer to the [Writing Documentation](/WRITING_DOCS.md) page. - -## Generating a PDF - -This repository provides a tool for generating a PDFs from the documentation using [puppeteer](https://pptr.dev). -To run the tool, use the following commands: - -```bash -cd tools/pdf -npm install -npm run generate-pdf -``` diff --git a/app/[...slug]/layout.tsx b/app/[...slug]/layout.tsx index 4d791997..11fdac08 100644 --- a/app/[...slug]/layout.tsx +++ b/app/[...slug]/layout.tsx @@ -2,7 +2,7 @@ import { PathProvider } from 'context/state'; -export default function DocsLayout(props: any) { - const path = '/' + (props.params.slug?.join('/') ?? ''); +export default async function DocsLayout(props: any) { + const path = '/' + ((await props.params).slug?.join('/') ?? ''); return {props.children}; } diff --git a/app/[...slug]/page.tsx b/app/[...slug]/page.tsx index 79182249..cb4b63af 100644 --- a/app/[...slug]/page.tsx +++ b/app/[...slug]/page.tsx @@ -20,9 +20,8 @@ type PageProps = { params: Params; }; -export async function generateMetadata({ - params -}: PageProps): Promise { +export async function generateMetadata(props: PageProps): Promise { + const params = await props.params; const path = '/' + (params.slug.join('/') ?? ''); const { frontmatter } = await getMarkdownContent(path); const title: string = frontmatter?.title ?? ''; @@ -90,7 +89,8 @@ export async function generateStaticParams() { })); } -export default async function Page({ params }: PageProps) { +export default async function Page(props: PageProps) { + const params = await props.params; const path = '/' + (params.slug.join('/') ?? ''); const { content } = await getMarkdownContent(path); @@ -104,7 +104,7 @@ export default async function Page({ params }: PageProps) { return (
-
+
diff --git a/app/globals.css b/app/globals.css index 8e54c751..0a7b5abe 100644 --- a/app/globals.css +++ b/app/globals.css @@ -1,20 +1,108 @@ /* Copyright (c) ZeroC, Inc. */ -@tailwind base; -@tailwind components; -@tailwind utilities; - -:root { - --link-color: rgba(75, 85, 99, 1); - --highlighted-link-color: black; - --text-color: rgba(75, 85, 99, 1); - --text-color-secondary: #3d4356; - --docsearch-searchbox-height: 48px !important; - --docsearch-primary-color: #43a0f7 !important; +@import 'tailwindcss'; + +@plugin 'tailwindcss-animate'; +@plugin '@tailwindcss/typography'; +@plugin 'flowbite/plugin'; + +@custom-variant dark (&:where(.dark, .dark *)); + +@utility container { + margin-inline: auto; + padding-inline: 2rem; + @media (width >= --theme(--breakpoint-sm)) { + max-width: none; + } + @media (width >= 1400px) { + max-width: 1400px; + } } +@theme { + --color-primary: rgb(var(--primary-color)); + --color-light-border: #dce6e9; + --color-dark: rgb(26, 28, 33); + --color-dark-accent: rgb(35, 36, 41); + --color-dark-border: rgb(46, 46, 46); + + --breakpoint-5xl: 64rem; + + --background-image-dark-pattern: linear-gradient( + to right, + #000 0%, + #000 10%, + #010409 50%, + rgb(14, 17, 22) 75%, + rgb(14, 17, 22) 100% + ); + --background-image-og-image: url('/images/og.png'); + + --animate-accordion-down: accordion-down 0.2s ease-out; + --animate-accordion-up: accordion-up 0.2s ease-out; + --animate-fade-in-up: fade-in-up 0.5s ease-out; + + @keyframes fade-in-up { + 0% { + opacity: 0; + transform: translateY(10px); + } + 100% { + opacity: 1; + transform: translateY(0); + } + } + @keyframes accordion-down { + from { + height: 0; + } + to { + height: var(--radix-accordion-content-height); + } + } + @keyframes accordion-up { + from { + height: var(--radix-accordion-content-height); + } + to { + height: 0; + } + } +} + +@layer utilities { + :root { + --link-color: rgba(75, 85, 99, 1); + --highlighted-link-color: black; + --text-color: rgba(75, 85, 99, 1); + --text-color-secondary: #3d4356; + --docsearch-searchbox-height: 48px !important; + --docsearch-primary-color: #43a0f7 !important; + } +} @layer base { + /* + The default border color has changed to `currentcolor` in Tailwind CSS v4, + so we've added these compatibility styles to make sure everything still + looks the same as it did with Tailwind CSS v3. + + If we ever want to remove these styles, we need to add an explicit border + color utility to any element that depends on these defaults. + */ + *, + ::after, + ::before, + ::backdrop, + ::file-selector-button { + border-color: var(--color-gray-200, currentcolor); + } + + *, + *::before, + *::after { + box-sizing: border-box; + } :root { --primary-color: 67 160 247; @@ -24,9 +112,60 @@ --primary-color: 67 160 247; } + html { + text-rendering: optimizeLegibility; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + } + + .DocSearch-Input:focus { + /* Disable the docsearch input ring */ + outline: none !important; + appearance: none !important; + box-shadow: var(--tw-ring-inset) 0 0 0 + calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color); + } + + body { + font-family: + Inter, + system-ui, + -apple-system, + Inter, + BlinkMacSystemFont, + 'Segoe UI', + Roboto, + 'Helvetica Neue', + Arial, + 'Noto Sans', + sans-serif, + 'Apple Color Emoji', + 'Segoe UI Emoji', + 'Segoe UI Symbol', + 'Noto Color Emoji'; + color: rgba(60, 66, 87, 1); + } + + h1 { + font-size: 52px; + color: #333333; + font-style: bold; + margin-top: 0; + } + + h3 { + margin: 1.5em 0; + color: #000000; + font-weight: bold; + font-size: large; + } + + a { + color: rgba(75, 85, 99, 1); + } + main article { - @apply prose max-w-none dark:prose-invert prose-a:no-underline prose-code:font-light - prose-code:text-[var(--tw-prose-body)] prose-code:before:hidden prose-code:after:hidden; + @apply prose dark:prose-invert prose-a:no-underline prose-code:font-light prose-code:text-(--tw-prose-body) prose-code:before:hidden prose-code:after:hidden max-w-none; } main article li { @@ -38,7 +177,7 @@ } main article .callout a { - @apply font-semibold !underline; + @apply underline! font-semibold; } li { @@ -46,7 +185,7 @@ } body { - @apply bg-white dark:bg-dark; + @apply dark:bg-dark bg-white; } h2 { @@ -58,72 +197,14 @@ } code { - @apply break-all rounded border-[1px] bg-slate-100 px-[4px] py-[2px] font-mono shadow-[inset_0px_0px_0px_1px_var(--tw-prose-code-ring)] dark:border-darkBorder dark:bg-transparent dark:text-white md:break-normal; + @apply dark:border-dark-border break-all rounded-sm border bg-slate-100 px-1 py-0.5 font-mono shadow-[inset_0px_0px_0px_1px_var(--tw-prose-code-ring)] md:break-normal dark:bg-transparent dark:text-white; } a code { - @apply rounded border-[1px] bg-slate-100 px-[4px] py-[2px] font-mono font-medium text-primary shadow-[inset_0px_0px_0px_1px_var(--tw-prose-code-ring)] hover:text-[rgb(64,131,193)] dark:border-darkBorder dark:bg-transparent dark:text-primary dark:hover:text-[rgb(64,131,193)]; + @apply text-primary dark:border-dark-border dark:text-primary rounded-sm border bg-slate-100 px-1 py-0.5 font-mono font-medium shadow-[inset_0px_0px_0px_1px_var(--tw-prose-code-ring)] hover:text-[rgb(64,131,193)] dark:bg-transparent dark:hover:text-[rgb(64,131,193)]; } } -*, -*::before, -*::after { - box-sizing: border-box; -} - -html { - text-rendering: optimizeLegibility; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; -} - -.DocSearch-Input:focus { - /* Diable the docsearch input ring */ - outline: none !important; - appearance: none !important; - box-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) - var(--tw-ring-color); -} - -body { - font-family: - Inter, - system-ui, - -apple-system, - Inter, - BlinkMacSystemFont, - 'Segoe UI', - Roboto, - 'Helvetica Neue', - Arial, - 'Noto Sans', - sans-serif, - 'Apple Color Emoji', - 'Segoe UI Emoji', - 'Segoe UI Symbol', - 'Noto Color Emoji'; - color: rgba(60, 66, 87, 1); -} - -h1 { - font-size: 52px; - color: #333333; - font-style: bold; - margin-top: 0; -} - -h3 { - margin: 1.5em 0; - color: #000000; - font-weight: bold; - font-size: large; -} - -a { - color: rgba(75, 85, 99, 1); -} - [data-testid='flowbite-tooltip-arrow'] { display: none !important; } diff --git a/app/hero.tsx b/app/hero.tsx index 724d4af9..0a923dfe 100644 --- a/app/hero.tsx +++ b/app/hero.tsx @@ -6,10 +6,10 @@ import Link from 'next/link'; export const Hero = () => { return ( -
+
-
+
IceRPC Logo { priority={true} fill /> -
-
+
+
-

+

IceRPC

-

+

Documentation

-

+

IceRPC is a new open-source RPC framework that helps you build blazing fast networked applications with very little code.

-
+
Start with a tutorial @@ -43,7 +43,7 @@ export const Hero = () => { or View examples diff --git a/app/not-found.tsx b/app/not-found.tsx index 2bbad270..4fd26e56 100644 --- a/app/not-found.tsx +++ b/app/not-found.tsx @@ -4,7 +4,7 @@ export default function NotFound() { return (
-

+

404

diff --git a/app/page.tsx b/app/page.tsx index 14cd042f..ddbbe98a 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -10,12 +10,12 @@ import { License } from '@/components/tags/license'; export default async function Home() { return ( -
-
+
+
@@ -80,7 +80,7 @@ export const Banner = ({ No thanks