From 4ec75df25cbf537e2a0f1e131f851411250d4e1f Mon Sep 17 00:00:00 2001 From: Atila Fassina Date: Tue, 21 May 2024 00:40:26 +0200 Subject: [PATCH 01/14] bringing new landing page for review --- app.config.ts | 10 +- docs/app.tsx | 323 +- docs/components/TableOfContents.tsx | 44 - docs/components/bento.tsx | 89 + docs/components/code-snippet.tsx | 98 + docs/components/components.tsx | 160 - docs/components/error.tsx | 13 + .../fonts/Gordita/Gordita-Black-Italic.woff | Bin 91700 -> 0 bytes .../fonts/Gordita/Gordita-Black.woff | Bin 87948 -> 0 bytes .../fonts/Gordita/Gordita-Bold-Italic.woff | Bin 88268 -> 0 bytes .../components/fonts/Gordita/Gordita-Bold.eot | Bin 127529 -> 0 bytes .../components/fonts/Gordita/Gordita-Bold.ttf | Bin 126072 -> 0 bytes .../fonts/Gordita/Gordita-Bold.woff | Bin 85520 -> 0 bytes .../fonts/Gordita/Gordita-Light-Italic.woff | Bin 87108 -> 0 bytes .../fonts/Gordita/Gordita-Light.woff | Bin 82828 -> 0 bytes .../fonts/Gordita/Gordita-Medium-Italic.woff | Bin 88088 -> 0 bytes .../fonts/Gordita/Gordita-Medium.eot | Bin 125089 -> 0 bytes .../fonts/Gordita/Gordita-Medium.ttf | Bin 129724 -> 0 bytes .../fonts/Gordita/Gordita-Medium.woff | Bin 84472 -> 0 bytes .../fonts/Gordita/Gordita-Regular-Italic.woff | Bin 88576 -> 0 bytes .../fonts/Gordita/Gordita-Regular.eot | Bin 120006 -> 0 bytes .../fonts/Gordita/Gordita-Regular.ttf | Bin 128800 -> 0 bytes .../fonts/Gordita/Gordita-Regular.woff | Bin 84412 -> 0 bytes .../fonts/Gordita/Gordita-Thin-Italic.woff | Bin 87724 -> 0 bytes .../components/fonts/Gordita/Gordita-Thin.eot | Bin 107137 -> 0 bytes .../components/fonts/Gordita/Gordita-Thin.ttf | Bin 133384 -> 0 bytes .../fonts/Gordita/Gordita-Thin.woff | Bin 82396 -> 0 bytes .../fonts/Gordita/Gordita-Ultra-Italic.woff | Bin 89636 -> 0 bytes .../fonts/Gordita/Gordita-Ultra.woff | Bin 84372 -> 0 bytes docs/components/icons/discord-icon.tsx | 15 + docs/components/icons/github-icon.tsx | 14 + docs/components/icons/lego-icon.tsx | 312 + docs/components/icons/lock-icon.tsx | 24 + docs/components/icons/monitor-icon.tsx | 26 + docs/components/icons/moon-icon.tsx | 26 + docs/components/icons/npm-icon.tsx | 12 + docs/components/icons/platform/aws-logo.tsx | 28 + docs/components/icons/platform/azure-logo.tsx | 68 + docs/components/icons/platform/bun-logo.tsx | 98 + .../icons/platform/cloudflare-logo.tsx | 20 + docs/components/icons/platform/deno-logo.tsx | 20 + .../icons/platform/netlify-logo.tsx | 47 + .../components/icons/platform/vercel-logo.tsx | 7 + docs/components/icons/pnpm-icon.tsx | 18 + docs/components/icons/shield-icon.tsx | 23 + docs/components/icons/solid-logo.tsx | 92 + docs/components/icons/solidstart-logo.tsx | 266 + docs/components/icons/sun-icon.tsx | 26 + docs/components/icons/swatch-icon.tsx | 24 + docs/components/icons/yarn-icon.tsx | 18 + docs/components/index.css | 408 - docs/components/nested-grid.tsx | 87 + docs/components/section.tsx | 14 + docs/components/sections/announcement.tsx | 58 + docs/components/sections/deploy-anywhere.tsx | 133 + docs/components/sections/footer.tsx | 78 + docs/components/sections/hero.tsx | 40 + docs/components/sections/meta-framework.tsx | 44 + docs/components/sections/rock-solid-dx.tsx | 62 + docs/components/sections/top-nav.tsx | 17 + docs/components/theme-toggle.tsx | 42 + docs/components/tooltip.tsx | 26 - docs/components/ui/accordion.tsx | 73 + docs/components/ui/button.tsx | 55 + docs/components/ui/dialog.tsx | 142 + docs/components/ui/drawer.tsx | 107 + docs/components/ui/dropdown-menu.tsx | 216 + docs/components/ui/input.tsx | 20 + docs/components/ui/label.tsx | 19 + docs/components/ui/section-title.tsx | 17 + docs/components/ui/skeleton.tsx | 16 + docs/components/ui/tabs.tsx | 62 + docs/entry-server.tsx | 63 +- docs/global.d.ts | 30 +- docs/lib/utils.ts | 7 + docs/root.css | 219 + docs/routes/advanced/index.mdx | 10 - docs/routes/advanced/middleware.mdx | 33 - docs/routes/advanced/session.md | 112 - docs/routes/api/FileRoutes.md | 56 - docs/routes/api/GET.md | 25 - docs/routes/api/HttpHeader.md | 63 - docs/routes/api/HttpStatusCode.md | 82 - docs/routes/api/RequestEvent.md | 75 - docs/routes/api/ReturnResponses.md | 60 - docs/routes/api/app-config.md | 125 - docs/routes/api/app.md | 49 - docs/routes/api/clientOnly.md | 53 - docs/routes/api/entry-client.md | 52 - docs/routes/api/entry-server.md | 56 - docs/routes/api/index.mdx | 10 - docs/routes/api/server.md | 69 - docs/routes/core-concepts/actions.md | 150 - docs/routes/core-concepts/api-routes.md | 223 - docs/routes/core-concepts/css-and-styling.md | 88 - docs/routes/core-concepts/data-loading.mdx | 104 - .../routes/core-concepts/head-and-metadata.md | 166 - docs/routes/core-concepts/index.mdx | 10 - .../core-concepts/route-prerendering.mdx | 38 - docs/routes/core-concepts/routing.md | 238 - .../routes/core-concepts/state-management.mdx | 100 - docs/routes/core-concepts/static-assets.md | 77 - docs/routes/getting-started/index.mdx | 10 - docs/routes/getting-started/project-setup.mdx | 73 - docs/routes/getting-started/running.md | 23 - .../getting-started/what-is-solidstart.md | 57 - docs/routes/index.tsx | 25 +- package.json | 8 + pnpm-lock.yaml | 11919 +++++++++------- public/lego.svg | 57 + public/ryan-carniato-sunglasses.png | Bin 0 -> 76491 bytes public/ryan-carniato-sunglasses.webp | Bin 0 -> 7142 bytes public/ryan-carniato.png | Bin 0 -> 79923 bytes public/ryan-carniato.webp | Bin 0 -> 6890 bytes tailwind.config.cjs | 137 - tailwind.config.ts | 26 + tsconfig.json | 2 +- ui.config.json | 11 + ui.preset.js | 104 + 119 files changed, 10256 insertions(+), 8296 deletions(-) delete mode 100644 docs/components/TableOfContents.tsx create mode 100644 docs/components/bento.tsx create mode 100644 docs/components/code-snippet.tsx delete mode 100644 docs/components/components.tsx create mode 100644 docs/components/error.tsx delete mode 100644 docs/components/fonts/Gordita/Gordita-Black-Italic.woff delete mode 100644 docs/components/fonts/Gordita/Gordita-Black.woff delete mode 100644 docs/components/fonts/Gordita/Gordita-Bold-Italic.woff delete mode 100644 docs/components/fonts/Gordita/Gordita-Bold.eot delete mode 100644 docs/components/fonts/Gordita/Gordita-Bold.ttf delete mode 100644 docs/components/fonts/Gordita/Gordita-Bold.woff delete mode 100644 docs/components/fonts/Gordita/Gordita-Light-Italic.woff delete mode 100644 docs/components/fonts/Gordita/Gordita-Light.woff delete mode 100644 docs/components/fonts/Gordita/Gordita-Medium-Italic.woff delete mode 100644 docs/components/fonts/Gordita/Gordita-Medium.eot delete mode 100644 docs/components/fonts/Gordita/Gordita-Medium.ttf delete mode 100644 docs/components/fonts/Gordita/Gordita-Medium.woff delete mode 100644 docs/components/fonts/Gordita/Gordita-Regular-Italic.woff delete mode 100644 docs/components/fonts/Gordita/Gordita-Regular.eot delete mode 100644 docs/components/fonts/Gordita/Gordita-Regular.ttf delete mode 100644 docs/components/fonts/Gordita/Gordita-Regular.woff delete mode 100644 docs/components/fonts/Gordita/Gordita-Thin-Italic.woff delete mode 100644 docs/components/fonts/Gordita/Gordita-Thin.eot delete mode 100644 docs/components/fonts/Gordita/Gordita-Thin.ttf delete mode 100644 docs/components/fonts/Gordita/Gordita-Thin.woff delete mode 100644 docs/components/fonts/Gordita/Gordita-Ultra-Italic.woff delete mode 100644 docs/components/fonts/Gordita/Gordita-Ultra.woff create mode 100644 docs/components/icons/discord-icon.tsx create mode 100644 docs/components/icons/github-icon.tsx create mode 100644 docs/components/icons/lego-icon.tsx create mode 100644 docs/components/icons/lock-icon.tsx create mode 100644 docs/components/icons/monitor-icon.tsx create mode 100644 docs/components/icons/moon-icon.tsx create mode 100644 docs/components/icons/npm-icon.tsx create mode 100644 docs/components/icons/platform/aws-logo.tsx create mode 100644 docs/components/icons/platform/azure-logo.tsx create mode 100644 docs/components/icons/platform/bun-logo.tsx create mode 100644 docs/components/icons/platform/cloudflare-logo.tsx create mode 100644 docs/components/icons/platform/deno-logo.tsx create mode 100644 docs/components/icons/platform/netlify-logo.tsx create mode 100644 docs/components/icons/platform/vercel-logo.tsx create mode 100644 docs/components/icons/pnpm-icon.tsx create mode 100644 docs/components/icons/shield-icon.tsx create mode 100644 docs/components/icons/solid-logo.tsx create mode 100644 docs/components/icons/solidstart-logo.tsx create mode 100644 docs/components/icons/sun-icon.tsx create mode 100644 docs/components/icons/swatch-icon.tsx create mode 100644 docs/components/icons/yarn-icon.tsx delete mode 100644 docs/components/index.css create mode 100644 docs/components/nested-grid.tsx create mode 100644 docs/components/section.tsx create mode 100644 docs/components/sections/announcement.tsx create mode 100644 docs/components/sections/deploy-anywhere.tsx create mode 100644 docs/components/sections/footer.tsx create mode 100644 docs/components/sections/hero.tsx create mode 100644 docs/components/sections/meta-framework.tsx create mode 100644 docs/components/sections/rock-solid-dx.tsx create mode 100644 docs/components/sections/top-nav.tsx create mode 100644 docs/components/theme-toggle.tsx delete mode 100644 docs/components/tooltip.tsx create mode 100644 docs/components/ui/accordion.tsx create mode 100644 docs/components/ui/button.tsx create mode 100644 docs/components/ui/dialog.tsx create mode 100644 docs/components/ui/drawer.tsx create mode 100644 docs/components/ui/dropdown-menu.tsx create mode 100644 docs/components/ui/input.tsx create mode 100644 docs/components/ui/label.tsx create mode 100644 docs/components/ui/section-title.tsx create mode 100644 docs/components/ui/skeleton.tsx create mode 100644 docs/components/ui/tabs.tsx create mode 100644 docs/lib/utils.ts create mode 100644 docs/root.css delete mode 100644 docs/routes/advanced/index.mdx delete mode 100644 docs/routes/advanced/middleware.mdx delete mode 100644 docs/routes/advanced/session.md delete mode 100644 docs/routes/api/FileRoutes.md delete mode 100644 docs/routes/api/GET.md delete mode 100644 docs/routes/api/HttpHeader.md delete mode 100644 docs/routes/api/HttpStatusCode.md delete mode 100644 docs/routes/api/RequestEvent.md delete mode 100644 docs/routes/api/ReturnResponses.md delete mode 100644 docs/routes/api/app-config.md delete mode 100644 docs/routes/api/app.md delete mode 100644 docs/routes/api/clientOnly.md delete mode 100644 docs/routes/api/entry-client.md delete mode 100644 docs/routes/api/entry-server.md delete mode 100644 docs/routes/api/index.mdx delete mode 100644 docs/routes/api/server.md delete mode 100644 docs/routes/core-concepts/actions.md delete mode 100644 docs/routes/core-concepts/api-routes.md delete mode 100644 docs/routes/core-concepts/css-and-styling.md delete mode 100644 docs/routes/core-concepts/data-loading.mdx delete mode 100644 docs/routes/core-concepts/head-and-metadata.md delete mode 100644 docs/routes/core-concepts/index.mdx delete mode 100644 docs/routes/core-concepts/route-prerendering.mdx delete mode 100644 docs/routes/core-concepts/routing.md delete mode 100644 docs/routes/core-concepts/state-management.mdx delete mode 100644 docs/routes/core-concepts/static-assets.md delete mode 100644 docs/routes/getting-started/index.mdx delete mode 100644 docs/routes/getting-started/project-setup.mdx delete mode 100644 docs/routes/getting-started/running.md delete mode 100644 docs/routes/getting-started/what-is-solidstart.md create mode 100644 public/lego.svg create mode 100644 public/ryan-carniato-sunglasses.png create mode 100644 public/ryan-carniato-sunglasses.webp create mode 100644 public/ryan-carniato.png create mode 100644 public/ryan-carniato.webp delete mode 100644 tailwind.config.cjs create mode 100644 tailwind.config.ts create mode 100644 ui.config.json create mode 100644 ui.preset.js diff --git a/app.config.ts b/app.config.ts index bc3d65bb5..9c7f35147 100644 --- a/app.config.ts +++ b/app.config.ts @@ -1,5 +1,4 @@ import { defineConfig } from "@solidjs/start/config"; -import { docsMdx } from "solid-start-mdx"; import tailwindcss from "tailwindcss"; import { config } from "vinxi/plugins/config"; @@ -11,15 +10,9 @@ export default defineConfig({ preset: "cloudflare_module", rollupConfig: { external: ["__STATIC_CONTENT_MANIFEST", "node:async_hooks"] - }, - prerender: { - crawlLinks: true } }, vite: { - optimizeDeps: { - entries: [] - }, plugins: [ config("tailwind", { css: { @@ -27,8 +20,7 @@ export default defineConfig({ plugins: [tailwindcss] } } - } as any), - docsMdx() + } as any) ] } }); diff --git a/docs/app.tsx b/docs/app.tsx index 05a7dec63..039e6d958 100644 --- a/docs/app.tsx +++ b/docs/app.tsx @@ -1,312 +1,37 @@ // @refresh reload import { MetaProvider, Title } from "@solidjs/meta"; -import { A, Router } from "@solidjs/router"; +import { Router } from "@solidjs/router"; import { FileRoutes } from "@solidjs/start/router"; -import { createMemo, For, Show, Suspense } from "solid-js"; -import { MDXProvider } from "solid-mdx"; -import "./components/index.css"; - -export const mods = /*#__PURE__*/ import.meta.glob< - true, - any, - { - getHeadings: () => { - depth: number; - text: string; - slug: string; - }[]; - getFrontMatter: () => { - title?: string; - sectionTitle?: string; - order?: number; - section?: string; - sectionOrder?: number; - subsection?: string; - }; - } ->("./routes/**/*.{md,mdx}", { - eager: true, - query: { - pick: "getFrontMatter" - } -}); - -const socials = [ - { - href: "https://github.com/solidjs/solid-start", - alt: "GitHub", - icon: "M12 .3a12 12 0 00-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.07 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 016 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 011.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0012 .3" - }, - - { - href: "https://www.reddit.com/r/solidjs/", - alt: "Reddit", - icon: "M12 0A12 12 0 000 12a12 12 0 0012 12 12 12 0 0012-12A12 12 0 0012 0zm5.01 4.74c.69 0 1.25.56 1.25 1.25a1.25 1.25 0 01-2.5.06l-2.6-.55-.8 3.75c1.83.07 3.48.63 4.68 1.49.3-.31.73-.5 1.2-.5.97 0 1.76.8 1.76 1.76 0 .72-.43 1.33-1.01 1.61a3.11 3.11 0 01.04.52c0 2.7-3.13 4.87-7 4.87-3.88 0-7-2.17-7-4.87 0-.18 0-.36.04-.53A1.75 1.75 0 014.03 12a1.75 1.75 0 012.96-1.26 8.52 8.52 0 014.74-1.5l.89-4.17a.34.34 0 01.14-.2.35.35 0 01.24-.04l2.9.62a1.21 1.21 0 011.11-.7zM9.25 12a1.25 1.25 0 101.25 1.25c0-.69-.56-1.25-1.25-1.25zm5.5 0a1.25 1.25 0 000 2.5 1.25 1.25 0 000-2.5zm-5.47 3.99a.33.33 0 00-.23.1.33.33 0 000 .46c.84.84 2.49.91 2.96.91.48 0 2.1-.06 2.96-.91a.36.36 0 00.03-.47.33.33 0 00-.46 0c-.55.54-1.68.73-2.51.73-.83 0-1.98-.2-2.51-.73a.33.33 0 00-.24-.1z" - }, - - { - href: "https://discord.com/invite/solidjs", - alt: "Discord", - icon: "M12 0C5.3 0 0 5.3 0 12s5.3 12 12 12 12-5.4 12-12S18.6 0 12 0zM9.7 5.9a.05.05 0 0 1 .06.03 8.43 8.43 0 0 1 .41.83 12.2 12.2 0 0 1 3.66 0 9.19 9.19 0 0 1 .4-.83.05.05 0 0 1 .06-.03 13.2 13.2 0 0 1 3.26 1.01.04.04 0 0 1 .02.02c1.8 2.66 2.7 5.66 2.37 9.11a.05.05 0 0 1-.02.04 13.24 13.24 0 0 1-4 2.02.05.05 0 0 1-.06-.02 10.65 10.65 0 0 1-.82-1.33.05.05 0 0 1 .02-.07 8.2 8.2 0 0 0 1.25-.6.05.05 0 0 0 .01-.08 6.47 6.47 0 0 1-.25-.2.05.05 0 0 0-.05 0 9.47 9.47 0 0 1-8.05 0 .05.05 0 0 0-.05 0l-.25.2a.05.05 0 0 0 0 .08 8.75 8.75 0 0 0 1.26.6.05.05 0 0 1 .02.07 9.48 9.48 0 0 1-.82 1.33.05.05 0 0 1-.05.02 13.28 13.28 0 0 1-4-2.02.05.05 0 0 1-.02-.04c-.28-2.99.29-6.01 2.37-9.11a.05.05 0 0 1 .02-.02A13.17 13.17 0 0 1 9.7 5.9zM9.35 11c-.8 0-1.43.72-1.43 1.6 0 .9.64 1.62 1.43 1.62.8 0 1.44-.72 1.44-1.61.02-.88-.63-1.61-1.44-1.61zm5.33 0c-.8 0-1.44.72-1.44 1.6 0 .9.65 1.62 1.44 1.62.8 0 1.43-.72 1.43-1.61.02-.88-.63-1.61-1.43-1.61z" - }, - - { - href: "https://twitter.com/solid_js", - alt: "Twitter", - icon: "M12,0.1c-6.7,0-12,5.3-12,12s5.3,12,12,12s12-5.4,12-12S18.6,0.1,12,0.1z M17,9.4v0.4c0,3.8-2.6,8-7.5,8 c-1.5,0-2.9-0.5-4.1-1.3c0.2,0,0.4,0,0.7,0c1.2,0,2.3-0.5,3.3-1.2c-1.1,0-2.1-0.8-2.4-2c0.2,0.1,0.3,0.1,0.5,0.1 c0.2,0,0.5-0.1,0.7-0.1C6.9,13,6,11.9,6,10.5v-0.1c0.3,0.2,0.8,0.4,1.2,0.4c-0.7-0.5-1.2-1.4-1.2-2.3c0-0.5,0.1-1.1,0.3-1.4 c1.3,1.7,3.2,2.8,5.4,2.9c-0.1-0.2-0.1-0.4-0.1-0.6c0-1.6,1.2-2.8,2.7-2.8c0.8,0,1.4,0.3,1.9,0.9C17,7.3,17.6,7,18.1,6.7 c-0.2,0.7-0.6,1.2-1.1,1.6c0.5-0.1,1-0.2,1.5-0.4C18.1,8.4,17.6,8.9,17,9.4z" - } -]; - -function SocialIcon(props) { - return ( -
  • - - {props.alt} - - - - -
  • - ); +import { Suspense } from "solid-js"; +import { + ColorModeProvider, + ColorModeScript, + cookieStorageManagerSSR, +} from "@kobalte/core"; +import { getCookie } from "vinxi/http"; +import { isServer } from "solid-js/web"; +import "./root.css"; + +function getServerCookies() { + "use server"; + const colorMode = getCookie("kb-color-mode"); + return colorMode ? `kb-color-mode=${colorMode}` : ""; } -function Header() { - return ( -
    - -
    - ); -} - -function Nav() { - const data = createMemo(() => { - let sections: { - [key: string]: { - title: string; - path: string; - order: number; - subsection: string; - href: string; - frontMatter: any; - }[] & { subsection?: Set; title?: string; order?: number }; - } = {}; - - Object.keys(mods).forEach(key => { - let frontMatter = mods[key]; - let { - title = mods[key].getHeadings().find(h => h.depth === 1)?.text ?? "", - section = "", - order = 100 - } = frontMatter ?? {}; - if (!sections[section]) { - sections[section] = []; - } - - if (frontMatter?.subsection) { - if (!sections[section].subsection) { - sections[section].subsection = new Set(); - } - sections[section].subsection.add(frontMatter.subsection); - } - - if (frontMatter?.sectionTitle) { - sections[section].title = frontMatter.sectionTitle; - } - - if (frontMatter?.sectionOrder) { - sections[section].order = frontMatter.sectionOrder; - } - - sections[section].push({ - title, - path: key, - order, - frontMatter: frontMatter, - subsection: frontMatter?.subsection, - href: key.slice(`./routes`.length).replace(/\.mdx?$/, "") - }); - }); - - Object.keys(sections).forEach(key => { - sections[key].sort((a, b) => a.order - b.order); - }); - - return Object.values(sections).sort((a, b) => (a.order ?? 100) - (b.order ?? 100)); - }); - - return ( - +export default function App() { + const storageManager = cookieStorageManagerSSR( + isServer ? getServerCookies() : document.cookie ); -} -import { components } from "./components/components"; -import { useTableOfContents } from "./components/TableOfContents"; - -export default function Root() { return ( ( + root={(props) => ( - SolidStart (Release Candidate) -
    - - - - - -