feat: whyrating - initial project from turbostarter boilerplate
This commit is contained in:
Alejandro Gutiérrez
51
packages/ui/shared/src/styles/globals.css
Normal file
51
packages/ui/shared/src/styles/globals.css
Normal file
@@ -0,0 +1,51 @@
|
||||
@import "tailwindcss";
|
||||
@import "./themes/variables.css";
|
||||
|
||||
@custom-variant light (&:is(.light *));
|
||||
@custom-variant dark (&:is(.dark *));
|
||||
|
||||
:root {
|
||||
--radius: 0.65rem;
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
--color-card: var(--card);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-popover: var(--popover);
|
||||
--color-popover-foreground: var(--popover-foreground);
|
||||
--color-primary: var(--primary);
|
||||
--color-primary-foreground: var(--primary-foreground);
|
||||
--color-secondary: var(--secondary);
|
||||
--color-secondary-foreground: var(--secondary-foreground);
|
||||
--color-muted: var(--muted);
|
||||
--color-muted-foreground: var(--muted-foreground);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-foreground: var(--accent-foreground);
|
||||
--color-destructive: var(--destructive);
|
||||
--color-destructive-foreground: var(--destructive-foreground);
|
||||
--color-success: var(--success);
|
||||
--color-success-foreground: var(--success-foreground);
|
||||
--color-border: var(--border);
|
||||
--color-input: var(--input);
|
||||
--color-ring: var(--ring);
|
||||
--color-chart-1: var(--chart-1);
|
||||
--color-chart-2: var(--chart-2);
|
||||
--color-chart-3: var(--chart-3);
|
||||
--color-chart-4: var(--chart-4);
|
||||
--color-chart-5: var(--chart-5);
|
||||
--color-sidebar: var(--sidebar);
|
||||
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||
--color-sidebar-primary: var(--sidebar-primary);
|
||||
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||
--color-sidebar-accent: var(--sidebar-accent);
|
||||
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||
--color-sidebar-border: var(--sidebar-border);
|
||||
--color-sidebar-ring: var(--sidebar-ring);
|
||||
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
--radius-xl: calc(var(--radius) + 4px);
|
||||
}
|
||||
86
packages/ui/shared/src/styles/themes/build.ts
Normal file
86
packages/ui/shared/src/styles/themes/build.ts
Normal file
@@ -0,0 +1,86 @@
|
||||
import * as fs from "fs";
|
||||
import * as path from "path";
|
||||
import { fileURLToPath } from "url";
|
||||
|
||||
import { themes } from "./themes";
|
||||
|
||||
import type { ColorVariable, ThemeColorsVariables } from "../../types";
|
||||
|
||||
const OUTPUT_PATH = "variables.css";
|
||||
|
||||
const oklchToString = (l: number, c: number, h: number, a?: number) =>
|
||||
`oklch(${l} ${c} ${h}${a ? ` / ${a * 100}%` : ""})`;
|
||||
|
||||
const indent = (level: number) => " ".repeat(level);
|
||||
|
||||
const generateCSSVariables = (theme: ThemeColorsVariables, indentLevel = 0) =>
|
||||
Object.entries(theme)
|
||||
.map(
|
||||
([key, value]: [string, ColorVariable]) =>
|
||||
// @ts-expect-error - value is actually a tuple
|
||||
`${indent(indentLevel)}--${key}: ${oklchToString(...value)};`,
|
||||
)
|
||||
.join("\n");
|
||||
|
||||
const generateThemeCSS = () => {
|
||||
const themeEntries = Object.entries(themes);
|
||||
const defaultTheme = themeEntries[0]?.[1];
|
||||
|
||||
if (!defaultTheme) {
|
||||
throw new Error("No themes found");
|
||||
}
|
||||
|
||||
const generatedFileHeader = [
|
||||
"/*",
|
||||
" * This file is auto-generated. Do NOT edit it directly.",
|
||||
" *",
|
||||
" * Edit the theme source files instead:",
|
||||
" * - ./themes.ts",
|
||||
" * - ./colors/*.ts",
|
||||
" */",
|
||||
"",
|
||||
].join("\n");
|
||||
|
||||
const defaultThemeCss = [
|
||||
`${indent(2)}@variant light {`,
|
||||
generateCSSVariables(defaultTheme.light, 3),
|
||||
`${indent(2)}}`,
|
||||
"",
|
||||
`${indent(2)}@variant dark {`,
|
||||
generateCSSVariables(defaultTheme.dark, 3),
|
||||
`${indent(2)}}`,
|
||||
].join("\n");
|
||||
|
||||
const themeCss = themeEntries
|
||||
.map(([themeName, { light, dark }]) =>
|
||||
[
|
||||
`${indent(2)}[data-theme="${themeName}"] {`,
|
||||
generateCSSVariables(light, 3),
|
||||
"",
|
||||
`${indent(3)}@variant dark {`,
|
||||
generateCSSVariables(dark, 4),
|
||||
`${indent(3)}}`,
|
||||
`${indent(2)}}`,
|
||||
].join("\n"),
|
||||
)
|
||||
.join("\n\n");
|
||||
|
||||
return [
|
||||
generatedFileHeader,
|
||||
"@layer theme {",
|
||||
`${indent(1)}:root {`,
|
||||
defaultThemeCss,
|
||||
"",
|
||||
themeCss,
|
||||
`${indent(1)}}`,
|
||||
"}",
|
||||
].join("\n");
|
||||
};
|
||||
|
||||
const outputPath = path.join(
|
||||
path.dirname(fileURLToPath(import.meta.url)),
|
||||
`./${OUTPUT_PATH}`,
|
||||
);
|
||||
|
||||
fs.writeFileSync(outputPath, `${generateThemeCSS()}\n`, "utf8");
|
||||
console.log(`CSS file generated at: ${outputPath}`);
|
||||
78
packages/ui/shared/src/styles/themes/colors/blue.ts
Normal file
78
packages/ui/shared/src/styles/themes/colors/blue.ts
Normal file
@@ -0,0 +1,78 @@
|
||||
import { ThemeMode } from "../../../types";
|
||||
|
||||
import type { ThemeColors } from "../../../types";
|
||||
|
||||
export const blue = {
|
||||
[ThemeMode.LIGHT]: {
|
||||
background: [1, 0, 0],
|
||||
foreground: [0.141, 0.005, 285.823],
|
||||
card: [1, 0, 0],
|
||||
"card-foreground": [0.141, 0.005, 285.823],
|
||||
popover: [1, 0, 0],
|
||||
"popover-foreground": [0.141, 0.005, 285.823],
|
||||
primary: [0.623, 0.214, 259.815],
|
||||
"primary-foreground": [0.97, 0.014, 254.604],
|
||||
secondary: [0.967, 0.001, 286.375],
|
||||
"secondary-foreground": [0.21, 0.006, 285.885],
|
||||
muted: [0.967, 0.001, 286.375],
|
||||
"muted-foreground": [0.552, 0.016, 285.938],
|
||||
accent: [0.967, 0.001, 286.375],
|
||||
"accent-foreground": [0.21, 0.006, 285.885],
|
||||
destructive: [0.577, 0.245, 27.325],
|
||||
"destructive-foreground": [0.985, 0.002, 247.839],
|
||||
success: [0.7999, 0.1816, 151.78],
|
||||
"success-foreground": [0.9848, 0, 0],
|
||||
border: [0.92, 0.004, 286.32],
|
||||
input: [0.92, 0.004, 286.32],
|
||||
ring: [0.623, 0.214, 259.815],
|
||||
"chart-1": [0.809, 0.105, 251.813],
|
||||
"chart-2": [0.623, 0.214, 259.815],
|
||||
"chart-3": [0.546, 0.245, 262.881],
|
||||
"chart-4": [0.488, 0.243, 264.376],
|
||||
"chart-5": [0.424, 0.199, 265.638],
|
||||
sidebar: [0.985, 0, 0],
|
||||
"sidebar-foreground": [0.141, 0.005, 285.823],
|
||||
"sidebar-primary": [0.623, 0.214, 259.815],
|
||||
"sidebar-primary-foreground": [0.97, 0.014, 254.604],
|
||||
"sidebar-accent": [0.967, 0.001, 286.375],
|
||||
"sidebar-accent-foreground": [0.21, 0.006, 285.885],
|
||||
"sidebar-border": [0.92, 0.004, 286.32],
|
||||
"sidebar-ring": [0.623, 0.214, 259.815],
|
||||
},
|
||||
[ThemeMode.DARK]: {
|
||||
background: [0.141, 0.005, 285.823],
|
||||
foreground: [0.985, 0, 0],
|
||||
card: [0.21, 0.006, 285.885],
|
||||
"card-foreground": [0.985, 0, 0],
|
||||
popover: [0.21, 0.006, 285.885],
|
||||
"popover-foreground": [0.985, 0, 0],
|
||||
primary: [0.546, 0.245, 262.881],
|
||||
"primary-foreground": [0.379, 0.146, 265.522],
|
||||
secondary: [0.274, 0.006, 286.033],
|
||||
"secondary-foreground": [0.985, 0, 0],
|
||||
muted: [0.274, 0.006, 286.033],
|
||||
"muted-foreground": [0.705, 0.015, 286.067],
|
||||
accent: [0.274, 0.006, 286.033],
|
||||
"accent-foreground": [0.985, 0, 0],
|
||||
destructive: [0.704, 0.191, 22.216],
|
||||
"destructive-foreground": [0.985, 0.002, 247.839],
|
||||
success: [0.627, 0.194, 149.214],
|
||||
"success-foreground": [0.985, 0, 0],
|
||||
border: [1, 0, 0, 0.1],
|
||||
input: [1, 0, 0, 0.15],
|
||||
ring: [0.488, 0.243, 264.376],
|
||||
"chart-1": [0.809, 0.105, 251.813],
|
||||
"chart-2": [0.623, 0.214, 259.815],
|
||||
"chart-3": [0.546, 0.245, 262.881],
|
||||
"chart-4": [0.488, 0.243, 264.376],
|
||||
"chart-5": [0.424, 0.199, 265.638],
|
||||
sidebar: [0.21, 0.006, 285.885],
|
||||
"sidebar-foreground": [0.985, 0, 0],
|
||||
"sidebar-primary": [0.546, 0.245, 262.881],
|
||||
"sidebar-primary-foreground": [0.379, 0.146, 265.522],
|
||||
"sidebar-accent": [0.274, 0.006, 286.033],
|
||||
"sidebar-accent-foreground": [0.985, 0, 0],
|
||||
"sidebar-border": [1, 0, 0, 0.1],
|
||||
"sidebar-ring": [0.488, 0.243, 264.376],
|
||||
},
|
||||
} satisfies ThemeColors;
|
||||
78
packages/ui/shared/src/styles/themes/colors/gray.ts
Normal file
78
packages/ui/shared/src/styles/themes/colors/gray.ts
Normal file
@@ -0,0 +1,78 @@
|
||||
import { ThemeMode } from "../../../types";
|
||||
|
||||
import type { ThemeColors } from "../../../types";
|
||||
|
||||
export const gray = {
|
||||
[ThemeMode.LIGHT]: {
|
||||
background: [1, 0, 0],
|
||||
foreground: [0.13, 0.028, 261.692],
|
||||
card: [1, 0, 0],
|
||||
"card-foreground": [0.13, 0.028, 261.692],
|
||||
popover: [1, 0, 0],
|
||||
"popover-foreground": [0.13, 0.028, 261.692],
|
||||
primary: [0.21, 0.034, 264.665],
|
||||
"primary-foreground": [0.985, 0.002, 247.839],
|
||||
secondary: [0.967, 0.003, 264.542],
|
||||
"secondary-foreground": [0.21, 0.034, 264.665],
|
||||
muted: [0.967, 0.003, 264.542],
|
||||
"muted-foreground": [0.551, 0.027, 264.364],
|
||||
accent: [0.967, 0.003, 264.542],
|
||||
"accent-foreground": [0.21, 0.034, 264.665],
|
||||
destructive: [0.577, 0.245, 27.325],
|
||||
"destructive-foreground": [0.985, 0.002, 247.839],
|
||||
success: [0.7999, 0.1816, 151.78],
|
||||
"success-foreground": [0.9848, 0, 0],
|
||||
border: [0.928, 0.006, 264.531],
|
||||
input: [0.928, 0.006, 264.531],
|
||||
ring: [0.707, 0.022, 261.325],
|
||||
"chart-1": [0.872, 0.01, 258.338],
|
||||
"chart-2": [0.551, 0.027, 264.364],
|
||||
"chart-3": [0.446, 0.03, 256.802],
|
||||
"chart-4": [0.373, 0.034, 259.733],
|
||||
"chart-5": [0.278, 0.033, 256.848],
|
||||
sidebar: [0.985, 0.002, 247.839],
|
||||
"sidebar-foreground": [0.13, 0.028, 261.692],
|
||||
"sidebar-primary": [0.21, 0.034, 264.665],
|
||||
"sidebar-primary-foreground": [0.985, 0.002, 247.839],
|
||||
"sidebar-accent": [0.967, 0.003, 264.542],
|
||||
"sidebar-accent-foreground": [0.21, 0.034, 264.665],
|
||||
"sidebar-border": [0.928, 0.006, 264.531],
|
||||
"sidebar-ring": [0.707, 0.022, 261.325],
|
||||
},
|
||||
[ThemeMode.DARK]: {
|
||||
background: [0.13, 0.028, 261.692],
|
||||
foreground: [0.985, 0.002, 247.839],
|
||||
card: [0.21, 0.034, 264.665],
|
||||
"card-foreground": [0.985, 0.002, 247.839],
|
||||
popover: [0.21, 0.034, 264.665],
|
||||
"popover-foreground": [0.985, 0.002, 247.839],
|
||||
primary: [0.928, 0.006, 264.531],
|
||||
"primary-foreground": [0.21, 0.034, 264.665],
|
||||
secondary: [0.278, 0.033, 256.848],
|
||||
"secondary-foreground": [0.985, 0.002, 247.839],
|
||||
muted: [0.278, 0.033, 256.848],
|
||||
"muted-foreground": [0.707, 0.022, 261.325],
|
||||
accent: [0.278, 0.033, 256.848],
|
||||
"accent-foreground": [0.985, 0.002, 247.839],
|
||||
destructive: [0.704, 0.191, 22.216],
|
||||
"destructive-foreground": [0.985, 0.002, 247.839],
|
||||
success: [0.627, 0.194, 149.214],
|
||||
"success-foreground": [0.985, 0, 0],
|
||||
border: [1, 0, 0, 0.1],
|
||||
input: [1, 0, 0, 0.15],
|
||||
ring: [0.551, 0.027, 264.364],
|
||||
"chart-1": [0.872, 0.01, 258.338],
|
||||
"chart-2": [0.551, 0.027, 264.364],
|
||||
"chart-3": [0.446, 0.03, 256.802],
|
||||
"chart-4": [0.373, 0.034, 259.733],
|
||||
"chart-5": [0.278, 0.033, 256.848],
|
||||
sidebar: [0.21, 0.034, 264.665],
|
||||
"sidebar-foreground": [0.985, 0.002, 247.839],
|
||||
"sidebar-primary": [0.488, 0.243, 264.376],
|
||||
"sidebar-primary-foreground": [0.985, 0.002, 247.839],
|
||||
"sidebar-accent": [0.278, 0.033, 256.848],
|
||||
"sidebar-accent-foreground": [0.985, 0.002, 247.839],
|
||||
"sidebar-border": [1, 0, 0, 0.1],
|
||||
"sidebar-ring": [0.551, 0.027, 264.364],
|
||||
},
|
||||
} satisfies ThemeColors;
|
||||
78
packages/ui/shared/src/styles/themes/colors/green.ts
Normal file
78
packages/ui/shared/src/styles/themes/colors/green.ts
Normal file
@@ -0,0 +1,78 @@
|
||||
import { ThemeMode } from "../../../types";
|
||||
|
||||
import type { ThemeColors } from "../../../types";
|
||||
|
||||
export const green = {
|
||||
[ThemeMode.LIGHT]: {
|
||||
background: [1, 0, 0],
|
||||
foreground: [0.141, 0.005, 285.823],
|
||||
card: [1, 0, 0],
|
||||
"card-foreground": [0.141, 0.005, 285.823],
|
||||
popover: [1, 0, 0],
|
||||
"popover-foreground": [0.141, 0.005, 285.823],
|
||||
primary: [0.723, 0.219, 149.579],
|
||||
"primary-foreground": [0.982, 0.018, 155.826],
|
||||
secondary: [0.967, 0.001, 286.375],
|
||||
"secondary-foreground": [0.21, 0.006, 285.885],
|
||||
muted: [0.967, 0.001, 286.375],
|
||||
"muted-foreground": [0.552, 0.016, 285.938],
|
||||
accent: [0.967, 0.001, 286.375],
|
||||
"accent-foreground": [0.21, 0.006, 285.885],
|
||||
destructive: [0.577, 0.245, 27.325],
|
||||
"destructive-foreground": [0.985, 0.002, 247.839],
|
||||
success: [0.7999, 0.1816, 151.78],
|
||||
"success-foreground": [0.9848, 0, 0],
|
||||
border: [0.92, 0.004, 286.32],
|
||||
input: [0.92, 0.004, 286.32],
|
||||
ring: [0.723, 0.219, 149.579],
|
||||
"chart-1": [0.871, 0.15, 154.449],
|
||||
"chart-2": [0.723, 0.219, 149.579],
|
||||
"chart-3": [0.627, 0.194, 149.214],
|
||||
"chart-4": [0.527, 0.154, 150.069],
|
||||
"chart-5": [0.448, 0.119, 151.328],
|
||||
sidebar: [0.985, 0, 0],
|
||||
"sidebar-foreground": [0.141, 0.005, 285.823],
|
||||
"sidebar-primary": [0.723, 0.219, 149.579],
|
||||
"sidebar-primary-foreground": [0.982, 0.018, 155.826],
|
||||
"sidebar-accent": [0.967, 0.001, 286.375],
|
||||
"sidebar-accent-foreground": [0.21, 0.006, 285.885],
|
||||
"sidebar-border": [0.92, 0.004, 286.32],
|
||||
"sidebar-ring": [0.723, 0.219, 149.579],
|
||||
},
|
||||
[ThemeMode.DARK]: {
|
||||
background: [0.141, 0.005, 285.823],
|
||||
foreground: [0.985, 0, 0],
|
||||
card: [0.21, 0.006, 285.885],
|
||||
"card-foreground": [0.985, 0, 0],
|
||||
popover: [0.21, 0.006, 285.885],
|
||||
"popover-foreground": [0.985, 0, 0],
|
||||
primary: [0.696, 0.17, 162.48],
|
||||
"primary-foreground": [0.393, 0.095, 152.535],
|
||||
secondary: [0.274, 0.006, 286.033],
|
||||
"secondary-foreground": [0.985, 0, 0],
|
||||
muted: [0.274, 0.006, 286.033],
|
||||
"muted-foreground": [0.705, 0.015, 286.067],
|
||||
accent: [0.274, 0.006, 286.033],
|
||||
"accent-foreground": [0.985, 0, 0],
|
||||
destructive: [0.704, 0.191, 22.216],
|
||||
"destructive-foreground": [0.985, 0.002, 247.839],
|
||||
success: [0.627, 0.194, 149.214],
|
||||
"success-foreground": [0.985, 0, 0],
|
||||
border: [1, 0, 0, 0.1],
|
||||
input: [1, 0, 0, 0.15],
|
||||
ring: [0.527, 0.154, 150.069],
|
||||
"chart-1": [0.871, 0.15, 154.449],
|
||||
"chart-2": [0.723, 0.219, 149.579],
|
||||
"chart-3": [0.627, 0.194, 149.214],
|
||||
"chart-4": [0.527, 0.154, 150.069],
|
||||
"chart-5": [0.448, 0.119, 151.328],
|
||||
sidebar: [0.21, 0.006, 285.885],
|
||||
"sidebar-foreground": [0.985, 0, 0],
|
||||
"sidebar-primary": [0.696, 0.17, 162.48],
|
||||
"sidebar-primary-foreground": [0.393, 0.095, 152.535],
|
||||
"sidebar-accent": [0.274, 0.006, 286.033],
|
||||
"sidebar-accent-foreground": [0.985, 0, 0],
|
||||
"sidebar-border": [1, 0, 0, 0.1],
|
||||
"sidebar-ring": [0.527, 0.154, 150.069],
|
||||
},
|
||||
} satisfies ThemeColors;
|
||||
78
packages/ui/shared/src/styles/themes/colors/orange.ts
Normal file
78
packages/ui/shared/src/styles/themes/colors/orange.ts
Normal file
@@ -0,0 +1,78 @@
|
||||
import { ThemeMode } from "../../../types";
|
||||
|
||||
import type { ThemeColors } from "../../../types";
|
||||
|
||||
export const orange = {
|
||||
[ThemeMode.LIGHT]: {
|
||||
background: [1, 0, 0],
|
||||
foreground: [0.141, 0.005, 285.823],
|
||||
card: [1, 0, 0],
|
||||
"card-foreground": [0.141, 0.005, 285.823],
|
||||
popover: [1, 0, 0],
|
||||
"popover-foreground": [0.141, 0.005, 285.823],
|
||||
primary: [0.6387, 0.2151, 36.46],
|
||||
"primary-foreground": [0.98, 0.016, 73.684],
|
||||
secondary: [0.967, 0.001, 286.375],
|
||||
"secondary-foreground": [0.21, 0.006, 285.885],
|
||||
muted: [0.967, 0.001, 286.375],
|
||||
"muted-foreground": [0.552, 0.016, 285.938],
|
||||
accent: [0.967, 0.001, 286.375],
|
||||
"accent-foreground": [0.21, 0.006, 285.885],
|
||||
destructive: [0.577, 0.245, 27.325],
|
||||
"destructive-foreground": [0.985, 0.002, 247.839],
|
||||
success: [0.7999, 0.1816, 151.78],
|
||||
"success-foreground": [0.9848, 0, 0],
|
||||
border: [0.92, 0.004, 286.32],
|
||||
input: [0.92, 0.004, 286.32],
|
||||
ring: [0.6387, 0.2151, 36.46],
|
||||
"chart-1": [0.6387, 0.2151, 36.46],
|
||||
"chart-2": [0.7027, 0.1783, 44.12],
|
||||
"chart-3": [0.7732, 0.1275, 51.73],
|
||||
"chart-4": [0.8478, 0.0818, 58.78],
|
||||
"chart-5": [0.92, 0.0421, 65.38],
|
||||
sidebar: [0.985, 0, 0],
|
||||
"sidebar-foreground": [0.141, 0.005, 285.823],
|
||||
"sidebar-primary": [0.6387, 0.2151, 36.46],
|
||||
"sidebar-primary-foreground": [0.98, 0.016, 73.684],
|
||||
"sidebar-accent": [0.967, 0.001, 286.375],
|
||||
"sidebar-accent-foreground": [0.21, 0.006, 285.885],
|
||||
"sidebar-border": [0.92, 0.004, 286.32],
|
||||
"sidebar-ring": [0.6387, 0.2151, 36.46],
|
||||
},
|
||||
[ThemeMode.DARK]: {
|
||||
background: [0.141, 0.005, 285.823],
|
||||
foreground: [0.985, 0, 0],
|
||||
card: [0.21, 0.006, 285.885],
|
||||
"card-foreground": [0.985, 0, 0],
|
||||
popover: [0.21, 0.006, 285.885],
|
||||
"popover-foreground": [0.985, 0, 0],
|
||||
primary: [0.6387, 0.2151, 36.46],
|
||||
"primary-foreground": [0.98, 0.016, 73.684],
|
||||
secondary: [0.274, 0.006, 286.033],
|
||||
"secondary-foreground": [0.985, 0, 0],
|
||||
muted: [0.274, 0.006, 286.033],
|
||||
"muted-foreground": [0.705, 0.015, 286.067],
|
||||
accent: [0.274, 0.006, 286.033],
|
||||
"accent-foreground": [0.985, 0, 0],
|
||||
destructive: [0.704, 0.191, 22.216],
|
||||
"destructive-foreground": [0.985, 0.002, 247.839],
|
||||
success: [0.627, 0.194, 149.214],
|
||||
"success-foreground": [0.985, 0, 0],
|
||||
border: [1, 0, 0, 0.1],
|
||||
input: [1, 0, 0, 0.15],
|
||||
ring: [0.6387, 0.2151, 36.46],
|
||||
"chart-1": [0.6387, 0.2151, 36.46],
|
||||
"chart-2": [0.7027, 0.1783, 44.12],
|
||||
"chart-3": [0.7732, 0.1275, 51.73],
|
||||
"chart-4": [0.8478, 0.0818, 58.78],
|
||||
"chart-5": [0.92, 0.0421, 65.38],
|
||||
sidebar: [0.21, 0.006, 285.885],
|
||||
"sidebar-foreground": [0.985, 0, 0],
|
||||
"sidebar-primary": [0.6387, 0.2151, 36.46],
|
||||
"sidebar-primary-foreground": [0.98, 0.016, 73.684],
|
||||
"sidebar-accent": [0.274, 0.006, 286.033],
|
||||
"sidebar-accent-foreground": [0.985, 0, 0],
|
||||
"sidebar-border": [1, 0, 0, 0.1],
|
||||
"sidebar-ring": [0.6387, 0.2151, 36.46],
|
||||
},
|
||||
} satisfies ThemeColors;
|
||||
78
packages/ui/shared/src/styles/themes/colors/red.ts
Normal file
78
packages/ui/shared/src/styles/themes/colors/red.ts
Normal file
@@ -0,0 +1,78 @@
|
||||
import { ThemeMode } from "../../../types";
|
||||
|
||||
import type { ThemeColors } from "../../../types";
|
||||
|
||||
export const red = {
|
||||
[ThemeMode.LIGHT]: {
|
||||
background: [1, 0, 0],
|
||||
foreground: [0.141, 0.005, 285.823],
|
||||
card: [1, 0, 0],
|
||||
"card-foreground": [0.141, 0.005, 285.823],
|
||||
popover: [1, 0, 0],
|
||||
"popover-foreground": [0.141, 0.005, 285.823],
|
||||
primary: [0.637, 0.237, 25.331],
|
||||
"primary-foreground": [0.971, 0.013, 17.38],
|
||||
secondary: [0.967, 0.001, 286.375],
|
||||
"secondary-foreground": [0.21, 0.006, 285.885],
|
||||
muted: [0.967, 0.001, 286.375],
|
||||
"muted-foreground": [0.552, 0.016, 285.938],
|
||||
accent: [0.967, 0.001, 286.375],
|
||||
"accent-foreground": [0.21, 0.006, 285.885],
|
||||
destructive: [0.577, 0.245, 27.325],
|
||||
"destructive-foreground": [0.985, 0.002, 247.839],
|
||||
success: [0.7999, 0.1816, 151.78],
|
||||
"success-foreground": [0.9848, 0, 0],
|
||||
border: [0.92, 0.004, 286.32],
|
||||
input: [0.92, 0.004, 286.32],
|
||||
ring: [0.637, 0.237, 25.331],
|
||||
"chart-1": [0.808, 0.114, 19.571],
|
||||
"chart-2": [0.637, 0.237, 25.331],
|
||||
"chart-3": [0.577, 0.245, 27.325],
|
||||
"chart-4": [0.505, 0.213, 27.518],
|
||||
"chart-5": [0.444, 0.177, 26.899],
|
||||
sidebar: [0.985, 0, 0],
|
||||
"sidebar-foreground": [0.141, 0.005, 285.823],
|
||||
"sidebar-primary": [0.637, 0.237, 25.331],
|
||||
"sidebar-primary-foreground": [0.971, 0.013, 17.38],
|
||||
"sidebar-accent": [0.967, 0.001, 286.375],
|
||||
"sidebar-accent-foreground": [0.21, 0.006, 285.885],
|
||||
"sidebar-border": [0.92, 0.004, 286.32],
|
||||
"sidebar-ring": [0.637, 0.237, 25.331],
|
||||
},
|
||||
[ThemeMode.DARK]: {
|
||||
background: [0.141, 0.005, 285.823],
|
||||
foreground: [0.985, 0, 0],
|
||||
card: [0.21, 0.006, 285.885],
|
||||
"card-foreground": [0.985, 0, 0],
|
||||
popover: [0.21, 0.006, 285.885],
|
||||
"popover-foreground": [0.985, 0, 0],
|
||||
primary: [0.637, 0.237, 25.331],
|
||||
"primary-foreground": [0.971, 0.013, 17.38],
|
||||
secondary: [0.274, 0.006, 286.033],
|
||||
"secondary-foreground": [0.985, 0, 0],
|
||||
muted: [0.274, 0.006, 286.033],
|
||||
"muted-foreground": [0.705, 0.015, 286.067],
|
||||
accent: [0.274, 0.006, 286.033],
|
||||
"accent-foreground": [0.985, 0, 0],
|
||||
destructive: [0.704, 0.191, 22.216],
|
||||
"destructive-foreground": [0.985, 0.002, 247.839],
|
||||
success: [0.627, 0.194, 149.214],
|
||||
"success-foreground": [0.985, 0, 0],
|
||||
border: [1, 0, 0, 0.1],
|
||||
input: [1, 0, 0, 0.15],
|
||||
ring: [0.637, 0.237, 25.331],
|
||||
"chart-1": [0.808, 0.114, 19.571],
|
||||
"chart-2": [0.637, 0.237, 25.331],
|
||||
"chart-3": [0.577, 0.245, 27.325],
|
||||
"chart-4": [0.505, 0.213, 27.518],
|
||||
"chart-5": [0.444, 0.177, 26.899],
|
||||
sidebar: [0.21, 0.006, 285.885],
|
||||
"sidebar-foreground": [0.985, 0, 0],
|
||||
"sidebar-primary": [0.637, 0.237, 25.331],
|
||||
"sidebar-primary-foreground": [0.971, 0.013, 17.38],
|
||||
"sidebar-accent": [0.274, 0.006, 286.033],
|
||||
"sidebar-accent-foreground": [0.985, 0, 0],
|
||||
"sidebar-border": [1, 0, 0, 0.1],
|
||||
"sidebar-ring": [0.637, 0.237, 25.331],
|
||||
},
|
||||
} satisfies ThemeColors;
|
||||
78
packages/ui/shared/src/styles/themes/colors/rose.ts
Normal file
78
packages/ui/shared/src/styles/themes/colors/rose.ts
Normal file
@@ -0,0 +1,78 @@
|
||||
import { ThemeMode } from "../../../types";
|
||||
|
||||
import type { ThemeColors } from "../../../types";
|
||||
|
||||
export const rose = {
|
||||
[ThemeMode.LIGHT]: {
|
||||
background: [1, 0, 0],
|
||||
foreground: [0.141, 0.005, 285.823],
|
||||
card: [1, 0, 0],
|
||||
"card-foreground": [0.141, 0.005, 285.823],
|
||||
popover: [1, 0, 0],
|
||||
"popover-foreground": [0.141, 0.005, 285.823],
|
||||
primary: [0.645, 0.246, 16.439],
|
||||
"primary-foreground": [0.969, 0.015, 12.422],
|
||||
secondary: [0.967, 0.001, 286.375],
|
||||
"secondary-foreground": [0.21, 0.006, 285.885],
|
||||
muted: [0.967, 0.001, 286.375],
|
||||
"muted-foreground": [0.552, 0.016, 285.938],
|
||||
accent: [0.967, 0.001, 286.375],
|
||||
"accent-foreground": [0.21, 0.006, 285.885],
|
||||
destructive: [0.577, 0.245, 27.325],
|
||||
"destructive-foreground": [0.985, 0.002, 247.839],
|
||||
success: [0.7999, 0.1816, 151.78],
|
||||
"success-foreground": [0.9848, 0, 0],
|
||||
border: [0.92, 0.004, 286.32],
|
||||
input: [0.92, 0.004, 286.32],
|
||||
ring: [0.645, 0.246, 16.439],
|
||||
"chart-1": [0.81, 0.117, 11.638],
|
||||
"chart-2": [0.645, 0.246, 16.439],
|
||||
"chart-3": [0.586, 0.253, 17.585],
|
||||
"chart-4": [0.514, 0.222, 16.935],
|
||||
"chart-5": [0.455, 0.188, 13.697],
|
||||
sidebar: [0.985, 0, 0],
|
||||
"sidebar-foreground": [0.141, 0.005, 285.823],
|
||||
"sidebar-primary": [0.645, 0.246, 16.439],
|
||||
"sidebar-primary-foreground": [0.969, 0.015, 12.422],
|
||||
"sidebar-accent": [0.967, 0.001, 286.375],
|
||||
"sidebar-accent-foreground": [0.21, 0.006, 285.885],
|
||||
"sidebar-border": [0.92, 0.004, 286.32],
|
||||
"sidebar-ring": [0.645, 0.246, 16.439],
|
||||
},
|
||||
[ThemeMode.DARK]: {
|
||||
background: [0.141, 0.005, 285.823],
|
||||
foreground: [0.985, 0, 0],
|
||||
card: [0.21, 0.006, 285.885],
|
||||
"card-foreground": [0.985, 0, 0],
|
||||
popover: [0.21, 0.006, 285.885],
|
||||
"popover-foreground": [0.985, 0, 0],
|
||||
primary: [0.645, 0.246, 16.439],
|
||||
"primary-foreground": [0.969, 0.015, 12.422],
|
||||
secondary: [0.274, 0.006, 286.033],
|
||||
"secondary-foreground": [0.985, 0, 0],
|
||||
muted: [0.274, 0.006, 286.033],
|
||||
"muted-foreground": [0.705, 0.015, 286.067],
|
||||
accent: [0.274, 0.006, 286.033],
|
||||
"accent-foreground": [0.985, 0, 0],
|
||||
destructive: [0.704, 0.191, 22.216],
|
||||
"destructive-foreground": [0.985, 0.002, 247.839],
|
||||
success: [0.627, 0.194, 149.214],
|
||||
"success-foreground": [0.985, 0, 0],
|
||||
border: [1, 0, 0, 0.1],
|
||||
input: [1, 0, 0, 0.15],
|
||||
ring: [0.645, 0.246, 16.439],
|
||||
"chart-1": [0.81, 0.117, 11.638],
|
||||
"chart-2": [0.645, 0.246, 16.439],
|
||||
"chart-3": [0.586, 0.253, 17.585],
|
||||
"chart-4": [0.514, 0.222, 16.935],
|
||||
"chart-5": [0.455, 0.188, 13.697],
|
||||
sidebar: [0.21, 0.006, 285.885],
|
||||
"sidebar-foreground": [0.985, 0, 0],
|
||||
"sidebar-primary": [0.645, 0.246, 16.439],
|
||||
"sidebar-primary-foreground": [0.969, 0.015, 12.422],
|
||||
"sidebar-accent": [0.274, 0.006, 286.033],
|
||||
"sidebar-accent-foreground": [0.985, 0, 0],
|
||||
"sidebar-border": [1, 0, 0, 0.1],
|
||||
"sidebar-ring": [0.645, 0.246, 16.439],
|
||||
},
|
||||
} satisfies ThemeColors;
|
||||
78
packages/ui/shared/src/styles/themes/colors/stone.ts
Normal file
78
packages/ui/shared/src/styles/themes/colors/stone.ts
Normal file
@@ -0,0 +1,78 @@
|
||||
import { ThemeMode } from "../../../types";
|
||||
|
||||
import type { ThemeColors } from "../../../types";
|
||||
|
||||
export const stone = {
|
||||
[ThemeMode.LIGHT]: {
|
||||
background: [1, 0, 0],
|
||||
foreground: [0.147, 0.004, 49.25],
|
||||
card: [1, 0, 0],
|
||||
"card-foreground": [0.147, 0.004, 49.25],
|
||||
popover: [1, 0, 0],
|
||||
"popover-foreground": [0.147, 0.004, 49.25],
|
||||
primary: [0.216, 0.006, 56.043],
|
||||
"primary-foreground": [0.985, 0.001, 106.423],
|
||||
secondary: [0.97, 0.001, 106.424],
|
||||
"secondary-foreground": [0.216, 0.006, 56.043],
|
||||
muted: [0.97, 0.001, 106.424],
|
||||
"muted-foreground": [0.553, 0.013, 58.071],
|
||||
accent: [0.97, 0.001, 106.424],
|
||||
"accent-foreground": [0.216, 0.006, 56.043],
|
||||
destructive: [0.577, 0.245, 27.325],
|
||||
"destructive-foreground": [0.985, 0.002, 247.839],
|
||||
success: [0.7999, 0.1816, 151.78],
|
||||
"success-foreground": [0.9848, 0, 0],
|
||||
border: [0.923, 0.003, 48.717],
|
||||
input: [0.923, 0.003, 48.717],
|
||||
ring: [0.709, 0.01, 56.259],
|
||||
"chart-1": [0.869, 0.005, 56.366],
|
||||
"chart-2": [0.553, 0.013, 58.071],
|
||||
"chart-3": [0.444, 0.011, 73.639],
|
||||
"chart-4": [0.374, 0.01, 67.558],
|
||||
"chart-5": [0.268, 0.007, 34.298],
|
||||
sidebar: [0.985, 0.001, 106.423],
|
||||
"sidebar-foreground": [0.147, 0.004, 49.25],
|
||||
"sidebar-primary": [0.216, 0.006, 56.043],
|
||||
"sidebar-primary-foreground": [0.985, 0.001, 106.423],
|
||||
"sidebar-accent": [0.97, 0.001, 106.424],
|
||||
"sidebar-accent-foreground": [0.216, 0.006, 56.043],
|
||||
"sidebar-border": [0.923, 0.003, 48.717],
|
||||
"sidebar-ring": [0.709, 0.01, 56.259],
|
||||
},
|
||||
[ThemeMode.DARK]: {
|
||||
background: [0.147, 0.004, 49.25],
|
||||
foreground: [0.985, 0.001, 106.423],
|
||||
card: [0.216, 0.006, 56.043],
|
||||
"card-foreground": [0.985, 0.001, 106.423],
|
||||
popover: [0.216, 0.006, 56.043],
|
||||
"popover-foreground": [0.985, 0.001, 106.423],
|
||||
primary: [0.923, 0.003, 48.717],
|
||||
"primary-foreground": [0.216, 0.006, 56.043],
|
||||
secondary: [0.268, 0.007, 34.298],
|
||||
"secondary-foreground": [0.985, 0.001, 106.423],
|
||||
muted: [0.268, 0.007, 34.298],
|
||||
"muted-foreground": [0.709, 0.01, 56.259],
|
||||
accent: [0.268, 0.007, 34.298],
|
||||
"accent-foreground": [0.985, 0.001, 106.423],
|
||||
destructive: [0.704, 0.191, 22.216],
|
||||
"destructive-foreground": [0.985, 0.002, 247.839],
|
||||
success: [0.627, 0.194, 149.214],
|
||||
"success-foreground": [0.985, 0, 0],
|
||||
border: [1, 0, 0, 0.1],
|
||||
input: [1, 0, 0, 0.15],
|
||||
ring: [0.553, 0.013, 58.071],
|
||||
"chart-1": [0.869, 0.005, 56.366],
|
||||
"chart-2": [0.553, 0.013, 58.071],
|
||||
"chart-3": [0.444, 0.011, 73.639],
|
||||
"chart-4": [0.374, 0.01, 67.558],
|
||||
"chart-5": [0.268, 0.007, 34.298],
|
||||
sidebar: [0.216, 0.006, 56.043],
|
||||
"sidebar-foreground": [0.985, 0.001, 106.423],
|
||||
"sidebar-primary": [0.488, 0.243, 264.376],
|
||||
"sidebar-primary-foreground": [0.985, 0.001, 106.423],
|
||||
"sidebar-accent": [0.268, 0.007, 34.298],
|
||||
"sidebar-accent-foreground": [0.985, 0.001, 106.423],
|
||||
"sidebar-border": [1, 0, 0, 0.1],
|
||||
"sidebar-ring": [0.553, 0.013, 58.071],
|
||||
},
|
||||
} satisfies ThemeColors;
|
||||
78
packages/ui/shared/src/styles/themes/colors/violet.ts
Normal file
78
packages/ui/shared/src/styles/themes/colors/violet.ts
Normal file
@@ -0,0 +1,78 @@
|
||||
import { ThemeMode } from "../../../types";
|
||||
|
||||
import type { ThemeColors } from "../../../types";
|
||||
|
||||
export const violet = {
|
||||
[ThemeMode.LIGHT]: {
|
||||
background: [1, 0, 0],
|
||||
foreground: [0.141, 0.005, 285.823],
|
||||
card: [1, 0, 0],
|
||||
"card-foreground": [0.141, 0.005, 285.823],
|
||||
popover: [1, 0, 0],
|
||||
"popover-foreground": [0.141, 0.005, 285.823],
|
||||
primary: [0.606, 0.25, 292.717],
|
||||
"primary-foreground": [0.969, 0.016, 293.756],
|
||||
secondary: [0.967, 0.001, 286.375],
|
||||
"secondary-foreground": [0.21, 0.006, 285.885],
|
||||
muted: [0.967, 0.001, 286.375],
|
||||
"muted-foreground": [0.552, 0.016, 285.938],
|
||||
accent: [0.967, 0.001, 286.375],
|
||||
"accent-foreground": [0.21, 0.006, 285.885],
|
||||
destructive: [0.577, 0.245, 27.325],
|
||||
"destructive-foreground": [0.985, 0.002, 247.839],
|
||||
success: [0.7999, 0.1816, 151.78],
|
||||
"success-foreground": [0.9848, 0, 0],
|
||||
border: [0.92, 0.004, 286.32],
|
||||
input: [0.92, 0.004, 286.32],
|
||||
ring: [0.606, 0.25, 292.717],
|
||||
"chart-1": [0.811, 0.111, 293.571],
|
||||
"chart-2": [0.606, 0.25, 292.717],
|
||||
"chart-3": [0.541, 0.281, 293.009],
|
||||
"chart-4": [0.491, 0.27, 292.581],
|
||||
"chart-5": [0.432, 0.232, 292.759],
|
||||
sidebar: [0.985, 0, 0],
|
||||
"sidebar-foreground": [0.141, 0.005, 285.823],
|
||||
"sidebar-primary": [0.606, 0.25, 292.717],
|
||||
"sidebar-primary-foreground": [0.969, 0.016, 293.756],
|
||||
"sidebar-accent": [0.967, 0.001, 286.375],
|
||||
"sidebar-accent-foreground": [0.21, 0.006, 285.885],
|
||||
"sidebar-border": [0.92, 0.004, 286.32],
|
||||
"sidebar-ring": [0.606, 0.25, 292.717],
|
||||
},
|
||||
[ThemeMode.DARK]: {
|
||||
background: [0.141, 0.005, 285.823],
|
||||
foreground: [0.985, 0, 0],
|
||||
card: [0.21, 0.006, 285.885],
|
||||
"card-foreground": [0.985, 0, 0],
|
||||
popover: [0.21, 0.006, 285.885],
|
||||
"popover-foreground": [0.985, 0, 0],
|
||||
primary: [0.541, 0.281, 293.009],
|
||||
"primary-foreground": [0.969, 0.016, 293.756],
|
||||
secondary: [0.274, 0.006, 286.033],
|
||||
"secondary-foreground": [0.985, 0, 0],
|
||||
muted: [0.274, 0.006, 286.033],
|
||||
"muted-foreground": [0.705, 0.015, 286.067],
|
||||
accent: [0.274, 0.006, 286.033],
|
||||
"accent-foreground": [0.985, 0, 0],
|
||||
destructive: [0.704, 0.191, 22.216],
|
||||
"destructive-foreground": [0.985, 0.002, 247.839],
|
||||
success: [0.627, 0.194, 149.214],
|
||||
"success-foreground": [0.985, 0, 0],
|
||||
border: [1, 0, 0, 0.1],
|
||||
input: [1, 0, 0, 0.15],
|
||||
ring: [0.541, 0.281, 293.009],
|
||||
"chart-1": [0.811, 0.111, 293.571],
|
||||
"chart-2": [0.606, 0.25, 292.717],
|
||||
"chart-3": [0.541, 0.281, 293.009],
|
||||
"chart-4": [0.491, 0.27, 292.581],
|
||||
"chart-5": [0.432, 0.232, 292.759],
|
||||
sidebar: [0.21, 0.006, 285.885],
|
||||
"sidebar-foreground": [0.985, 0, 0],
|
||||
"sidebar-primary": [0.541, 0.281, 293.009],
|
||||
"sidebar-primary-foreground": [0.969, 0.016, 293.756],
|
||||
"sidebar-accent": [0.274, 0.006, 286.033],
|
||||
"sidebar-accent-foreground": [0.985, 0, 0],
|
||||
"sidebar-border": [1, 0, 0, 0.1],
|
||||
"sidebar-ring": [0.541, 0.281, 293.009],
|
||||
},
|
||||
} satisfies ThemeColors;
|
||||
78
packages/ui/shared/src/styles/themes/colors/yellow.ts
Normal file
78
packages/ui/shared/src/styles/themes/colors/yellow.ts
Normal file
@@ -0,0 +1,78 @@
|
||||
import { ThemeMode } from "../../../types";
|
||||
|
||||
import type { ThemeColors } from "../../../types";
|
||||
|
||||
export const yellow = {
|
||||
[ThemeMode.LIGHT]: {
|
||||
background: [1, 0, 0],
|
||||
foreground: [0.141, 0.005, 285.823],
|
||||
card: [1, 0, 0],
|
||||
"card-foreground": [0.141, 0.005, 285.823],
|
||||
popover: [1, 0, 0],
|
||||
"popover-foreground": [0.141, 0.005, 285.823],
|
||||
primary: [0.795, 0.184, 86.047],
|
||||
"primary-foreground": [0.421, 0.095, 57.708],
|
||||
secondary: [0.967, 0.001, 286.375],
|
||||
"secondary-foreground": [0.21, 0.006, 285.885],
|
||||
muted: [0.967, 0.001, 286.375],
|
||||
"muted-foreground": [0.552, 0.016, 285.938],
|
||||
accent: [0.967, 0.001, 286.375],
|
||||
"accent-foreground": [0.21, 0.006, 285.885],
|
||||
destructive: [0.577, 0.245, 27.325],
|
||||
"destructive-foreground": [0.985, 0.002, 247.839],
|
||||
success: [0.7999, 0.1816, 151.78],
|
||||
"success-foreground": [0.9848, 0, 0],
|
||||
border: [0.92, 0.004, 286.32],
|
||||
input: [0.92, 0.004, 286.32],
|
||||
ring: [0.795, 0.184, 86.047],
|
||||
"chart-1": [0.905, 0.182, 98.111],
|
||||
"chart-2": [0.795, 0.184, 86.047],
|
||||
"chart-3": [0.681, 0.162, 75.834],
|
||||
"chart-4": [0.554, 0.135, 66.442],
|
||||
"chart-5": [0.476, 0.114, 61.907],
|
||||
sidebar: [0.985, 0, 0],
|
||||
"sidebar-foreground": [0.141, 0.005, 285.823],
|
||||
"sidebar-primary": [0.795, 0.184, 86.047],
|
||||
"sidebar-primary-foreground": [0.421, 0.095, 57.708],
|
||||
"sidebar-accent": [0.967, 0.001, 286.375],
|
||||
"sidebar-accent-foreground": [0.21, 0.006, 285.885],
|
||||
"sidebar-border": [0.92, 0.004, 286.32],
|
||||
"sidebar-ring": [0.795, 0.184, 86.047],
|
||||
},
|
||||
[ThemeMode.DARK]: {
|
||||
background: [0.141, 0.005, 285.823],
|
||||
foreground: [0.985, 0, 0],
|
||||
card: [0.21, 0.006, 285.885],
|
||||
"card-foreground": [0.985, 0, 0],
|
||||
popover: [0.21, 0.006, 285.885],
|
||||
"popover-foreground": [0.985, 0, 0],
|
||||
primary: [0.795, 0.184, 86.047],
|
||||
"primary-foreground": [0.421, 0.095, 57.708],
|
||||
secondary: [0.274, 0.006, 286.033],
|
||||
"secondary-foreground": [0.985, 0, 0],
|
||||
muted: [0.274, 0.006, 286.033],
|
||||
"muted-foreground": [0.705, 0.015, 286.067],
|
||||
accent: [0.274, 0.006, 286.033],
|
||||
"accent-foreground": [0.985, 0, 0],
|
||||
destructive: [0.704, 0.191, 22.216],
|
||||
"destructive-foreground": [0.985, 0.002, 247.839],
|
||||
success: [0.627, 0.194, 149.214],
|
||||
"success-foreground": [0.985, 0, 0],
|
||||
border: [1, 0, 0, 0.1],
|
||||
input: [1, 0, 0, 0.15],
|
||||
ring: [0.554, 0.135, 66.442],
|
||||
"chart-1": [0.905, 0.182, 98.111],
|
||||
"chart-2": [0.795, 0.184, 86.047],
|
||||
"chart-3": [0.681, 0.162, 75.834],
|
||||
"chart-4": [0.554, 0.135, 66.442],
|
||||
"chart-5": [0.476, 0.114, 61.907],
|
||||
sidebar: [0.21, 0.006, 285.885],
|
||||
"sidebar-foreground": [0.985, 0, 0],
|
||||
"sidebar-primary": [0.795, 0.184, 86.047],
|
||||
"sidebar-primary-foreground": [0.421, 0.095, 57.708],
|
||||
"sidebar-accent": [0.274, 0.006, 286.033],
|
||||
"sidebar-accent-foreground": [0.985, 0, 0],
|
||||
"sidebar-border": [1, 0, 0, 0.1],
|
||||
"sidebar-ring": [0.554, 0.135, 66.442],
|
||||
},
|
||||
} satisfies ThemeColors;
|
||||
23
packages/ui/shared/src/styles/themes/themes.ts
Normal file
23
packages/ui/shared/src/styles/themes/themes.ts
Normal file
@@ -0,0 +1,23 @@
|
||||
import { blue } from "./colors/blue";
|
||||
import { gray } from "./colors/gray";
|
||||
import { green } from "./colors/green";
|
||||
import { orange } from "./colors/orange";
|
||||
import { red } from "./colors/red";
|
||||
import { rose } from "./colors/rose";
|
||||
import { stone } from "./colors/stone";
|
||||
import { violet } from "./colors/violet";
|
||||
import { yellow } from "./colors/yellow";
|
||||
|
||||
import type { ThemeColor, ThemeColors } from "../../types";
|
||||
|
||||
export const themes: Record<ThemeColor, ThemeColors> = {
|
||||
orange,
|
||||
blue,
|
||||
gray,
|
||||
green,
|
||||
red,
|
||||
rose,
|
||||
stone,
|
||||
violet,
|
||||
yellow,
|
||||
};
|
||||
751
packages/ui/shared/src/styles/themes/variables.css
Normal file
751
packages/ui/shared/src/styles/themes/variables.css
Normal file
@@ -0,0 +1,751 @@
|
||||
/*
|
||||
* This file is auto-generated. Do NOT edit it directly.
|
||||
*
|
||||
* Edit the theme source files instead:
|
||||
* - ./themes.ts
|
||||
* - ./colors/*.ts
|
||||
*/
|
||||
|
||||
@layer theme {
|
||||
:root {
|
||||
@variant light {
|
||||
--background: oklch(1 0 0);
|
||||
--foreground: oklch(0.141 0.005 285.823);
|
||||
--card: oklch(1 0 0);
|
||||
--card-foreground: oklch(0.141 0.005 285.823);
|
||||
--popover: oklch(1 0 0);
|
||||
--popover-foreground: oklch(0.141 0.005 285.823);
|
||||
--primary: oklch(0.6387 0.2151 36.46);
|
||||
--primary-foreground: oklch(0.98 0.016 73.684);
|
||||
--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);
|
||||
--destructive: oklch(0.577 0.245 27.325);
|
||||
--destructive-foreground: oklch(0.985 0.002 247.839);
|
||||
--success: oklch(0.7999 0.1816 151.78);
|
||||
--success-foreground: oklch(0.9848 0 0);
|
||||
--border: oklch(0.92 0.004 286.32);
|
||||
--input: oklch(0.92 0.004 286.32);
|
||||
--ring: oklch(0.6387 0.2151 36.46);
|
||||
--chart-1: oklch(0.6387 0.2151 36.46);
|
||||
--chart-2: oklch(0.7027 0.1783 44.12);
|
||||
--chart-3: oklch(0.7732 0.1275 51.73);
|
||||
--chart-4: oklch(0.8478 0.0818 58.78);
|
||||
--chart-5: oklch(0.92 0.0421 65.38);
|
||||
--sidebar: oklch(0.985 0 0);
|
||||
--sidebar-foreground: oklch(0.141 0.005 285.823);
|
||||
--sidebar-primary: oklch(0.6387 0.2151 36.46);
|
||||
--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.6387 0.2151 36.46);
|
||||
}
|
||||
|
||||
@variant dark {
|
||||
--background: oklch(0.141 0.005 285.823);
|
||||
--foreground: oklch(0.985 0 0);
|
||||
--card: oklch(0.21 0.006 285.885);
|
||||
--card-foreground: oklch(0.985 0 0);
|
||||
--popover: oklch(0.21 0.006 285.885);
|
||||
--popover-foreground: oklch(0.985 0 0);
|
||||
--primary: oklch(0.6387 0.2151 36.46);
|
||||
--primary-foreground: oklch(0.98 0.016 73.684);
|
||||
--secondary: oklch(0.274 0.006 286.033);
|
||||
--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);
|
||||
--accent-foreground: oklch(0.985 0 0);
|
||||
--destructive: oklch(0.704 0.191 22.216);
|
||||
--destructive-foreground: oklch(0.985 0.002 247.839);
|
||||
--success: oklch(0.627 0.194 149.214);
|
||||
--success-foreground: oklch(0.985 0 0);
|
||||
--border: oklch(1 0 0 / 10%);
|
||||
--input: oklch(1 0 0 / 15%);
|
||||
--ring: oklch(0.6387 0.2151 36.46);
|
||||
--chart-1: oklch(0.6387 0.2151 36.46);
|
||||
--chart-2: oklch(0.7027 0.1783 44.12);
|
||||
--chart-3: oklch(0.7732 0.1275 51.73);
|
||||
--chart-4: oklch(0.8478 0.0818 58.78);
|
||||
--chart-5: oklch(0.92 0.0421 65.38);
|
||||
--sidebar: oklch(0.21 0.006 285.885);
|
||||
--sidebar-foreground: oklch(0.985 0 0);
|
||||
--sidebar-primary: oklch(0.6387 0.2151 36.46);
|
||||
--sidebar-primary-foreground: oklch(0.98 0.016 73.684);
|
||||
--sidebar-accent: oklch(0.274 0.006 286.033);
|
||||
--sidebar-accent-foreground: oklch(0.985 0 0);
|
||||
--sidebar-border: oklch(1 0 0 / 10%);
|
||||
--sidebar-ring: oklch(0.6387 0.2151 36.46);
|
||||
}
|
||||
|
||||
[data-theme="orange"] {
|
||||
--background: oklch(1 0 0);
|
||||
--foreground: oklch(0.141 0.005 285.823);
|
||||
--card: oklch(1 0 0);
|
||||
--card-foreground: oklch(0.141 0.005 285.823);
|
||||
--popover: oklch(1 0 0);
|
||||
--popover-foreground: oklch(0.141 0.005 285.823);
|
||||
--primary: oklch(0.6387 0.2151 36.46);
|
||||
--primary-foreground: oklch(0.98 0.016 73.684);
|
||||
--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);
|
||||
--destructive: oklch(0.577 0.245 27.325);
|
||||
--destructive-foreground: oklch(0.985 0.002 247.839);
|
||||
--success: oklch(0.7999 0.1816 151.78);
|
||||
--success-foreground: oklch(0.9848 0 0);
|
||||
--border: oklch(0.92 0.004 286.32);
|
||||
--input: oklch(0.92 0.004 286.32);
|
||||
--ring: oklch(0.6387 0.2151 36.46);
|
||||
--chart-1: oklch(0.6387 0.2151 36.46);
|
||||
--chart-2: oklch(0.7027 0.1783 44.12);
|
||||
--chart-3: oklch(0.7732 0.1275 51.73);
|
||||
--chart-4: oklch(0.8478 0.0818 58.78);
|
||||
--chart-5: oklch(0.92 0.0421 65.38);
|
||||
--sidebar: oklch(0.985 0 0);
|
||||
--sidebar-foreground: oklch(0.141 0.005 285.823);
|
||||
--sidebar-primary: oklch(0.6387 0.2151 36.46);
|
||||
--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.6387 0.2151 36.46);
|
||||
|
||||
@variant dark {
|
||||
--background: oklch(0.141 0.005 285.823);
|
||||
--foreground: oklch(0.985 0 0);
|
||||
--card: oklch(0.21 0.006 285.885);
|
||||
--card-foreground: oklch(0.985 0 0);
|
||||
--popover: oklch(0.21 0.006 285.885);
|
||||
--popover-foreground: oklch(0.985 0 0);
|
||||
--primary: oklch(0.6387 0.2151 36.46);
|
||||
--primary-foreground: oklch(0.98 0.016 73.684);
|
||||
--secondary: oklch(0.274 0.006 286.033);
|
||||
--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);
|
||||
--accent-foreground: oklch(0.985 0 0);
|
||||
--destructive: oklch(0.704 0.191 22.216);
|
||||
--destructive-foreground: oklch(0.985 0.002 247.839);
|
||||
--success: oklch(0.627 0.194 149.214);
|
||||
--success-foreground: oklch(0.985 0 0);
|
||||
--border: oklch(1 0 0 / 10%);
|
||||
--input: oklch(1 0 0 / 15%);
|
||||
--ring: oklch(0.6387 0.2151 36.46);
|
||||
--chart-1: oklch(0.6387 0.2151 36.46);
|
||||
--chart-2: oklch(0.7027 0.1783 44.12);
|
||||
--chart-3: oklch(0.7732 0.1275 51.73);
|
||||
--chart-4: oklch(0.8478 0.0818 58.78);
|
||||
--chart-5: oklch(0.92 0.0421 65.38);
|
||||
--sidebar: oklch(0.21 0.006 285.885);
|
||||
--sidebar-foreground: oklch(0.985 0 0);
|
||||
--sidebar-primary: oklch(0.6387 0.2151 36.46);
|
||||
--sidebar-primary-foreground: oklch(0.98 0.016 73.684);
|
||||
--sidebar-accent: oklch(0.274 0.006 286.033);
|
||||
--sidebar-accent-foreground: oklch(0.985 0 0);
|
||||
--sidebar-border: oklch(1 0 0 / 10%);
|
||||
--sidebar-ring: oklch(0.6387 0.2151 36.46);
|
||||
}
|
||||
}
|
||||
|
||||
[data-theme="blue"] {
|
||||
--background: oklch(1 0 0);
|
||||
--foreground: oklch(0.141 0.005 285.823);
|
||||
--card: oklch(1 0 0);
|
||||
--card-foreground: oklch(0.141 0.005 285.823);
|
||||
--popover: oklch(1 0 0);
|
||||
--popover-foreground: oklch(0.141 0.005 285.823);
|
||||
--primary: oklch(0.623 0.214 259.815);
|
||||
--primary-foreground: oklch(0.97 0.014 254.604);
|
||||
--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);
|
||||
--destructive: oklch(0.577 0.245 27.325);
|
||||
--destructive-foreground: oklch(0.985 0.002 247.839);
|
||||
--success: oklch(0.7999 0.1816 151.78);
|
||||
--success-foreground: oklch(0.9848 0 0);
|
||||
--border: oklch(0.92 0.004 286.32);
|
||||
--input: oklch(0.92 0.004 286.32);
|
||||
--ring: oklch(0.623 0.214 259.815);
|
||||
--chart-1: oklch(0.809 0.105 251.813);
|
||||
--chart-2: oklch(0.623 0.214 259.815);
|
||||
--chart-3: oklch(0.546 0.245 262.881);
|
||||
--chart-4: oklch(0.488 0.243 264.376);
|
||||
--chart-5: oklch(0.424 0.199 265.638);
|
||||
--sidebar: oklch(0.985 0 0);
|
||||
--sidebar-foreground: oklch(0.141 0.005 285.823);
|
||||
--sidebar-primary: oklch(0.623 0.214 259.815);
|
||||
--sidebar-primary-foreground: oklch(0.97 0.014 254.604);
|
||||
--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.623 0.214 259.815);
|
||||
|
||||
@variant dark {
|
||||
--background: oklch(0.141 0.005 285.823);
|
||||
--foreground: oklch(0.985 0 0);
|
||||
--card: oklch(0.21 0.006 285.885);
|
||||
--card-foreground: oklch(0.985 0 0);
|
||||
--popover: oklch(0.21 0.006 285.885);
|
||||
--popover-foreground: oklch(0.985 0 0);
|
||||
--primary: oklch(0.546 0.245 262.881);
|
||||
--primary-foreground: oklch(0.379 0.146 265.522);
|
||||
--secondary: oklch(0.274 0.006 286.033);
|
||||
--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);
|
||||
--accent-foreground: oklch(0.985 0 0);
|
||||
--destructive: oklch(0.704 0.191 22.216);
|
||||
--destructive-foreground: oklch(0.985 0.002 247.839);
|
||||
--success: oklch(0.627 0.194 149.214);
|
||||
--success-foreground: oklch(0.985 0 0);
|
||||
--border: oklch(1 0 0 / 10%);
|
||||
--input: oklch(1 0 0 / 15%);
|
||||
--ring: oklch(0.488 0.243 264.376);
|
||||
--chart-1: oklch(0.809 0.105 251.813);
|
||||
--chart-2: oklch(0.623 0.214 259.815);
|
||||
--chart-3: oklch(0.546 0.245 262.881);
|
||||
--chart-4: oklch(0.488 0.243 264.376);
|
||||
--chart-5: oklch(0.424 0.199 265.638);
|
||||
--sidebar: oklch(0.21 0.006 285.885);
|
||||
--sidebar-foreground: oklch(0.985 0 0);
|
||||
--sidebar-primary: oklch(0.546 0.245 262.881);
|
||||
--sidebar-primary-foreground: oklch(0.379 0.146 265.522);
|
||||
--sidebar-accent: oklch(0.274 0.006 286.033);
|
||||
--sidebar-accent-foreground: oklch(0.985 0 0);
|
||||
--sidebar-border: oklch(1 0 0 / 10%);
|
||||
--sidebar-ring: oklch(0.488 0.243 264.376);
|
||||
}
|
||||
}
|
||||
|
||||
[data-theme="gray"] {
|
||||
--background: oklch(1 0 0);
|
||||
--foreground: oklch(0.13 0.028 261.692);
|
||||
--card: oklch(1 0 0);
|
||||
--card-foreground: oklch(0.13 0.028 261.692);
|
||||
--popover: oklch(1 0 0);
|
||||
--popover-foreground: oklch(0.13 0.028 261.692);
|
||||
--primary: oklch(0.21 0.034 264.665);
|
||||
--primary-foreground: oklch(0.985 0.002 247.839);
|
||||
--secondary: oklch(0.967 0.003 264.542);
|
||||
--secondary-foreground: oklch(0.21 0.034 264.665);
|
||||
--muted: oklch(0.967 0.003 264.542);
|
||||
--muted-foreground: oklch(0.551 0.027 264.364);
|
||||
--accent: oklch(0.967 0.003 264.542);
|
||||
--accent-foreground: oklch(0.21 0.034 264.665);
|
||||
--destructive: oklch(0.577 0.245 27.325);
|
||||
--destructive-foreground: oklch(0.985 0.002 247.839);
|
||||
--success: oklch(0.7999 0.1816 151.78);
|
||||
--success-foreground: oklch(0.9848 0 0);
|
||||
--border: oklch(0.928 0.006 264.531);
|
||||
--input: oklch(0.928 0.006 264.531);
|
||||
--ring: oklch(0.707 0.022 261.325);
|
||||
--chart-1: oklch(0.872 0.01 258.338);
|
||||
--chart-2: oklch(0.551 0.027 264.364);
|
||||
--chart-3: oklch(0.446 0.03 256.802);
|
||||
--chart-4: oklch(0.373 0.034 259.733);
|
||||
--chart-5: oklch(0.278 0.033 256.848);
|
||||
--sidebar: oklch(0.985 0.002 247.839);
|
||||
--sidebar-foreground: oklch(0.13 0.028 261.692);
|
||||
--sidebar-primary: oklch(0.21 0.034 264.665);
|
||||
--sidebar-primary-foreground: oklch(0.985 0.002 247.839);
|
||||
--sidebar-accent: oklch(0.967 0.003 264.542);
|
||||
--sidebar-accent-foreground: oklch(0.21 0.034 264.665);
|
||||
--sidebar-border: oklch(0.928 0.006 264.531);
|
||||
--sidebar-ring: oklch(0.707 0.022 261.325);
|
||||
|
||||
@variant dark {
|
||||
--background: oklch(0.13 0.028 261.692);
|
||||
--foreground: oklch(0.985 0.002 247.839);
|
||||
--card: oklch(0.21 0.034 264.665);
|
||||
--card-foreground: oklch(0.985 0.002 247.839);
|
||||
--popover: oklch(0.21 0.034 264.665);
|
||||
--popover-foreground: oklch(0.985 0.002 247.839);
|
||||
--primary: oklch(0.928 0.006 264.531);
|
||||
--primary-foreground: oklch(0.21 0.034 264.665);
|
||||
--secondary: oklch(0.278 0.033 256.848);
|
||||
--secondary-foreground: oklch(0.985 0.002 247.839);
|
||||
--muted: oklch(0.278 0.033 256.848);
|
||||
--muted-foreground: oklch(0.707 0.022 261.325);
|
||||
--accent: oklch(0.278 0.033 256.848);
|
||||
--accent-foreground: oklch(0.985 0.002 247.839);
|
||||
--destructive: oklch(0.704 0.191 22.216);
|
||||
--destructive-foreground: oklch(0.985 0.002 247.839);
|
||||
--success: oklch(0.627 0.194 149.214);
|
||||
--success-foreground: oklch(0.985 0 0);
|
||||
--border: oklch(1 0 0 / 10%);
|
||||
--input: oklch(1 0 0 / 15%);
|
||||
--ring: oklch(0.551 0.027 264.364);
|
||||
--chart-1: oklch(0.872 0.01 258.338);
|
||||
--chart-2: oklch(0.551 0.027 264.364);
|
||||
--chart-3: oklch(0.446 0.03 256.802);
|
||||
--chart-4: oklch(0.373 0.034 259.733);
|
||||
--chart-5: oklch(0.278 0.033 256.848);
|
||||
--sidebar: oklch(0.21 0.034 264.665);
|
||||
--sidebar-foreground: oklch(0.985 0.002 247.839);
|
||||
--sidebar-primary: oklch(0.488 0.243 264.376);
|
||||
--sidebar-primary-foreground: oklch(0.985 0.002 247.839);
|
||||
--sidebar-accent: oklch(0.278 0.033 256.848);
|
||||
--sidebar-accent-foreground: oklch(0.985 0.002 247.839);
|
||||
--sidebar-border: oklch(1 0 0 / 10%);
|
||||
--sidebar-ring: oklch(0.551 0.027 264.364);
|
||||
}
|
||||
}
|
||||
|
||||
[data-theme="green"] {
|
||||
--background: oklch(1 0 0);
|
||||
--foreground: oklch(0.141 0.005 285.823);
|
||||
--card: oklch(1 0 0);
|
||||
--card-foreground: oklch(0.141 0.005 285.823);
|
||||
--popover: oklch(1 0 0);
|
||||
--popover-foreground: oklch(0.141 0.005 285.823);
|
||||
--primary: oklch(0.723 0.219 149.579);
|
||||
--primary-foreground: oklch(0.982 0.018 155.826);
|
||||
--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);
|
||||
--destructive: oklch(0.577 0.245 27.325);
|
||||
--destructive-foreground: oklch(0.985 0.002 247.839);
|
||||
--success: oklch(0.7999 0.1816 151.78);
|
||||
--success-foreground: oklch(0.9848 0 0);
|
||||
--border: oklch(0.92 0.004 286.32);
|
||||
--input: oklch(0.92 0.004 286.32);
|
||||
--ring: oklch(0.723 0.219 149.579);
|
||||
--chart-1: oklch(0.871 0.15 154.449);
|
||||
--chart-2: oklch(0.723 0.219 149.579);
|
||||
--chart-3: oklch(0.627 0.194 149.214);
|
||||
--chart-4: oklch(0.527 0.154 150.069);
|
||||
--chart-5: oklch(0.448 0.119 151.328);
|
||||
--sidebar: oklch(0.985 0 0);
|
||||
--sidebar-foreground: oklch(0.141 0.005 285.823);
|
||||
--sidebar-primary: oklch(0.723 0.219 149.579);
|
||||
--sidebar-primary-foreground: oklch(0.982 0.018 155.826);
|
||||
--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.723 0.219 149.579);
|
||||
|
||||
@variant dark {
|
||||
--background: oklch(0.141 0.005 285.823);
|
||||
--foreground: oklch(0.985 0 0);
|
||||
--card: oklch(0.21 0.006 285.885);
|
||||
--card-foreground: oklch(0.985 0 0);
|
||||
--popover: oklch(0.21 0.006 285.885);
|
||||
--popover-foreground: oklch(0.985 0 0);
|
||||
--primary: oklch(0.696 0.17 162.48);
|
||||
--primary-foreground: oklch(0.393 0.095 152.535);
|
||||
--secondary: oklch(0.274 0.006 286.033);
|
||||
--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);
|
||||
--accent-foreground: oklch(0.985 0 0);
|
||||
--destructive: oklch(0.704 0.191 22.216);
|
||||
--destructive-foreground: oklch(0.985 0.002 247.839);
|
||||
--success: oklch(0.627 0.194 149.214);
|
||||
--success-foreground: oklch(0.985 0 0);
|
||||
--border: oklch(1 0 0 / 10%);
|
||||
--input: oklch(1 0 0 / 15%);
|
||||
--ring: oklch(0.527 0.154 150.069);
|
||||
--chart-1: oklch(0.871 0.15 154.449);
|
||||
--chart-2: oklch(0.723 0.219 149.579);
|
||||
--chart-3: oklch(0.627 0.194 149.214);
|
||||
--chart-4: oklch(0.527 0.154 150.069);
|
||||
--chart-5: oklch(0.448 0.119 151.328);
|
||||
--sidebar: oklch(0.21 0.006 285.885);
|
||||
--sidebar-foreground: oklch(0.985 0 0);
|
||||
--sidebar-primary: oklch(0.696 0.17 162.48);
|
||||
--sidebar-primary-foreground: oklch(0.393 0.095 152.535);
|
||||
--sidebar-accent: oklch(0.274 0.006 286.033);
|
||||
--sidebar-accent-foreground: oklch(0.985 0 0);
|
||||
--sidebar-border: oklch(1 0 0 / 10%);
|
||||
--sidebar-ring: oklch(0.527 0.154 150.069);
|
||||
}
|
||||
}
|
||||
|
||||
[data-theme="red"] {
|
||||
--background: oklch(1 0 0);
|
||||
--foreground: oklch(0.141 0.005 285.823);
|
||||
--card: oklch(1 0 0);
|
||||
--card-foreground: oklch(0.141 0.005 285.823);
|
||||
--popover: oklch(1 0 0);
|
||||
--popover-foreground: oklch(0.141 0.005 285.823);
|
||||
--primary: oklch(0.637 0.237 25.331);
|
||||
--primary-foreground: oklch(0.971 0.013 17.38);
|
||||
--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);
|
||||
--destructive: oklch(0.577 0.245 27.325);
|
||||
--destructive-foreground: oklch(0.985 0.002 247.839);
|
||||
--success: oklch(0.7999 0.1816 151.78);
|
||||
--success-foreground: oklch(0.9848 0 0);
|
||||
--border: oklch(0.92 0.004 286.32);
|
||||
--input: oklch(0.92 0.004 286.32);
|
||||
--ring: oklch(0.637 0.237 25.331);
|
||||
--chart-1: oklch(0.808 0.114 19.571);
|
||||
--chart-2: oklch(0.637 0.237 25.331);
|
||||
--chart-3: oklch(0.577 0.245 27.325);
|
||||
--chart-4: oklch(0.505 0.213 27.518);
|
||||
--chart-5: oklch(0.444 0.177 26.899);
|
||||
--sidebar: oklch(0.985 0 0);
|
||||
--sidebar-foreground: oklch(0.141 0.005 285.823);
|
||||
--sidebar-primary: oklch(0.637 0.237 25.331);
|
||||
--sidebar-primary-foreground: oklch(0.971 0.013 17.38);
|
||||
--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.637 0.237 25.331);
|
||||
|
||||
@variant dark {
|
||||
--background: oklch(0.141 0.005 285.823);
|
||||
--foreground: oklch(0.985 0 0);
|
||||
--card: oklch(0.21 0.006 285.885);
|
||||
--card-foreground: oklch(0.985 0 0);
|
||||
--popover: oklch(0.21 0.006 285.885);
|
||||
--popover-foreground: oklch(0.985 0 0);
|
||||
--primary: oklch(0.637 0.237 25.331);
|
||||
--primary-foreground: oklch(0.971 0.013 17.38);
|
||||
--secondary: oklch(0.274 0.006 286.033);
|
||||
--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);
|
||||
--accent-foreground: oklch(0.985 0 0);
|
||||
--destructive: oklch(0.704 0.191 22.216);
|
||||
--destructive-foreground: oklch(0.985 0.002 247.839);
|
||||
--success: oklch(0.627 0.194 149.214);
|
||||
--success-foreground: oklch(0.985 0 0);
|
||||
--border: oklch(1 0 0 / 10%);
|
||||
--input: oklch(1 0 0 / 15%);
|
||||
--ring: oklch(0.637 0.237 25.331);
|
||||
--chart-1: oklch(0.808 0.114 19.571);
|
||||
--chart-2: oklch(0.637 0.237 25.331);
|
||||
--chart-3: oklch(0.577 0.245 27.325);
|
||||
--chart-4: oklch(0.505 0.213 27.518);
|
||||
--chart-5: oklch(0.444 0.177 26.899);
|
||||
--sidebar: oklch(0.21 0.006 285.885);
|
||||
--sidebar-foreground: oklch(0.985 0 0);
|
||||
--sidebar-primary: oklch(0.637 0.237 25.331);
|
||||
--sidebar-primary-foreground: oklch(0.971 0.013 17.38);
|
||||
--sidebar-accent: oklch(0.274 0.006 286.033);
|
||||
--sidebar-accent-foreground: oklch(0.985 0 0);
|
||||
--sidebar-border: oklch(1 0 0 / 10%);
|
||||
--sidebar-ring: oklch(0.637 0.237 25.331);
|
||||
}
|
||||
}
|
||||
|
||||
[data-theme="rose"] {
|
||||
--background: oklch(1 0 0);
|
||||
--foreground: oklch(0.141 0.005 285.823);
|
||||
--card: oklch(1 0 0);
|
||||
--card-foreground: oklch(0.141 0.005 285.823);
|
||||
--popover: oklch(1 0 0);
|
||||
--popover-foreground: oklch(0.141 0.005 285.823);
|
||||
--primary: oklch(0.645 0.246 16.439);
|
||||
--primary-foreground: oklch(0.969 0.015 12.422);
|
||||
--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);
|
||||
--destructive: oklch(0.577 0.245 27.325);
|
||||
--destructive-foreground: oklch(0.985 0.002 247.839);
|
||||
--success: oklch(0.7999 0.1816 151.78);
|
||||
--success-foreground: oklch(0.9848 0 0);
|
||||
--border: oklch(0.92 0.004 286.32);
|
||||
--input: oklch(0.92 0.004 286.32);
|
||||
--ring: oklch(0.645 0.246 16.439);
|
||||
--chart-1: oklch(0.81 0.117 11.638);
|
||||
--chart-2: oklch(0.645 0.246 16.439);
|
||||
--chart-3: oklch(0.586 0.253 17.585);
|
||||
--chart-4: oklch(0.514 0.222 16.935);
|
||||
--chart-5: oklch(0.455 0.188 13.697);
|
||||
--sidebar: oklch(0.985 0 0);
|
||||
--sidebar-foreground: oklch(0.141 0.005 285.823);
|
||||
--sidebar-primary: oklch(0.645 0.246 16.439);
|
||||
--sidebar-primary-foreground: oklch(0.969 0.015 12.422);
|
||||
--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.645 0.246 16.439);
|
||||
|
||||
@variant dark {
|
||||
--background: oklch(0.141 0.005 285.823);
|
||||
--foreground: oklch(0.985 0 0);
|
||||
--card: oklch(0.21 0.006 285.885);
|
||||
--card-foreground: oklch(0.985 0 0);
|
||||
--popover: oklch(0.21 0.006 285.885);
|
||||
--popover-foreground: oklch(0.985 0 0);
|
||||
--primary: oklch(0.645 0.246 16.439);
|
||||
--primary-foreground: oklch(0.969 0.015 12.422);
|
||||
--secondary: oklch(0.274 0.006 286.033);
|
||||
--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);
|
||||
--accent-foreground: oklch(0.985 0 0);
|
||||
--destructive: oklch(0.704 0.191 22.216);
|
||||
--destructive-foreground: oklch(0.985 0.002 247.839);
|
||||
--success: oklch(0.627 0.194 149.214);
|
||||
--success-foreground: oklch(0.985 0 0);
|
||||
--border: oklch(1 0 0 / 10%);
|
||||
--input: oklch(1 0 0 / 15%);
|
||||
--ring: oklch(0.645 0.246 16.439);
|
||||
--chart-1: oklch(0.81 0.117 11.638);
|
||||
--chart-2: oklch(0.645 0.246 16.439);
|
||||
--chart-3: oklch(0.586 0.253 17.585);
|
||||
--chart-4: oklch(0.514 0.222 16.935);
|
||||
--chart-5: oklch(0.455 0.188 13.697);
|
||||
--sidebar: oklch(0.21 0.006 285.885);
|
||||
--sidebar-foreground: oklch(0.985 0 0);
|
||||
--sidebar-primary: oklch(0.645 0.246 16.439);
|
||||
--sidebar-primary-foreground: oklch(0.969 0.015 12.422);
|
||||
--sidebar-accent: oklch(0.274 0.006 286.033);
|
||||
--sidebar-accent-foreground: oklch(0.985 0 0);
|
||||
--sidebar-border: oklch(1 0 0 / 10%);
|
||||
--sidebar-ring: oklch(0.645 0.246 16.439);
|
||||
}
|
||||
}
|
||||
|
||||
[data-theme="stone"] {
|
||||
--background: oklch(1 0 0);
|
||||
--foreground: oklch(0.147 0.004 49.25);
|
||||
--card: oklch(1 0 0);
|
||||
--card-foreground: oklch(0.147 0.004 49.25);
|
||||
--popover: oklch(1 0 0);
|
||||
--popover-foreground: oklch(0.147 0.004 49.25);
|
||||
--primary: oklch(0.216 0.006 56.043);
|
||||
--primary-foreground: oklch(0.985 0.001 106.423);
|
||||
--secondary: oklch(0.97 0.001 106.424);
|
||||
--secondary-foreground: oklch(0.216 0.006 56.043);
|
||||
--muted: oklch(0.97 0.001 106.424);
|
||||
--muted-foreground: oklch(0.553 0.013 58.071);
|
||||
--accent: oklch(0.97 0.001 106.424);
|
||||
--accent-foreground: oklch(0.216 0.006 56.043);
|
||||
--destructive: oklch(0.577 0.245 27.325);
|
||||
--destructive-foreground: oklch(0.985 0.002 247.839);
|
||||
--success: oklch(0.7999 0.1816 151.78);
|
||||
--success-foreground: oklch(0.9848 0 0);
|
||||
--border: oklch(0.923 0.003 48.717);
|
||||
--input: oklch(0.923 0.003 48.717);
|
||||
--ring: oklch(0.709 0.01 56.259);
|
||||
--chart-1: oklch(0.869 0.005 56.366);
|
||||
--chart-2: oklch(0.553 0.013 58.071);
|
||||
--chart-3: oklch(0.444 0.011 73.639);
|
||||
--chart-4: oklch(0.374 0.01 67.558);
|
||||
--chart-5: oklch(0.268 0.007 34.298);
|
||||
--sidebar: oklch(0.985 0.001 106.423);
|
||||
--sidebar-foreground: oklch(0.147 0.004 49.25);
|
||||
--sidebar-primary: oklch(0.216 0.006 56.043);
|
||||
--sidebar-primary-foreground: oklch(0.985 0.001 106.423);
|
||||
--sidebar-accent: oklch(0.97 0.001 106.424);
|
||||
--sidebar-accent-foreground: oklch(0.216 0.006 56.043);
|
||||
--sidebar-border: oklch(0.923 0.003 48.717);
|
||||
--sidebar-ring: oklch(0.709 0.01 56.259);
|
||||
|
||||
@variant dark {
|
||||
--background: oklch(0.147 0.004 49.25);
|
||||
--foreground: oklch(0.985 0.001 106.423);
|
||||
--card: oklch(0.216 0.006 56.043);
|
||||
--card-foreground: oklch(0.985 0.001 106.423);
|
||||
--popover: oklch(0.216 0.006 56.043);
|
||||
--popover-foreground: oklch(0.985 0.001 106.423);
|
||||
--primary: oklch(0.923 0.003 48.717);
|
||||
--primary-foreground: oklch(0.216 0.006 56.043);
|
||||
--secondary: oklch(0.268 0.007 34.298);
|
||||
--secondary-foreground: oklch(0.985 0.001 106.423);
|
||||
--muted: oklch(0.268 0.007 34.298);
|
||||
--muted-foreground: oklch(0.709 0.01 56.259);
|
||||
--accent: oklch(0.268 0.007 34.298);
|
||||
--accent-foreground: oklch(0.985 0.001 106.423);
|
||||
--destructive: oklch(0.704 0.191 22.216);
|
||||
--destructive-foreground: oklch(0.985 0.002 247.839);
|
||||
--success: oklch(0.627 0.194 149.214);
|
||||
--success-foreground: oklch(0.985 0 0);
|
||||
--border: oklch(1 0 0 / 10%);
|
||||
--input: oklch(1 0 0 / 15%);
|
||||
--ring: oklch(0.553 0.013 58.071);
|
||||
--chart-1: oklch(0.869 0.005 56.366);
|
||||
--chart-2: oklch(0.553 0.013 58.071);
|
||||
--chart-3: oklch(0.444 0.011 73.639);
|
||||
--chart-4: oklch(0.374 0.01 67.558);
|
||||
--chart-5: oklch(0.268 0.007 34.298);
|
||||
--sidebar: oklch(0.216 0.006 56.043);
|
||||
--sidebar-foreground: oklch(0.985 0.001 106.423);
|
||||
--sidebar-primary: oklch(0.488 0.243 264.376);
|
||||
--sidebar-primary-foreground: oklch(0.985 0.001 106.423);
|
||||
--sidebar-accent: oklch(0.268 0.007 34.298);
|
||||
--sidebar-accent-foreground: oklch(0.985 0.001 106.423);
|
||||
--sidebar-border: oklch(1 0 0 / 10%);
|
||||
--sidebar-ring: oklch(0.553 0.013 58.071);
|
||||
}
|
||||
}
|
||||
|
||||
[data-theme="violet"] {
|
||||
--background: oklch(1 0 0);
|
||||
--foreground: oklch(0.141 0.005 285.823);
|
||||
--card: oklch(1 0 0);
|
||||
--card-foreground: oklch(0.141 0.005 285.823);
|
||||
--popover: oklch(1 0 0);
|
||||
--popover-foreground: oklch(0.141 0.005 285.823);
|
||||
--primary: oklch(0.606 0.25 292.717);
|
||||
--primary-foreground: oklch(0.969 0.016 293.756);
|
||||
--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);
|
||||
--destructive: oklch(0.577 0.245 27.325);
|
||||
--destructive-foreground: oklch(0.985 0.002 247.839);
|
||||
--success: oklch(0.7999 0.1816 151.78);
|
||||
--success-foreground: oklch(0.9848 0 0);
|
||||
--border: oklch(0.92 0.004 286.32);
|
||||
--input: oklch(0.92 0.004 286.32);
|
||||
--ring: oklch(0.606 0.25 292.717);
|
||||
--chart-1: oklch(0.811 0.111 293.571);
|
||||
--chart-2: oklch(0.606 0.25 292.717);
|
||||
--chart-3: oklch(0.541 0.281 293.009);
|
||||
--chart-4: oklch(0.491 0.27 292.581);
|
||||
--chart-5: oklch(0.432 0.232 292.759);
|
||||
--sidebar: oklch(0.985 0 0);
|
||||
--sidebar-foreground: oklch(0.141 0.005 285.823);
|
||||
--sidebar-primary: oklch(0.606 0.25 292.717);
|
||||
--sidebar-primary-foreground: oklch(0.969 0.016 293.756);
|
||||
--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.606 0.25 292.717);
|
||||
|
||||
@variant dark {
|
||||
--background: oklch(0.141 0.005 285.823);
|
||||
--foreground: oklch(0.985 0 0);
|
||||
--card: oklch(0.21 0.006 285.885);
|
||||
--card-foreground: oklch(0.985 0 0);
|
||||
--popover: oklch(0.21 0.006 285.885);
|
||||
--popover-foreground: oklch(0.985 0 0);
|
||||
--primary: oklch(0.541 0.281 293.009);
|
||||
--primary-foreground: oklch(0.969 0.016 293.756);
|
||||
--secondary: oklch(0.274 0.006 286.033);
|
||||
--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);
|
||||
--accent-foreground: oklch(0.985 0 0);
|
||||
--destructive: oklch(0.704 0.191 22.216);
|
||||
--destructive-foreground: oklch(0.985 0.002 247.839);
|
||||
--success: oklch(0.627 0.194 149.214);
|
||||
--success-foreground: oklch(0.985 0 0);
|
||||
--border: oklch(1 0 0 / 10%);
|
||||
--input: oklch(1 0 0 / 15%);
|
||||
--ring: oklch(0.541 0.281 293.009);
|
||||
--chart-1: oklch(0.811 0.111 293.571);
|
||||
--chart-2: oklch(0.606 0.25 292.717);
|
||||
--chart-3: oklch(0.541 0.281 293.009);
|
||||
--chart-4: oklch(0.491 0.27 292.581);
|
||||
--chart-5: oklch(0.432 0.232 292.759);
|
||||
--sidebar: oklch(0.21 0.006 285.885);
|
||||
--sidebar-foreground: oklch(0.985 0 0);
|
||||
--sidebar-primary: oklch(0.541 0.281 293.009);
|
||||
--sidebar-primary-foreground: oklch(0.969 0.016 293.756);
|
||||
--sidebar-accent: oklch(0.274 0.006 286.033);
|
||||
--sidebar-accent-foreground: oklch(0.985 0 0);
|
||||
--sidebar-border: oklch(1 0 0 / 10%);
|
||||
--sidebar-ring: oklch(0.541 0.281 293.009);
|
||||
}
|
||||
}
|
||||
|
||||
[data-theme="yellow"] {
|
||||
--background: oklch(1 0 0);
|
||||
--foreground: oklch(0.141 0.005 285.823);
|
||||
--card: oklch(1 0 0);
|
||||
--card-foreground: oklch(0.141 0.005 285.823);
|
||||
--popover: oklch(1 0 0);
|
||||
--popover-foreground: oklch(0.141 0.005 285.823);
|
||||
--primary: oklch(0.795 0.184 86.047);
|
||||
--primary-foreground: oklch(0.421 0.095 57.708);
|
||||
--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);
|
||||
--destructive: oklch(0.577 0.245 27.325);
|
||||
--destructive-foreground: oklch(0.985 0.002 247.839);
|
||||
--success: oklch(0.7999 0.1816 151.78);
|
||||
--success-foreground: oklch(0.9848 0 0);
|
||||
--border: oklch(0.92 0.004 286.32);
|
||||
--input: oklch(0.92 0.004 286.32);
|
||||
--ring: oklch(0.795 0.184 86.047);
|
||||
--chart-1: oklch(0.905 0.182 98.111);
|
||||
--chart-2: oklch(0.795 0.184 86.047);
|
||||
--chart-3: oklch(0.681 0.162 75.834);
|
||||
--chart-4: oklch(0.554 0.135 66.442);
|
||||
--chart-5: oklch(0.476 0.114 61.907);
|
||||
--sidebar: oklch(0.985 0 0);
|
||||
--sidebar-foreground: oklch(0.141 0.005 285.823);
|
||||
--sidebar-primary: oklch(0.795 0.184 86.047);
|
||||
--sidebar-primary-foreground: oklch(0.421 0.095 57.708);
|
||||
--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.795 0.184 86.047);
|
||||
|
||||
@variant dark {
|
||||
--background: oklch(0.141 0.005 285.823);
|
||||
--foreground: oklch(0.985 0 0);
|
||||
--card: oklch(0.21 0.006 285.885);
|
||||
--card-foreground: oklch(0.985 0 0);
|
||||
--popover: oklch(0.21 0.006 285.885);
|
||||
--popover-foreground: oklch(0.985 0 0);
|
||||
--primary: oklch(0.795 0.184 86.047);
|
||||
--primary-foreground: oklch(0.421 0.095 57.708);
|
||||
--secondary: oklch(0.274 0.006 286.033);
|
||||
--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);
|
||||
--accent-foreground: oklch(0.985 0 0);
|
||||
--destructive: oklch(0.704 0.191 22.216);
|
||||
--destructive-foreground: oklch(0.985 0.002 247.839);
|
||||
--success: oklch(0.627 0.194 149.214);
|
||||
--success-foreground: oklch(0.985 0 0);
|
||||
--border: oklch(1 0 0 / 10%);
|
||||
--input: oklch(1 0 0 / 15%);
|
||||
--ring: oklch(0.554 0.135 66.442);
|
||||
--chart-1: oklch(0.905 0.182 98.111);
|
||||
--chart-2: oklch(0.795 0.184 86.047);
|
||||
--chart-3: oklch(0.681 0.162 75.834);
|
||||
--chart-4: oklch(0.554 0.135 66.442);
|
||||
--chart-5: oklch(0.476 0.114 61.907);
|
||||
--sidebar: oklch(0.21 0.006 285.885);
|
||||
--sidebar-foreground: oklch(0.985 0 0);
|
||||
--sidebar-primary: oklch(0.795 0.184 86.047);
|
||||
--sidebar-primary-foreground: oklch(0.421 0.095 57.708);
|
||||
--sidebar-accent: oklch(0.274 0.006 286.033);
|
||||
--sidebar-accent-foreground: oklch(0.985 0 0);
|
||||
--sidebar-border: oklch(1 0 0 / 10%);
|
||||
--sidebar-ring: oklch(0.554 0.135 66.442);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user