mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-04-20 06:20:11 +00:00
cc3acebceb
## Summary Scaffolds the new apps/website/ Astro 5 + Vue 3 marketing site inside the monorepo. ## Changes - apps/website/ with package.json, astro.config.mjs, tsconfig, Nx targets - @comfyorg/design-system/css/base.css — brand tokens + fonts (no PrimeVue) - pnpm-workspace.yaml catalog entries for Astro deps - .gitignore and env.d.ts for Astro ## Stack (via Graphite) - **[1/3] Scaffold** ← this PR - #10141 [2/3] Layout Shell - #10142 [3/3] Homepage Sections Part of the comfy.org website refresh (replacing Framer). ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-10140-feat-scaffold-Astro-5-website-app-design-system-base-css-1-3-3266d73d365081688dcee0220a03eca4) by [Unito](https://www.unito.io)
47 lines
1.1 KiB
CSS
47 lines
1.1 KiB
CSS
/*
|
|
* Design System Base — Brand tokens + fonts only.
|
|
* For marketing sites that don't use PrimeVue or the node editor.
|
|
* Import the full style.css instead for the desktop app.
|
|
*/
|
|
|
|
@import './fonts.css';
|
|
|
|
@theme {
|
|
/* Font Families */
|
|
--font-inter: 'Inter', sans-serif;
|
|
|
|
/* Palette Colors */
|
|
--color-charcoal-100: #55565e;
|
|
--color-charcoal-200: #494a50;
|
|
--color-charcoal-300: #3c3d42;
|
|
--color-charcoal-400: #313235;
|
|
--color-charcoal-500: #2d2e32;
|
|
--color-charcoal-600: #262729;
|
|
--color-charcoal-700: #202121;
|
|
--color-charcoal-800: #171718;
|
|
|
|
--color-neutral-550: #636363;
|
|
|
|
--color-ash-300: #bbbbbb;
|
|
--color-ash-500: #828282;
|
|
--color-ash-800: #444444;
|
|
|
|
--color-smoke-100: #f3f3f3;
|
|
--color-smoke-200: #e9e9e9;
|
|
--color-smoke-300: #e1e1e1;
|
|
--color-smoke-400: #d9d9d9;
|
|
--color-smoke-500: #c5c5c5;
|
|
--color-smoke-600: #b4b4b4;
|
|
--color-smoke-700: #a0a0a0;
|
|
--color-smoke-800: #8a8a8a;
|
|
|
|
--color-white: #ffffff;
|
|
--color-black: #000000;
|
|
|
|
/* Brand Colors */
|
|
--color-electric-400: #f0ff41;
|
|
--color-sapphire-700: #172dd7;
|
|
--color-brand-yellow: var(--color-electric-400);
|
|
--color-brand-blue: var(--color-sapphire-700);
|
|
}
|