mirror of
https://github.com/unraid/api.git
synced 2026-01-04 15:39:52 -06:00
a1d02b486a
<!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Introduced a new `DropdownMenu` component in user profiles with dynamic content rendering. - Added a new `Popover` component with interactive Storybook demos, improving component discoverability. - Added a new `DropdownMenuArrow` component to enhance dropdown visuals. - Implemented new CSS custom properties for charts, enhancing styling capabilities in light and dark themes. - Enhanced dropdown functionality by encapsulating dropdown logic in a new `UpcDropdownMenu` component. - Added a new `Select` component for improved user interaction within the `Sheet` component. - Introduced a new `SheetWithSelect` story to showcase selection functionality within the `Sheet` component. - Updated the `Sidebar` component to improve modal behavior and content positioning. - Enhanced `UserProfile` components with a new feedback function for better status indication. - **Style** - Refined layouts by replacing fixed widths with flexible, responsive designs. - Updated global styling with a refreshed chart color palette and expanded dark mode support. - **Refactor** - Migrated components to use a unified UI library, streamlining interactions and boosting consistency. - Improved type safety in `BrandLoading` component by utilizing a new type for variants and sizes. - Updated component imports and organization to enhance maintainability. - **Bug Fixes** - Removed unused promotional code and components, simplifying the codebase and improving performance. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: mdatelle <mike@datelle.net> Co-authored-by: Zack Spear <hi@zackspear.com> Co-authored-by: Eli Bosley <ekbosley@gmail.com>
94 lines
2.6 KiB
TypeScript
94 lines
2.6 KiB
TypeScript
import tailwindRemToRem from '@unraid/tailwind-rem-to-rem';
|
|
import type { Config } from 'tailwindcss';
|
|
import tailwindcssAnimate from 'tailwindcss-animate';
|
|
import { unraidPreset } from './src/theme/preset';
|
|
|
|
export default {
|
|
darkMode: ['class'],
|
|
presets: [unraidPreset],
|
|
content: [
|
|
'./src/components/**/*.{js,vue,ts}',
|
|
'./src/components/**/*.ce.{js,vue,ts}',
|
|
'./src/composables/**/*.{js,vue,ts}',
|
|
'./stories/**/*.stories.{js,ts,jsx,mdx}',
|
|
'./index.html',
|
|
],
|
|
safelist: [
|
|
'dark',
|
|
'unraid_mark_1',
|
|
'unraid_mark_2',
|
|
'unraid_mark_3',
|
|
'unraid_mark_4',
|
|
'unraid_mark_6',
|
|
'unraid_mark_7',
|
|
'unraid_mark_8',
|
|
'unraid_mark_9',
|
|
{
|
|
pattern: /^text-(header-text-secondary|orange-dark)$/,
|
|
variants: ['group-hover', 'group-focus'],
|
|
},
|
|
{
|
|
pattern: /^(underline|no-underline)$/,
|
|
variants: ['group-hover', 'group-focus'],
|
|
},
|
|
],
|
|
plugins: [
|
|
tailwindRemToRem({
|
|
baseFontSize: 16,
|
|
newFontSize: Number(process.env.VITE_TAILWIND_BASE_FONT_SIZE ?? 10),
|
|
}),
|
|
tailwindcssAnimate,
|
|
],
|
|
theme: {
|
|
extend: {
|
|
borderRadius: {
|
|
lg: 'var(--radius)',
|
|
md: 'calc(var(--radius) - 2px)',
|
|
sm: 'calc(var(--radius) - 4px)',
|
|
},
|
|
colors: {
|
|
background: 'hsl(var(--background))',
|
|
foreground: 'hsl(var(--foreground))',
|
|
card: {
|
|
DEFAULT: 'hsl(var(--card))',
|
|
foreground: 'hsl(var(--card-foreground))',
|
|
},
|
|
popover: {
|
|
DEFAULT: 'hsl(var(--popover))',
|
|
foreground: 'hsl(var(--popover-foreground))',
|
|
},
|
|
primary: {
|
|
DEFAULT: 'hsl(var(--primary))',
|
|
foreground: 'hsl(var(--primary-foreground))',
|
|
},
|
|
secondary: {
|
|
DEFAULT: 'hsl(var(--secondary))',
|
|
foreground: 'hsl(var(--secondary-foreground))',
|
|
},
|
|
muted: {
|
|
DEFAULT: 'hsl(var(--muted))',
|
|
foreground: 'hsl(var(--muted-foreground))',
|
|
},
|
|
accent: {
|
|
DEFAULT: 'hsl(var(--accent))',
|
|
foreground: 'hsl(var(--accent-foreground))',
|
|
},
|
|
destructive: {
|
|
DEFAULT: 'hsl(var(--destructive))',
|
|
foreground: 'hsl(var(--destructive-foreground))',
|
|
},
|
|
border: 'hsl(var(--border))',
|
|
input: 'hsl(var(--input))',
|
|
ring: 'hsl(var(--ring))',
|
|
chart: {
|
|
'1': 'hsl(var(--chart-1))',
|
|
'2': 'hsl(var(--chart-2))',
|
|
'3': 'hsl(var(--chart-3))',
|
|
'4': 'hsl(var(--chart-4))',
|
|
'5': 'hsl(var(--chart-5))',
|
|
},
|
|
},
|
|
},
|
|
},
|
|
} satisfies Partial<Config>;
|