fulldev-ui 0.7.0 → 0.9.0

package/src/styles/global.css

@@ -1,119 +1,133 @@
-/* For starlight */
-@layer base, starlight, theme, components, utilities;
-@import "@astrojs/starlight-tailwind";
-
 @import "tailwindcss";
 @import "tw-animate-css";
+@import "shadcn/tailwind.css";
 
 @custom-variant dark (&:is(.dark *));
 
 :root {
-  --spacing: 0.25rem;
-  --text: 1rem;
-  --heading: 2.25rem;
-  --radius: 0.65rem;
-  --container: var(--breakpoint-2xl);
-  --gutter: 24px;
-
   --background: oklch(1 0 0);
-  --foreground: oklch(0.141 0.005 285.823);
+  --foreground: oklch(0.145 0 0);
   --card: oklch(1 0 0);
-  --card-foreground: oklch(0.141 0.005 285.823);
+  --card-foreground: oklch(0.145 0 0);
   --popover: oklch(1 0 0);
-  --popover-foreground: oklch(0.141 0.005 285.823);
-  --primary: oklch(0.646 0.222 41.116);
-  --primary-foreground: #fff;
-  --secondary: oklch(0.967 0.001 286.375);
-  --secondary-foreground: oklch(0.21 0.006 285.885);
-  --muted: oklch(0.967 0.001 286.375);
-  --muted-foreground: oklch(0.552 0.016 285.938);
-  --accent: oklch(0.967 0.001 286.375);
-  --accent-foreground: oklch(0.21 0.006 285.885);
+  --popover-foreground: oklch(0.145 0 0);
+  --primary: oklch(0.5488 0.2498 261.783);
+  --primary-foreground: oklch(1 0 0);
+  --secondary: oklch(0.97 0 0);
+  --secondary-foreground: oklch(0.205 0 0);
+  --muted: oklch(0.97 0 0);
+  --muted-foreground: oklch(0.556 0 0);
+  --accent: oklch(0.97 0 0);
+  --accent-foreground: oklch(0.205 0 0);
   --destructive: oklch(0.577 0.245 27.325);
-  --border: oklch(0.92 0.004 286.32);
-  --input: oklch(0.92 0.004 286.32);
-  --ring: oklch(0.75 0.183 55.934);
-  --chart-1: oklch(0.837 0.128 66.29);
-  --chart-2: oklch(0.705 0.213 47.604);
-  --chart-3: oklch(0.646 0.222 41.116);
-  --chart-4: oklch(0.553 0.195 38.402);
-  --chart-5: oklch(0.47 0.157 37.304);
+  --destructive-foreground: oklch(1 0 0);
+  --border: oklch(0.922 0 0);
+  --input: oklch(0.922 0 0);
+  --ring: oklch(0.708 0 0);
+  --chart-1: oklch(0.81 0.1 252);
+  --chart-2: oklch(0.62 0.19 260);
+  --chart-3: oklch(0.55 0.22 263);
+  --chart-4: oklch(0.49 0.22 264);
+  --chart-5: oklch(0.42 0.18 266);
   --sidebar: oklch(0.985 0 0);
-  --sidebar-foreground: oklch(0.141 0.005 285.823);
-  --sidebar-primary: oklch(0.646 0.222 41.116);
-  --sidebar-primary-foreground: oklch(0.98 0.016 73.684);
-  --sidebar-accent: oklch(0.967 0.001 286.375);
-  --sidebar-accent-foreground: oklch(0.21 0.006 285.885);
-  --sidebar-border: oklch(0.92 0.004 286.32);
-  --sidebar-ring: oklch(0.75 0.183 55.934);
-
-  /* Starlight color palette */
-  --color-gray-50: var(--background);
-  --color-gray-100: var(--muted);
-  --color-gray-200: var(--muted);
-  --color-gray-300: var(--border);
-  --color-gray-400: red;
-  --color-gray-500: var(--muted-foreground);
-  --color-gray-600: var(--muted);
-  --color-gray-700: var(--foreground);
-  --color-gray-800: var(--border);
-  --color-gray-900: var(--foreground);
-  --color-gray-950: red;
-  /* not in tailwind adapter for starlight */
-  --sl-color-gray-1: var(--foreground);
+  --sidebar-foreground: oklch(0.145 0 0);
+  --sidebar-primary: oklch(0.5488 0.2498 261.783);
+  --sidebar-primary-foreground: oklch(1 0 0);
+  --sidebar-accent: oklch(0.97 0 0);
+  --sidebar-accent-foreground: oklch(0.205 0 0);
+  --sidebar-border: oklch(0.922 0 0);
+  --sidebar-ring: oklch(0.708 0 0);
+  --radius: 0.625rem;
+  --shadow-x: 0;
+  --shadow-y: 1px;
+  --shadow-blur: 3px;
+  --shadow-spread: 0px;
+  --shadow-opacity: 0.1;
+  --shadow-color: oklch(0 0 0);
+  --shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
+  --shadow-xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
+  --shadow-sm:
+    0 1px 3px 0px hsl(0 0% 0% / 0.1), 0 1px 2px -1px hsl(0 0% 0% / 0.1);
+  --shadow: 0 1px 3px 0px hsl(0 0% 0% / 0.1), 0 1px 2px -1px hsl(0 0% 0% / 0.1);
+  --shadow-md:
+    0 1px 3px 0px hsl(0 0% 0% / 0.1), 0 2px 4px -1px hsl(0 0% 0% / 0.1);
+  --shadow-lg:
+    0 1px 3px 0px hsl(0 0% 0% / 0.1), 0 4px 6px -1px hsl(0 0% 0% / 0.1);
+  --shadow-xl:
+    0 1px 3px 0px hsl(0 0% 0% / 0.1), 0 8px 10px -1px hsl(0 0% 0% / 0.1);
+  --shadow-2xl: 0 1px 3px 0px hsl(0 0% 0% / 0.25);
+  --tracking-normal: 0em;
+  --spacing: 0.25rem;
 }
 
-[data-theme="dark"],
 .dark {
-  --background: oklch(0.141 0.005 285.823);
+  --background: oklch(0.145 0 0);
   --foreground: oklch(0.985 0 0);
-  --card: oklch(0.21 0.006 285.885);
+  --card: oklch(0.205 0 0);
   --card-foreground: oklch(0.985 0 0);
-  --popover: oklch(0.21 0.006 285.885);
+  --popover: oklch(0.269 0 0);
   --popover-foreground: oklch(0.985 0 0);
-  --primary: oklch(0.705 0.213 47.604);
-  --primary-foreground: #fff;
-  --secondary: oklch(0.274 0.006 286.033);
+  --primary: oklch(0.686 0.2105 41.139);
+  --primary-foreground: oklch(0.145 0 0);
+  --secondary: oklch(0.269 0 0);
   --secondary-foreground: oklch(0.985 0 0);
-  --muted: oklch(0.274 0.006 286.033);
-  --muted-foreground: oklch(0.705 0.015 286.067);
-  --accent: oklch(0.274 0.006 286.033);
+  --muted: oklch(0.269 0 0);
+  --muted-foreground: oklch(0.708 0 0);
+  --accent: oklch(0.371 0 0);
   --accent-foreground: oklch(0.985 0 0);
   --destructive: oklch(0.704 0.191 22.216);
-  --border: oklch(1 0 0 / 10%);
-  --input: oklch(1 0 0 / 15%);
-  --ring: oklch(0.408 0.123 38.172);
-  --chart-1: oklch(0.837 0.128 66.29);
-  --chart-2: oklch(0.705 0.213 47.604);
-  --chart-3: oklch(0.646 0.222 41.116);
-  --chart-4: oklch(0.553 0.195 38.402);
-  --chart-5: oklch(0.47 0.157 37.304);
-  --sidebar: oklch(0.21 0.006 285.885);
+  --destructive-foreground: oklch(0.985 0 0);
+  --border: oklch(0.275 0 0);
+  --input: oklch(0.325 0 0);
+  --ring: oklch(0.556 0 0);
+  --chart-1: oklch(0.81 0.1 252);
+  --chart-2: oklch(0.62 0.19 260);
+  --chart-3: oklch(0.55 0.22 263);
+  --chart-4: oklch(0.49 0.22 264);
+  --chart-5: oklch(0.42 0.18 266);
+  --sidebar: oklch(0.205 0 0);
   --sidebar-foreground: oklch(0.985 0 0);
-  --sidebar-primary: oklch(0.705 0.213 47.604);
-  --sidebar-primary-foreground: oklch(0.98 0.016 73.684);
-  --sidebar-accent: oklch(0.274 0.006 286.033);
+  --sidebar-primary: oklch(0.686 0.2105 41.139);
+  --sidebar-primary-foreground: oklch(0.145 0 0);
+  --sidebar-accent: oklch(0.269 0 0);
   --sidebar-accent-foreground: oklch(0.985 0 0);
-  --sidebar-border: oklch(1 0 0 / 10%);
-  --sidebar-ring: oklch(0.408 0.123 38.172);
-
-  /* Starlight color palette */
-  --color-gray-50: red;
-  --color-gray-100: red;
-  --color-gray-200: var(--foreground); /* themer button */
-  --color-gray-300: var(--foreground); /* sidebar links and docs text */
-  --color-gray-400: var(--muted-foreground); /* toc text */
-  --color-gray-500: red;
-  --color-gray-600: red;
-  --color-gray-700: var(--border); /* border */
-  --color-gray-800: var(--muted); /* sidebar, header, code */
-  --color-gray-900: var(--background); /* body */
-  --color-gray-950: var(--background);
-  --sl-font: "Inter", sans-serif;
-  --__sl-font: "Inter", sans-serif;
+  --sidebar-border: oklch(0.275 0 0);
+  --sidebar-ring: oklch(0.439 0 0);
+  --radius: 0.625rem;
+  --shadow-x: 0;
+  --shadow-y: 1px;
+  --shadow-blur: 3px;
+  --shadow-spread: 0px;
+  --shadow-opacity: 0.1;
+  --shadow-color: oklch(0 0 0);
+  --shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
+  --shadow-xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
+  --shadow-sm:
+    0 1px 3px 0px hsl(0 0% 0% / 0.1), 0 1px 2px -1px hsl(0 0% 0% / 0.1);
+  --shadow: 0 1px 3px 0px hsl(0 0% 0% / 0.1), 0 1px 2px -1px hsl(0 0% 0% / 0.1);
+  --shadow-md:
+    0 1px 3px 0px hsl(0 0% 0% / 0.1), 0 2px 4px -1px hsl(0 0% 0% / 0.1);
+  --shadow-lg:
+    0 1px 3px 0px hsl(0 0% 0% / 0.1), 0 4px 6px -1px hsl(0 0% 0% / 0.1);
+  --shadow-xl:
+    0 1px 3px 0px hsl(0 0% 0% / 0.1), 0 8px 10px -1px hsl(0 0% 0% / 0.1);
+  --shadow-2xl: 0 1px 3px 0px hsl(0 0% 0% / 0.25);
 }
 
 @theme inline {
+  --font-sans: var(--font-geist-sans, ui-sans-serif, system-ui, sans-serif);
+  --font-mono: var(
+    --font-geist-mono,
+    ui-monospace,
+    SFMono-Regular,
+    Menlo,
+    Monaco,
+    Consolas,
+    "Liberation Mono",
+    "Courier New",
+    monospace
+  );
+
   --color-background: var(--background);
   --color-foreground: var(--foreground);
   --color-card: var(--card);
@@ -138,10 +152,6 @@
   --color-chart-3: var(--chart-3);
   --color-chart-4: var(--chart-4);
   --color-chart-5: var(--chart-5);
-  --radius-sm: calc(var(--radius) - 4px);
-  --radius-md: calc(var(--radius) - 2px);
-  --radius-lg: var(--radius);
-  --radius-xl: calc(var(--radius) + 4px);
   --color-sidebar: var(--sidebar);
   --color-sidebar-foreground: var(--sidebar-foreground);
   --color-sidebar-primary: var(--sidebar-primary);
@@ -151,29 +161,19 @@
   --color-sidebar-border: var(--sidebar-border);
   --color-sidebar-ring: var(--sidebar-ring);
 
-  /* primary color */
-  --color-accent-50: var(--color-orange-50);
-  --color-accent-100: var(--color-orange-100);
-  --color-accent-200: var(--color-orange-200);
-  --color-accent-300: var(--color-orange-300);
-  --color-accent-400: var(--color-orange-400);
-  --color-accent-500: var(--color-orange-500);
-  --color-accent-600: var(--color-orange-600);
-  --color-accent-700: var(--color-orange-700);
-  --color-accent-800: var(--color-orange-800);
-  --color-accent-900: var(--color-orange-900);
-  --color-accent-950: var(--color-orange-950);
-
-  --text-xs: calc(var(--text) - 0.25rem);
-  --text-sm: calc(var(--text) - 0.125rem);
-  --text-base: var(--text);
-  --text-lg: calc(var(--text) + 0.125rem);
-  --text-xl: calc(var(--text) + 0.25rem);
+  --radius-sm: calc(var(--radius) - 4px);
+  --radius-md: calc(var(--radius) - 2px);
+  --radius-lg: var(--radius);
+  --radius-xl: calc(var(--radius) + 4px);
 
-  --text-2xl: calc(var(--heading) * (4 / 6));
-  --text-3xl: calc(var(--heading) * (5 / 6));
-  --text-4xl: var(--heading);
-  --text-5xl: calc(var(--heading) * (8 / 6));
+  --shadow-2xs: var(--shadow-2xs);
+  --shadow-xs: var(--shadow-xs);
+  --shadow-sm: var(--shadow-sm);
+  --shadow: var(--shadow);
+  --shadow-md: var(--shadow-md);
+  --shadow-lg: var(--shadow-lg);
+  --shadow-xl: var(--shadow-xl);
+  --shadow-2xl: var(--shadow-2xl);
 }
 
 @layer base {
@@ -181,51 +181,9 @@
     @apply border-border outline-ring/50;
   }
   html {
-    @apply bg-background scroll-smooth;
+    @apply font-sans;
   }
   body {
-    @apply bg-background text-foreground;
-  }
-  [data-slot="header"],
-  [data-slot="banner"] {
-    --container: 100%;
+    @apply bg-background text-foreground font-sans;
   }
-  [data-slot="logo-image"] {
-    @apply h-6.5!;
-  }
-}
-
-/* Starlight overrides */
-@layer theme {
-  .page {
-    --sl-nav-height: 61px;
-    background-color: var(--background);
-  }
-
-  .page > .header {
-    @apply bg-background h-16 border-b border-gray-800 py-0!;
-  }
-
-  .page > .sidebar > .sidebar-pane {
-    @apply bg-background border-r border-gray-800;
-  }
-
-  .social-icons {
-    @apply hidden;
-  }
-
-  .sl-badge.success.small {
-    @apply inline-flex size-3 scale-50 animate-pulse items-center justify-center rounded-full border-none bg-orange-600 text-orange-600;
-  }
-
-  :root {
-    --sl-font: "Inter", sans-serif;
-    --__sl-font: "Inter", sans-serif;
-  }
-}
-
-@utility inset-y {
-  height: calc(100% + 2 * var(--section-py));
-  margin-top: calc(-1 * var(--section-py));
-  margin-bottom: calc(-1 * var(--section-py));
 }

package/.editorconfig

@@ -1,10 +0,0 @@
-# editorconfig.org
-root = true
-
-[*]
-charset = utf-8
-end_of_line = lf
-indent_size = 2
-indent_style = space
-insert_final_newline = true
-trim_trailing_whitespace = true

package/.github/CODEOWNERS

@@ -1,2 +0,0 @@
-# Make silveltman code owners for the entire repository
-* @silveltman

package/.github/ISSUE_TEMPLATE/bug_report.yml

@@ -1,12 +0,0 @@
-name: "Bug report"
-description: Report a bug or issue
-labels: ["bug"]
-body:
-  - type: textarea
-    id: description
-    attributes:
-      label: Describe the bug or issue
-      description: Be clear and concise. Add logs and/or screenshots if applicable.
-      placeholder: Add your bug or issue description here...
-    validations:
-      required: true

package/.github/ISSUE_TEMPLATE/config.yml

@@ -1,8 +0,0 @@
-blank_issues_enabled: false
-contact_buttons:
-  - name: Add your site to our showcase
-    url: https://github.com/fulldotdev/ui/blob/main/CONTRIBUTING.md#showcase
-    about: Add your project to the showcase page and get featured on our website.
-  - name: Get Help on Discord
-    url: https://discord.gg/tdmUyH2YE4
-    about: If you can't get something to work, open a forum post in our Discord server.

package/.github/ISSUE_TEMPLATE/documentation.yml

@@ -1,12 +0,0 @@
-name: "Documentation"
-description: Issues and suggestions regarding documentation
-labels: ["docs"]
-body:
-  - type: textarea
-    id: description
-    attributes:
-      label: Describe the issue or suggestion
-      description: Be clear and concise. Add logs and/or screenshots if applicable.
-      placeholder: Add your issue or suggestion description here...
-    validations:
-      required: true

package/.github/ISSUE_TEMPLATE/feature_request.yml

@@ -1,12 +0,0 @@
-name: "Feature"
-description: Propose and discuss improvements
-labels: ["feature"]
-body:
-  - type: textarea
-    id: description
-    attributes:
-      label: Describe the feature
-      description: Be clear and concise. Add logs and/or screenshots if applicable.
-      placeholder: Add your feature description here...
-    validations:
-      required: true

package/.github/ISSUE_TEMPLATE/support.yml

@@ -1,12 +0,0 @@
-name: "Support"
-description: Ask a question or request help
-labels: ["support"]
-body:
-  - type: textarea
-    id: description
-    attributes:
-      label: Describe your question or request
-      description: Be clear and concise. Add logs and/or screenshots if applicable.
-      placeholder: Add your question or request description here...
-    validations:
-      required: true

package/.nvmrc

@@ -1 +0,0 @@
-v20.5.1

package/.prettierignore

@@ -1,21 +0,0 @@
-# folders
-.astro/
-.netlify/
-dist/
-.stackbit/
-node_modules/
-
-# logs
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
-pnpm-debug.log*
-
-# Lock files
-pnpm-lock.yaml
-package-lock.json
-yarn.lock
-bun.lockb
-
-# misc
-**/.DS_Store

package/CODE_OF_CONDUCT.md

@@ -1,7 +0,0 @@
-# Contributor Code of Conduct
-
-We accept and encourage everyone's contributions. It doesn't matter how you look, how you feel, where you're from, or anything like that. In fact, we won't bring it up, or ask.
-
-We are here to build great software, to learn, to grow, and to help each other. Maybe make some friends along the way.
-
-If you have any questions, please reach out!

package/CONTRIBUTING.md

@@ -1,142 +0,0 @@
-# Contributing to Fulldev UI
-
-Thank you for your interest in contributing to Fulldev UI! We welcome contributions from everyone.
-
-## Code of Conduct
-
-We are here to build great software, learn, grow, and help each other. Please read our [Code of Conduct](CODE_OF_CONDUCT.md) before contributing.
-
-## Getting Started
-
-### Prerequisites
-
-- Node.js 18 or higher
-- pnpm (recommended package manager)
-- Git
-
-### Setup
-
-1. **Fork and clone the repository**:
-
-```bash
-git clone https://github.com/your-username/ui.git
-cd ui
-```
-
-2. **Install dependencies**:
-
-```bash
-pnpm install
-```
-
-3. **Start the development server**:
-
-```bash
-pnpm dev
-```
-
-## How to Contribute
-
-### Reporting Bugs
-
-1. Check if the bug has already been reported in [Issues](https://github.com/fulldotdev/ui/issues)
-2. If not, create a new issue using the bug report template
-3. Provide clear steps to reproduce the issue
-4. Include screenshots or code snippets if applicable
-
-### Requesting Features
-
-1. Check if the feature has already been requested in [Issues](https://github.com/fulldotdev/ui/issues)
-2. Create a new issue using the feature request template
-3. Clearly describe the feature and its use case
-
-### Submitting Code
-
-1. **Create a new branch**:
-
-```bash
-git checkout -b feature/your-feature-name
-```
-
-2. **Make your changes**:
-   - Follow existing code style and conventions
-   - Use TypeScript for type safety
-   - Follow Astro component best practices
-   - Ensure components follow the shared schema in `src/lib/schemas.ts`
-
-3. **Test your changes**:
-
-```bash
-pnpm check    # Type checking
-pnpm build    # Build the project
-```
-
-4. **Commit your changes**:
-
-```bash
-git commit -m "feat: add new component"
-```
-
-5. **Push and create a Pull Request**:
-
-```bash
-git push origin feature/your-feature-name
-```
-
-Then create a PR on GitHub with a clear description of your changes.
-
-## Component Guidelines
-
-### Creating New Components
-
-1. Place component files in `src/components/ui/[component-name]/`
-2. Follow the naming convention: use single-word names when possible
-3. Use Astro component syntax (`.astro` files)
-4. Include TypeScript types for props
-5. Use Tailwind CSS for styling with primary/secondary color variables
-6. Avoid modifying existing shadcn components to prevent confusion
-
-### Example Component Structure
-
-```astro
----
-interface Props {
-  title?: string
-  variant?: "default" | "outline"
-}
-
-const { title, variant = "default" } = Astro.props
-
-const slot = await Astro.slots.render("default")
----
-
-<div class="component-name">
-  {title && <h2>{title}</h2>}
-  <Fragment set:html={slot} />
-</div>
-```
-
-## Development Workflow
-
-### Building
-
-```bash
-pnpm build          # Build the project
-pnpm build:prod     # Type check + build
-pnpm build:test     # Type check + build + preview
-```
-
-### Registry
-
-```bash
-pnpm registry:build    # Build the component registry
-```
-
-## Questions?
-
-- Join our [Discord server](https://discord.gg/tdmUyH2YE4)
-- Reach out via [email](mailto:contact@full.dev)
-
-## License
-
-By contributing to fulldev/ui, you agree that your contributions will be licensed under the MIT License.

package/ai/website-quality-checklist.md

@@ -1,33 +0,0 @@
-# Website Quality Checklist
-
-If you're an AI, run this checklist **without scripts/commands/CLI** except when it is explicitly stated. Also don't generate a report file, just fix the issues.
-
-## Automated Tests
-
-Run the following commands to check for errors:
-
-- [ ] `pnpm check` - no errors
-- [ ] `pnpm build` - no errors
-
-## Content
-
-Look at all files in src/content/ and check for:
-
-- [ ] No placeholder text (dots, TODOs, temp text)
-- [ ] No empty headers
-- [ ] No trailing whitespace
-- [ ] No spelling/grammar errors
-- [ ] All page titles approximately 50-60 characters
-- [ ] All page descriptions approximately 150-160 characters
-- [ ] All image paths are relative (not absolute)
-- [ ] All images have descriptive alt text
-
-## Links
-
-Run `pnpm dev`, open the website in the browser on the port logged after the dev command. Based on src/content/pages/\*\* you should be able to navigate to all pages and check for:
-
-- [ ] No broken links
-- [ ] Website is responsive
-- [ ] No errors or logs in console
-- [ ] No missing images
-- [ ] No weird layout issues