@brumaombra/ui-vintage 0.9.1 → 0.9.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/module.mjs +43 -43
- package/package.json +175 -175
- package/src/components/background-grid/BackgroundGrid.vue +4 -4
- package/src/components/blog/AllPostsSection.vue +33 -33
- package/src/components/blog/BlogContentRenderer.vue +111 -111
- package/src/components/blog/BlogFAQSection.vue +19 -19
- package/src/components/blog/BlogHeaderSection.vue +80 -80
- package/src/components/blog/BlogInfoSection.vue +47 -47
- package/src/components/blog/BlogPostHeader.vue +135 -135
- package/src/components/blog/BlogProgressBar.vue +33 -33
- package/src/components/blog/BlogSectionTitle.vue +22 -22
- package/src/components/blog/BlogTagsSection.vue +25 -25
- package/src/components/blog/CategoriesList.vue +14 -14
- package/src/components/blog/CategoriesSection.vue +11 -11
- package/src/components/blog/CategoryCard.vue +25 -25
- package/src/components/blog/HeaderCarousel.vue +97 -97
- package/src/components/blog/PostCard.vue +33 -33
- package/src/components/blog/PostsList.vue +15 -15
- package/src/components/blog/SocialShareSidebar.vue +84 -84
- package/src/components/blog/TableOfContents.vue +307 -307
- package/src/components/busy-indicator/BusyIndicator.vue +7 -7
- package/src/components/busy-indicator/busy-indicator-state.ts +56 -56
- package/src/components/card-grid/CardGrid.vue +34 -34
- package/src/components/chip/Chip.vue +15 -15
- package/src/components/confirm-dialog/ConfirmDialog.vue +50 -50
- package/src/components/confirm-dialog/confirm-dialog-state.ts +131 -131
- package/src/components/content/BlogList.vue +30 -30
- package/src/components/content/BlogTable.vue +36 -36
- package/src/components/content/CodeBlock.vue +136 -136
- package/src/components/content/Flow.vue +60 -60
- package/src/components/content/ProseHr.vue +15 -15
- package/src/components/content/ProsePre.vue +12 -12
- package/src/components/content/Terminal.vue +59 -59
- package/src/components/cookie-consent/CookieConsent.vue +36 -36
- package/src/components/cookie-consent/useCookieConsent.ts +37 -37
- package/src/components/dashboard-shell/DashboardShell.vue +171 -171
- package/src/components/data-list/DataList.vue +6 -6
- package/src/components/data-list/DataListItem.vue +4 -4
- package/src/components/data-list/DataListLabel.vue +4 -4
- package/src/components/data-list/DataListText.vue +4 -4
- package/src/components/data-list/DataListValue.vue +4 -4
- package/src/components/empty-state-card/EmptyStateCard.vue +40 -40
- package/src/components/error-page/ErrorPage.vue +72 -72
- package/src/components/info-card/InfoCard.vue +31 -31
- package/src/components/landing/landing-content/LandingContent.vue +4 -4
- package/src/components/landing/landing-footer/LandingFooter.vue +128 -128
- package/src/components/landing/landing-navbar/LandingNavbar.vue +50 -50
- package/src/components/landing/landing-shell/LandingShell.vue +36 -36
- package/src/components/language-flag/LanguageFlag.vue +25 -25
- package/src/components/language-flag/flags/ChineseFlag.vue +8 -8
- package/src/components/language-flag/flags/EnglishFlag.vue +7 -7
- package/src/components/language-flag/flags/FrenchFlag.vue +5 -5
- package/src/components/language-flag/flags/GermanFlag.vue +5 -5
- package/src/components/language-flag/flags/ItalianFlag.vue +7 -7
- package/src/components/language-flag/flags/JapaneseFlag.vue +4 -4
- package/src/components/language-flag/flags/PortugueseFlag.vue +57 -57
- package/src/components/language-flag/flags/RussianFlag.vue +5 -5
- package/src/components/language-flag/flags/SpanishFlag.vue +4 -4
- package/src/components/language-selector/LanguageSelector.vue +76 -76
- package/src/components/load-more-button/LoadMoreButton.vue +17 -17
- package/src/components/loading-state-card/LoadingStateCard.vue +28 -28
- package/src/components/message-dialog/MessageDialog.vue +59 -59
- package/src/components/message-dialog/message-dialog-state.ts +105 -105
- package/src/components/message-toast/MessageToast.vue +149 -149
- package/src/components/message-toast/message-toast-state.ts +146 -146
- package/src/components/page-header/PageHeader.vue +34 -34
- package/src/components/progress-component/ProgressComponent.vue +33 -33
- package/src/components/single-value-card/SingleValueCard.vue +57 -57
- package/src/components/slider-form-component/SliderFormComponent.vue +36 -36
- package/src/components/stat-strip/StatStrip.vue +22 -22
- package/src/components/switch-form-component/SwitchFormComponent.vue +20 -20
- package/src/components/text-link/TextLink.vue +14 -14
- package/src/components/theme-selector/ThemeSelector.vue +61 -61
- package/src/components/theme-selector/theme-transition.ts +63 -63
- package/src/components/ui/accordion/Accordion.vue +38 -38
- package/src/components/ui/alert/Alert.vue +5 -5
- package/src/components/ui/alert/AlertDescription.vue +4 -4
- package/src/components/ui/alert/AlertTitle.vue +4 -4
- package/src/components/ui/alert/index.ts +2 -2
- package/src/components/ui/alert-dialog/AlertDialog.vue +3 -3
- package/src/components/ui/alert-dialog/AlertDialogAction.vue +3 -3
- package/src/components/ui/alert-dialog/AlertDialogCancel.vue +3 -3
- package/src/components/ui/alert-dialog/AlertDialogContent.vue +7 -7
- package/src/components/ui/alert-dialog/AlertDialogDescription.vue +3 -3
- package/src/components/ui/alert-dialog/AlertDialogFooter.vue +4 -4
- package/src/components/ui/alert-dialog/AlertDialogHeader.vue +4 -4
- package/src/components/ui/alert-dialog/AlertDialogTitle.vue +3 -3
- package/src/components/ui/alert-dialog/AlertDialogTrigger.vue +3 -3
- package/src/components/ui/animated-number/AnimatedNumber.vue +49 -48
- package/src/components/ui/avatar/Avatar.vue +28 -28
- package/src/components/ui/avatar/AvatarFallback.vue +6 -6
- package/src/components/ui/avatar/AvatarGroup.vue +40 -40
- package/src/components/ui/avatar/AvatarImage.vue +3 -3
- package/src/components/ui/avatar/index.ts +17 -17
- package/src/components/ui/badge/Badge.vue +20 -20
- package/src/components/ui/breadcrumb/Breadcrumb.vue +4 -4
- package/src/components/ui/breadcrumb/BreadcrumbEllipsis.vue +9 -9
- package/src/components/ui/breadcrumb/BreadcrumbItem.vue +4 -4
- package/src/components/ui/breadcrumb/BreadcrumbLink.vue +4 -4
- package/src/components/ui/breadcrumb/BreadcrumbList.vue +4 -4
- package/src/components/ui/breadcrumb/BreadcrumbPage.vue +4 -4
- package/src/components/ui/breadcrumb/BreadcrumbSeparator.vue +4 -4
- package/src/components/ui/busy/Busy.vue +33 -33
- package/src/components/ui/button/Button.vue +23 -23
- package/src/components/ui/button/index.ts +56 -56
- package/src/components/ui/calendar/Calendar.vue +138 -138
- package/src/components/ui/calendar/CalendarCell.vue +7 -7
- package/src/components/ui/calendar/CalendarCellTrigger.vue +18 -18
- package/src/components/ui/calendar/CalendarGrid.vue +3 -3
- package/src/components/ui/calendar/CalendarGridBody.vue +3 -3
- package/src/components/ui/calendar/CalendarGridHead.vue +3 -3
- package/src/components/ui/calendar/CalendarGridRow.vue +3 -3
- package/src/components/ui/calendar/CalendarHeadCell.vue +7 -7
- package/src/components/ui/calendar/CalendarHeader.vue +7 -7
- package/src/components/ui/calendar/CalendarHeading.vue +6 -6
- package/src/components/ui/calendar/CalendarNextButton.vue +15 -15
- package/src/components/ui/calendar/CalendarPrevButton.vue +15 -15
- package/src/components/ui/calendar/index.ts +4 -4
- package/src/components/ui/card/Card.vue +20 -20
- package/src/components/ui/card/CardAction.vue +8 -8
- package/src/components/ui/card/CardContent.vue +4 -4
- package/src/components/ui/card/CardDescription.vue +12 -12
- package/src/components/ui/card/CardFooter.vue +4 -4
- package/src/components/ui/card/CardHeader.vue +8 -8
- package/src/components/ui/card/CardText.vue +8 -8
- package/src/components/ui/card/CardTitle.vue +8 -8
- package/src/components/ui/checkbox/Checkbox.vue +27 -27
- package/src/components/ui/collapsible/Collapsible.vue +3 -3
- package/src/components/ui/collapsible/CollapsibleContent.vue +3 -3
- package/src/components/ui/collapsible/CollapsibleTrigger.vue +3 -3
- package/src/components/ui/combobox/Combobox.vue +4 -4
- package/src/components/ui/combobox/ComboboxAnchor.vue +16 -16
- package/src/components/ui/combobox/ComboboxEmpty.vue +3 -3
- package/src/components/ui/combobox/ComboboxGroup.vue +9 -9
- package/src/components/ui/combobox/ComboboxInput.vue +6 -6
- package/src/components/ui/combobox/ComboboxItem.vue +17 -17
- package/src/components/ui/combobox/ComboboxList.vue +19 -19
- package/src/components/ui/combobox/ComboboxSelect.vue +77 -77
- package/src/components/ui/combobox/ComboboxSeparator.vue +1 -1
- package/src/components/ui/combobox/ComboboxTrigger.vue +10 -10
- package/src/components/ui/combobox/types.ts +5 -5
- package/src/components/ui/command/Command.vue +48 -48
- package/src/components/ui/command/CommandDialog.vue +14 -14
- package/src/components/ui/command/CommandEmpty.vue +4 -4
- package/src/components/ui/command/CommandGroup.vue +23 -23
- package/src/components/ui/command/CommandInput.vue +9 -9
- package/src/components/ui/command/CommandItem.vue +40 -40
- package/src/components/ui/command/CommandList.vue +9 -9
- package/src/components/ui/command/CommandSeparator.vue +3 -3
- package/src/components/ui/command/CommandShortcut.vue +8 -8
- package/src/components/ui/command/index.ts +11 -11
- package/src/components/ui/data-table/DataTable.vue +145 -145
- package/src/components/ui/data-table/index.ts +11 -11
- package/src/components/ui/date-picker/DatePicker.vue +31 -31
- package/src/components/ui/date-time-picker/DateTimePicker.vue +97 -97
- package/src/components/ui/dialog/Dialog.vue +3 -3
- package/src/components/ui/dialog/DialogClose.vue +3 -3
- package/src/components/ui/dialog/DialogContent.vue +21 -21
- package/src/components/ui/dialog/DialogDescription.vue +7 -7
- package/src/components/ui/dialog/DialogFooter.vue +8 -8
- package/src/components/ui/dialog/DialogHeader.vue +4 -4
- package/src/components/ui/dialog/DialogOverlay.vue +7 -7
- package/src/components/ui/dialog/DialogScrollContent.vue +32 -32
- package/src/components/ui/dialog/DialogTitle.vue +3 -3
- package/src/components/ui/dialog/DialogTrigger.vue +3 -3
- package/src/components/ui/dropdown-menu/DropdownMenu.vue +3 -3
- package/src/components/ui/dropdown-menu/DropdownMenuCheckboxItem.vue +11 -11
- package/src/components/ui/dropdown-menu/DropdownMenuContent.vue +15 -15
- package/src/components/ui/dropdown-menu/DropdownMenuGroup.vue +3 -3
- package/src/components/ui/dropdown-menu/DropdownMenuItem.vue +12 -12
- package/src/components/ui/dropdown-menu/DropdownMenuLabel.vue +9 -9
- package/src/components/ui/dropdown-menu/DropdownMenuPortal.vue +3 -3
- package/src/components/ui/dropdown-menu/DropdownMenuRadioGroup.vue +3 -3
- package/src/components/ui/dropdown-menu/DropdownMenuRadioItem.vue +11 -11
- package/src/components/ui/dropdown-menu/DropdownMenuSeparator.vue +1 -1
- package/src/components/ui/dropdown-menu/DropdownMenuShortcut.vue +4 -4
- package/src/components/ui/dropdown-menu/DropdownMenuSub.vue +3 -3
- package/src/components/ui/dropdown-menu/DropdownMenuSubContent.vue +15 -15
- package/src/components/ui/dropdown-menu/DropdownMenuSubTrigger.vue +15 -15
- package/src/components/ui/dropdown-menu/DropdownMenuTrigger.vue +3 -3
- package/src/components/ui/dropdown-menu/classes.ts +16 -16
- package/src/components/ui/field/Field.vue +5 -5
- package/src/components/ui/field/FieldContent.vue +8 -8
- package/src/components/ui/field/FieldDescription.vue +10 -10
- package/src/components/ui/field/FieldError.vue +39 -39
- package/src/components/ui/field/FieldGroup.vue +8 -8
- package/src/components/ui/field/FieldLabel.vue +10 -10
- package/src/components/ui/field/FieldLegend.vue +11 -11
- package/src/components/ui/field/FieldSeparator.vue +11 -11
- package/src/components/ui/field/FieldSet.vue +9 -9
- package/src/components/ui/field/FieldTitle.vue +8 -8
- package/src/components/ui/field/field-context.ts +36 -36
- package/src/components/ui/field/index.ts +22 -22
- package/src/components/ui/file-dropzone/FileDropzone.vue +144 -144
- package/src/components/ui/file-dropzone/index.ts +19 -19
- package/src/components/ui/hover-card/HoverCard.vue +5 -5
- package/src/components/ui/hover-card/HoverCardContent.vue +13 -13
- package/src/components/ui/hover-card/HoverCardTrigger.vue +3 -3
- package/src/components/ui/input/Input.vue +13 -13
- package/src/components/ui/kbd/Kbd.vue +10 -10
- package/src/components/ui/kbd/KbdGroup.vue +49 -49
- package/src/components/ui/label/Label.vue +7 -7
- package/src/components/ui/native-select/NativeSelect.vue +16 -16
- package/src/components/ui/native-select/NativeSelectOptGroup.vue +3 -3
- package/src/components/ui/native-select/NativeSelectOption.vue +3 -3
- package/src/components/ui/number-field/NumberField.vue +88 -88
- package/src/components/ui/pagination/Pagination.vue +4 -4
- package/src/components/ui/pagination/PaginationContent.vue +4 -4
- package/src/components/ui/pagination/PaginationEllipsis.vue +9 -9
- package/src/components/ui/pagination/PaginationFirst.vue +8 -8
- package/src/components/ui/pagination/PaginationItem.vue +14 -14
- package/src/components/ui/pagination/PaginationLast.vue +8 -8
- package/src/components/ui/pagination/PaginationNext.vue +8 -8
- package/src/components/ui/pagination/PaginationPrevious.vue +8 -8
- package/src/components/ui/pagination/SimplePagination.vue +25 -25
- package/src/components/ui/pin-input/PinInput.vue +20 -20
- package/src/components/ui/pin-input/PinInputInput.vue +17 -17
- package/src/components/ui/pin-input/context.ts +1 -1
- package/src/components/ui/popover/Popover.vue +3 -3
- package/src/components/ui/popover/PopoverAnchor.vue +3 -3
- package/src/components/ui/popover/PopoverContent.vue +12 -12
- package/src/components/ui/popover/PopoverTrigger.vue +3 -3
- package/src/components/ui/progress/Progress.vue +16 -16
- package/src/components/ui/radio-group/RadioGroup.vue +7 -7
- package/src/components/ui/radio-group/RadioGroupCard.vue +39 -39
- package/src/components/ui/radio-group/RadioGroupItem.vue +20 -20
- package/src/components/ui/scroll-area/ScrollArea.vue +14 -14
- package/src/components/ui/scroll-area/ScrollBar.vue +12 -12
- package/src/components/ui/select/Select.vue +3 -3
- package/src/components/ui/select/SelectContent.vue +25 -25
- package/src/components/ui/select/SelectGroup.vue +3 -3
- package/src/components/ui/select/SelectItem.vue +24 -24
- package/src/components/ui/select/SelectItemContent.vue +32 -32
- package/src/components/ui/select/SelectItemText.vue +3 -3
- package/src/components/ui/select/SelectLabel.vue +3 -3
- package/src/components/ui/select/SelectScrollDownButton.vue +9 -9
- package/src/components/ui/select/SelectScrollUpButton.vue +9 -9
- package/src/components/ui/select/SelectSeparator.vue +2 -2
- package/src/components/ui/select/SelectTrigger.vue +14 -14
- package/src/components/ui/select/SelectValue.vue +3 -3
- package/src/components/ui/select/SelectValueContent.vue +39 -39
- package/src/components/ui/separator/Separator.vue +7 -7
- package/src/components/ui/sheet/Sheet.vue +3 -3
- package/src/components/ui/sheet/SheetClose.vue +3 -3
- package/src/components/ui/sheet/SheetContent.vue +22 -22
- package/src/components/ui/sheet/SheetDescription.vue +3 -3
- package/src/components/ui/sheet/SheetFooter.vue +3 -3
- package/src/components/ui/sheet/SheetHeader.vue +3 -3
- package/src/components/ui/sheet/SheetOverlay.vue +7 -7
- package/src/components/ui/sheet/SheetTitle.vue +3 -3
- package/src/components/ui/sheet/SheetTrigger.vue +3 -3
- package/src/components/ui/sidebar/Sidebar.vue +57 -57
- package/src/components/ui/sidebar/SidebarContent.vue +8 -8
- package/src/components/ui/sidebar/SidebarFooter.vue +8 -8
- package/src/components/ui/sidebar/SidebarGroup.vue +8 -8
- package/src/components/ui/sidebar/SidebarGroupAction.vue +9 -9
- package/src/components/ui/sidebar/SidebarGroupContent.vue +4 -4
- package/src/components/ui/sidebar/SidebarGroupLabel.vue +8 -8
- package/src/components/ui/sidebar/SidebarHeader.vue +8 -8
- package/src/components/ui/sidebar/SidebarInput.vue +8 -8
- package/src/components/ui/sidebar/SidebarInset.vue +9 -9
- package/src/components/ui/sidebar/SidebarMenu.vue +4 -4
- package/src/components/ui/sidebar/SidebarMenuAction.vue +18 -18
- package/src/components/ui/sidebar/SidebarMenuBadge.vue +14 -14
- package/src/components/ui/sidebar/SidebarMenuButton.vue +21 -21
- package/src/components/ui/sidebar/SidebarMenuButtonChild.vue +10 -10
- package/src/components/ui/sidebar/SidebarMenuItem.vue +4 -4
- package/src/components/ui/sidebar/SidebarMenuSkeleton.vue +10 -10
- package/src/components/ui/sidebar/SidebarMenuSub.vue +9 -9
- package/src/components/ui/sidebar/SidebarMenuSubButton.vue +17 -17
- package/src/components/ui/sidebar/SidebarMenuSubItem.vue +4 -4
- package/src/components/ui/sidebar/SidebarProvider.vue +46 -46
- package/src/components/ui/sidebar/SidebarRail.vue +13 -13
- package/src/components/ui/sidebar/SidebarSeparator.vue +4 -4
- package/src/components/ui/sidebar/SidebarTrigger.vue +5 -5
- package/src/components/ui/sidebar/index.ts +29 -29
- package/src/components/ui/sidebar/utils.ts +7 -7
- package/src/components/ui/skeleton/Skeleton.vue +6 -6
- package/src/components/ui/slider/Slider.vue +14 -14
- package/src/components/ui/spinner/Spinner.vue +21 -21
- package/src/components/ui/stepper/SimpleStepper.vue +26 -26
- package/src/components/ui/stepper/Stepper.vue +6 -6
- package/src/components/ui/stepper/StepperDescription.vue +5 -5
- package/src/components/ui/stepper/StepperIndicator.vue +17 -17
- package/src/components/ui/stepper/StepperItem.vue +4 -4
- package/src/components/ui/stepper/StepperSeparator.vue +7 -7
- package/src/components/ui/stepper/StepperTitle.vue +5 -5
- package/src/components/ui/stepper/StepperTrigger.vue +4 -4
- package/src/components/ui/stepper/index.ts +3 -3
- package/src/components/ui/switch/Switch.vue +15 -15
- package/src/components/ui/table/Table.vue +6 -6
- package/src/components/ui/table/TableBody.vue +4 -4
- package/src/components/ui/table/TableCaption.vue +4 -4
- package/src/components/ui/table/TableCell.vue +8 -8
- package/src/components/ui/table/TableEmpty.vue +14 -14
- package/src/components/ui/table/TableFooter.vue +8 -8
- package/src/components/ui/table/TableHead.vue +8 -8
- package/src/components/ui/table/TableHeader.vue +4 -4
- package/src/components/ui/table/TableRow.vue +8 -8
- package/src/components/ui/tabs/Tabs.vue +4 -4
- package/src/components/ui/tabs/TabsContent.vue +4 -4
- package/src/components/ui/tabs/TabsList.vue +15 -15
- package/src/components/ui/tabs/TabsTrigger.vue +10 -10
- package/src/components/ui/tags-input/TagsInput.vue +17 -17
- package/src/components/ui/tags-input/TagsInputInput.vue +6 -6
- package/src/components/ui/tags-input/TagsInputItem.vue +15 -15
- package/src/components/ui/tags-input/TagsInputItemDelete.vue +12 -12
- package/src/components/ui/tags-input/TagsInputItemText.vue +4 -4
- package/src/components/ui/textarea/Textarea.vue +12 -12
- package/src/components/ui/time-picker/TimePicker.vue +25 -25
- package/src/components/ui/toggle-group/Toggle.vue +10 -10
- package/src/components/ui/toggle-group/ToggleGroup.vue +38 -38
- package/src/components/ui/toggle-group/ToggleGroupItem.vue +9 -9
- package/src/components/ui/toggle-group/index.ts +46 -46
- package/src/components/ui/tooltip/Tooltip.vue +3 -3
- package/src/components/ui/tooltip/TooltipContent.vue +13 -13
- package/src/components/ui/tooltip/TooltipProvider.vue +4 -4
- package/src/components/ui/tooltip/TooltipTrigger.vue +3 -3
- package/src/i18n/de.json +185 -185
- package/src/i18n/en.json +185 -185
- package/src/i18n/es.json +185 -185
- package/src/i18n/fr.json +185 -185
- package/src/i18n/it.json +185 -185
- package/src/i18n/ja.json +185 -185
- package/src/i18n/pt.json +185 -185
- package/src/i18n/ru.json +185 -185
- package/src/i18n/zh.json +185 -185
- package/src/lib/color-tokens.ts +24 -24
- package/src/lib/i18n.ts +65 -65
- package/src/lib/utils.ts +33 -33
- package/src/nuxt-components.d.ts +2 -2
- package/src/runtime/ui-vintage-i18n-plugin.ts +49 -49
- package/src/shims-vue.d.ts +3 -3
- package/src/styles.css +377 -377
package/src/styles.css
CHANGED
|
@@ -3,267 +3,267 @@
|
|
|
3
3
|
@source "./**/*.{ts,vue}";
|
|
4
4
|
|
|
5
5
|
html {
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
6
|
+
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
|
|
7
|
+
-webkit-font-smoothing: antialiased;
|
|
8
|
+
-moz-osx-font-smoothing: grayscale;
|
|
9
|
+
text-rendering: optimizeLegibility;
|
|
10
|
+
-webkit-tap-highlight-color: transparent;
|
|
11
11
|
}
|
|
12
12
|
|
|
13
13
|
:root {
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
14
|
+
color-scheme: light;
|
|
15
|
+
|
|
16
|
+
/*********************** Core custom colors ***********************/
|
|
17
|
+
|
|
18
|
+
--bg-main-light: #fafafa;
|
|
19
|
+
--bg-main-dark: #0f1318;
|
|
20
|
+
--bg-card-light: #ffffff;
|
|
21
|
+
--bg-card-dark: #171c23;
|
|
22
|
+
--bg-surface-light: #f6f8fa;
|
|
23
|
+
--bg-surface-dark: #1c222b;
|
|
24
|
+
--bg-selected-light: #edf1f5;
|
|
25
|
+
--bg-selected-dark: #202733;
|
|
26
|
+
|
|
27
|
+
--text-primary-light: #1b222d;
|
|
28
|
+
--text-primary-dark: #eef3f8;
|
|
29
|
+
--text-secondary-light: #66707d;
|
|
30
|
+
--text-secondary-dark: #97a2b2;
|
|
31
|
+
|
|
32
|
+
--button-primary-light: #f7931a;
|
|
33
|
+
--button-primary-hover-light: #df8112;
|
|
34
|
+
--button-primary-dark: #f7a23c;
|
|
35
|
+
--button-primary-hover-dark: #ffb55b;
|
|
36
|
+
--button-primary-foreground-light: var(--text-primary-light);
|
|
37
|
+
--button-primary-foreground-dark: #1b1307;
|
|
38
|
+
--button-secondary-light: #ffffff;
|
|
39
|
+
--button-secondary-dark: #171c23;
|
|
40
|
+
|
|
41
|
+
--border-light: #d8dee7;
|
|
42
|
+
--border-dark: #313948;
|
|
43
|
+
--border-hover-light: #a7b0bd;
|
|
44
|
+
--border-hover-dark: #5d6878;
|
|
45
|
+
|
|
46
|
+
/*********************** Motion tokens ***********************/
|
|
47
|
+
|
|
48
|
+
--uv-duration-fast: 150ms;
|
|
49
|
+
--uv-duration-base: 220ms;
|
|
50
|
+
--uv-duration-slow: 420ms;
|
|
51
|
+
|
|
52
|
+
/*********************** Elevation tokens ***********************/
|
|
53
|
+
|
|
54
|
+
--uv-shadow-sm: 0 1px 2px rgb(16 24 40 / 0.05);
|
|
55
|
+
--uv-shadow-md: 0 1px 2px rgb(16 24 40 / 0.04), 0 4px 12px -4px rgb(16 24 40 / 0.08);
|
|
56
|
+
--uv-shadow-lg: 0 2px 4px rgb(16 24 40 / 0.04), 0 12px 32px -8px rgb(16 24 40 / 0.16);
|
|
57
|
+
--uv-shadow-xl: 0 4px 8px rgb(16 24 40 / 0.04), 0 24px 64px -12px rgb(16 24 40 / 0.28);
|
|
58
|
+
--uv-shadow-glow: 0 0 0 1px color-mix(in oklab, var(--primary) 40%, transparent), 0 8px 24px -6px color-mix(in oklab, var(--primary) 45%, transparent);
|
|
59
|
+
|
|
60
|
+
/*********************** Shadcn UI variables ***********************/
|
|
61
|
+
|
|
62
|
+
--radius: 0.625rem;
|
|
63
|
+
--background: var(--bg-main-light);
|
|
64
|
+
--foreground: var(--text-primary-light);
|
|
65
|
+
--card: var(--bg-card-light);
|
|
66
|
+
--card-foreground: var(--text-primary-light);
|
|
67
|
+
--popover: var(--bg-card-light);
|
|
68
|
+
--popover-foreground: var(--text-primary-light);
|
|
69
|
+
--primary: var(--button-primary-light);
|
|
70
|
+
--primary-hover: var(--button-primary-hover-light);
|
|
71
|
+
--primary-foreground: var(--button-primary-foreground-light);
|
|
72
|
+
--secondary: var(--button-secondary-light);
|
|
73
|
+
--secondary-foreground: var(--text-primary-light);
|
|
74
|
+
--surface: var(--bg-surface-light);
|
|
75
|
+
--muted: var(--bg-selected-light);
|
|
76
|
+
--muted-foreground: var(--text-secondary-light);
|
|
77
|
+
--accent: var(--bg-selected-light);
|
|
78
|
+
--accent-foreground: var(--text-primary-light);
|
|
79
|
+
--destructive: oklch(0.577 0.245 27.325);
|
|
80
|
+
--success: oklch(0.627 0.17 149.2);
|
|
81
|
+
--warning: oklch(0.705 0.17 62.5);
|
|
82
|
+
--info: oklch(0.588 0.19 256.8);
|
|
83
|
+
--border: var(--border-light);
|
|
84
|
+
--border-strong: var(--border-hover-light);
|
|
85
|
+
--input: var(--border-light);
|
|
86
|
+
--ring: var(--button-primary-light);
|
|
87
|
+
--chart-1: oklch(0.646 0.222 41.116);
|
|
88
|
+
--chart-2: oklch(0.6 0.118 184.704);
|
|
89
|
+
--chart-3: oklch(0.398 0.07 227.392);
|
|
90
|
+
--chart-4: oklch(0.828 0.189 84.429);
|
|
91
|
+
--chart-5: oklch(0.769 0.188 70.08);
|
|
92
|
+
--sidebar: var(--bg-card-light);
|
|
93
|
+
--sidebar-foreground: var(--text-primary-light);
|
|
94
|
+
--sidebar-primary: var(--button-primary-light);
|
|
95
|
+
--sidebar-primary-foreground: var(--button-primary-foreground-light);
|
|
96
|
+
--sidebar-accent: var(--bg-selected-light);
|
|
97
|
+
--sidebar-accent-foreground: var(--text-primary-light);
|
|
98
|
+
--sidebar-border: var(--border-light);
|
|
99
|
+
--sidebar-ring: var(--button-primary-light);
|
|
100
100
|
}
|
|
101
101
|
|
|
102
102
|
@theme inline {
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
103
|
+
--radius-sm: calc(var(--radius) - 4px);
|
|
104
|
+
--radius-md: calc(var(--radius) - 2px);
|
|
105
|
+
--radius-lg: var(--radius);
|
|
106
|
+
--radius-xl: calc(var(--radius) + 4px);
|
|
107
|
+
--color-background: var(--background);
|
|
108
|
+
--color-foreground: var(--foreground);
|
|
109
|
+
--color-card: var(--card);
|
|
110
|
+
--color-card-foreground: var(--card-foreground);
|
|
111
|
+
--color-popover: var(--popover);
|
|
112
|
+
--color-popover-foreground: var(--popover-foreground);
|
|
113
|
+
--color-primary: var(--primary);
|
|
114
|
+
--color-primary-hover: var(--primary-hover);
|
|
115
|
+
--color-primary-foreground: var(--primary-foreground);
|
|
116
|
+
--color-secondary: var(--secondary);
|
|
117
|
+
--color-secondary-foreground: var(--secondary-foreground);
|
|
118
|
+
--color-surface: var(--surface);
|
|
119
|
+
--color-muted: var(--muted);
|
|
120
|
+
--color-muted-foreground: var(--muted-foreground);
|
|
121
|
+
--color-accent: var(--accent);
|
|
122
|
+
--color-accent-foreground: var(--accent-foreground);
|
|
123
|
+
--color-destructive: var(--destructive);
|
|
124
|
+
--color-success: var(--success);
|
|
125
|
+
--color-warning: var(--warning);
|
|
126
|
+
--color-info: var(--info);
|
|
127
|
+
--color-border: var(--border);
|
|
128
|
+
--color-border-strong: var(--border-strong);
|
|
129
|
+
--color-input: var(--input);
|
|
130
|
+
--color-ring: var(--ring);
|
|
131
|
+
--color-chart-1: var(--chart-1);
|
|
132
|
+
--color-chart-2: var(--chart-2);
|
|
133
|
+
--color-chart-3: var(--chart-3);
|
|
134
|
+
--color-chart-4: var(--chart-4);
|
|
135
|
+
--color-chart-5: var(--chart-5);
|
|
136
|
+
--color-sidebar: var(--sidebar);
|
|
137
|
+
--color-sidebar-foreground: var(--sidebar-foreground);
|
|
138
|
+
--color-sidebar-primary: var(--sidebar-primary);
|
|
139
|
+
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
|
140
|
+
--color-sidebar-accent: var(--sidebar-accent);
|
|
141
|
+
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
|
142
|
+
--color-sidebar-border: var(--sidebar-border);
|
|
143
|
+
--color-sidebar-ring: var(--sidebar-ring);
|
|
144
|
+
|
|
145
|
+
/* Elevation utilities: shadow-elevated-sm, shadow-elevated-md, ... */
|
|
146
|
+
--shadow-elevated-sm: var(--uv-shadow-sm);
|
|
147
|
+
--shadow-elevated-md: var(--uv-shadow-md);
|
|
148
|
+
--shadow-elevated-lg: var(--uv-shadow-lg);
|
|
149
|
+
--shadow-elevated-xl: var(--uv-shadow-xl);
|
|
150
|
+
--shadow-glow: var(--uv-shadow-glow);
|
|
151
151
|
}
|
|
152
152
|
|
|
153
153
|
/*********************** Motion system ***********************/
|
|
154
154
|
|
|
155
155
|
@theme {
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
156
|
+
/* Easing utilities: ease-spring, ease-bounce, ease-out-expo, ease-snappy */
|
|
157
|
+
--ease-spring: linear(0, 0.0074, 0.0292 1.6%, 0.1136 3.4%, 0.4254 8.4%, 0.5703 11%, 0.6922 13.7%, 0.7929 16.6%, 0.8729 19.8%, 0.9337 23.3%, 0.9764 27.2%, 1.0036 31.6%, 1.0173 36.7%, 1.0201 43.1%, 1.0083 57.6%, 1.0014 71.9%, 1);
|
|
158
|
+
--ease-bounce: linear(0, 0.0083, 0.0333 1.4%, 0.1352 2.9%, 0.5163 7.6%, 0.6949 10.1%, 0.8397 12.6%, 0.9546 15.3%, 1.0397 18.2%, 1.0985 21.3%, 1.1326 24.6%, 1.1437 28.2%, 1.1352 32.3%, 1.0873 40.1%, 1.0132 51%, 0.9897 58.6%, 0.9887 66.7%, 1.0009 86.8%, 1);
|
|
159
|
+
--ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
|
|
160
|
+
--ease-snappy: cubic-bezier(0.2, 0, 0, 1);
|
|
161
|
+
|
|
162
|
+
/* Animation utilities: animate-uv-* */
|
|
163
|
+
--animate-uv-shimmer: uv-shimmer 1.6s ease-in-out infinite;
|
|
164
|
+
--animate-uv-shake: uv-shake 0.42s var(--ease-snappy) both;
|
|
165
|
+
--animate-uv-float: uv-float 3.2s ease-in-out infinite;
|
|
166
|
+
--animate-uv-pop: uv-pop 0.42s var(--ease-bounce) both;
|
|
167
|
+
--animate-uv-fade-up: uv-fade-up 0.5s var(--ease-out-expo) both;
|
|
168
|
+
--animate-uv-ping-soft: uv-ping-soft 1.8s var(--ease-out-expo) infinite;
|
|
169
|
+
--animate-uv-indeterminate: uv-indeterminate 1.4s var(--ease-snappy) infinite;
|
|
170
|
+
--animate-uv-word-in: uv-word-in 0.9s var(--ease-spring) both;
|
|
171
|
+
--animate-uv-grow-x: uv-grow-x 0.9s var(--ease-out-expo) both;
|
|
172
|
+
--animate-uv-ken-burns: uv-ken-burns 9s ease-out both;
|
|
173
|
+
--animate-uv-draw: uv-draw 1s var(--ease-out-expo) both;
|
|
174
|
+
|
|
175
|
+
@keyframes uv-word-in {
|
|
176
|
+
0% { opacity: 0; transform: translateY(0.45em); filter: blur(8px); }
|
|
177
|
+
100% { opacity: 1; transform: translateY(0); filter: blur(0); }
|
|
178
|
+
}
|
|
179
|
+
|
|
180
|
+
@keyframes uv-grow-x {
|
|
181
|
+
0% { transform: scaleX(0); }
|
|
182
|
+
100% { transform: scaleX(1); }
|
|
183
|
+
}
|
|
184
|
+
|
|
185
|
+
/* Draws an SVG stroke that uses pathLength="1" and stroke-dasharray: 1 */
|
|
186
|
+
@keyframes uv-draw {
|
|
187
|
+
0% { stroke-dashoffset: 1; }
|
|
188
|
+
100% { stroke-dashoffset: 0; }
|
|
189
|
+
}
|
|
190
|
+
|
|
191
|
+
@keyframes uv-ken-burns {
|
|
192
|
+
0% { transform: scale(1.12); }
|
|
193
|
+
100% { transform: scale(1); }
|
|
194
|
+
}
|
|
195
|
+
|
|
196
|
+
@keyframes uv-shimmer {
|
|
197
|
+
0% { transform: translateX(-100%); }
|
|
198
|
+
100% { transform: translateX(100%); }
|
|
199
|
+
}
|
|
200
|
+
|
|
201
|
+
@keyframes uv-shake {
|
|
202
|
+
0%, 100% { transform: translateX(0); }
|
|
203
|
+
20% { transform: translateX(-5px); }
|
|
204
|
+
40% { transform: translateX(4px); }
|
|
205
|
+
60% { transform: translateX(-3px); }
|
|
206
|
+
80% { transform: translateX(2px); }
|
|
207
|
+
}
|
|
208
|
+
|
|
209
|
+
@keyframes uv-float {
|
|
210
|
+
0%, 100% { transform: translateY(0); }
|
|
211
|
+
50% { transform: translateY(-6px); }
|
|
212
|
+
}
|
|
213
|
+
|
|
214
|
+
@keyframes uv-pop {
|
|
215
|
+
0% { opacity: 0; transform: scale(0.4); }
|
|
216
|
+
100% { opacity: 1; transform: scale(1); }
|
|
217
|
+
}
|
|
218
|
+
|
|
219
|
+
@keyframes uv-fade-up {
|
|
220
|
+
0% { opacity: 0; transform: translateY(10px); filter: blur(4px); }
|
|
221
|
+
100% { opacity: 1; transform: translateY(0); filter: blur(0); }
|
|
222
|
+
}
|
|
223
|
+
|
|
224
|
+
@keyframes uv-ping-soft {
|
|
225
|
+
0% { transform: scale(1); opacity: 0.7; }
|
|
226
|
+
80%, 100% { transform: scale(2.4); opacity: 0; }
|
|
227
|
+
}
|
|
228
|
+
|
|
229
|
+
@keyframes uv-indeterminate {
|
|
230
|
+
0% { transform: translateX(-100%) scaleX(0.4); }
|
|
231
|
+
50% { transform: translateX(40%) scaleX(0.6); }
|
|
232
|
+
100% { transform: translateX(120%) scaleX(0.4); }
|
|
233
|
+
}
|
|
234
234
|
}
|
|
235
235
|
|
|
236
236
|
/* Floating surfaces (popover, select, dropdown, tooltip, hover card) scale from their anchor */
|
|
237
237
|
@keyframes uv-float-in {
|
|
238
|
-
|
|
239
|
-
|
|
238
|
+
from { opacity: 0; transform: scale(0.94) translateY(var(--uv-float-offset, 0)); filter: blur(3px); }
|
|
239
|
+
to { opacity: 1; transform: none; filter: blur(0); }
|
|
240
240
|
}
|
|
241
241
|
|
|
242
242
|
@keyframes uv-float-out {
|
|
243
|
-
|
|
244
|
-
|
|
243
|
+
from { opacity: 1; transform: none; filter: blur(0); }
|
|
244
|
+
to { opacity: 0; transform: scale(0.96); filter: blur(2px); }
|
|
245
245
|
}
|
|
246
246
|
|
|
247
247
|
/* Modal surfaces (dialog, alert dialog, command dialog) */
|
|
248
248
|
@keyframes uv-modal-in {
|
|
249
|
-
|
|
250
|
-
|
|
249
|
+
from { opacity: 0; transform: translateY(12px) scale(0.94); filter: blur(6px); }
|
|
250
|
+
to { opacity: 1; transform: none; filter: blur(0); }
|
|
251
251
|
}
|
|
252
252
|
|
|
253
253
|
@keyframes uv-modal-out {
|
|
254
|
-
|
|
255
|
-
|
|
254
|
+
from { opacity: 1; transform: none; filter: blur(0); }
|
|
255
|
+
to { opacity: 0; transform: translateY(6px) scale(0.97); filter: blur(4px); }
|
|
256
256
|
}
|
|
257
257
|
|
|
258
258
|
/* Backdrops */
|
|
259
259
|
@keyframes uv-overlay-in {
|
|
260
|
-
|
|
261
|
-
|
|
260
|
+
from { opacity: 0; backdrop-filter: blur(0); }
|
|
261
|
+
to { opacity: 1; }
|
|
262
262
|
}
|
|
263
263
|
|
|
264
264
|
@keyframes uv-overlay-out {
|
|
265
|
-
|
|
266
|
-
|
|
265
|
+
from { opacity: 1; }
|
|
266
|
+
to { opacity: 0; backdrop-filter: blur(0); }
|
|
267
267
|
}
|
|
268
268
|
|
|
269
269
|
/* Sheets */
|
|
@@ -278,159 +278,159 @@ html {
|
|
|
278
278
|
|
|
279
279
|
/* Collapsible regions driven by reka CSS variables */
|
|
280
280
|
@keyframes uv-collapsible-down {
|
|
281
|
-
|
|
282
|
-
|
|
281
|
+
from { height: 0; opacity: 0; }
|
|
282
|
+
to { height: var(--reka-collapsible-content-height); opacity: 1; }
|
|
283
283
|
}
|
|
284
284
|
|
|
285
285
|
@keyframes uv-collapsible-up {
|
|
286
|
-
|
|
287
|
-
|
|
286
|
+
from { height: var(--reka-collapsible-content-height); opacity: 1; }
|
|
287
|
+
to { height: 0; opacity: 0; }
|
|
288
288
|
}
|
|
289
289
|
|
|
290
290
|
@utility uv-floating-motion {
|
|
291
|
-
|
|
292
|
-
|
|
291
|
+
transform-origin: var(--reka-popover-content-transform-origin, var(--reka-select-content-transform-origin, var(--reka-dropdown-menu-content-transform-origin, var(--reka-tooltip-content-transform-origin, var(--reka-hover-card-content-transform-origin, var(--reka-combobox-content-transform-origin, center))))));
|
|
292
|
+
will-change: transform, opacity;
|
|
293
293
|
|
|
294
|
-
|
|
295
|
-
|
|
294
|
+
&[data-side="bottom"] { --uv-float-offset: -6px; }
|
|
295
|
+
&[data-side="top"] { --uv-float-offset: 6px; }
|
|
296
296
|
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
297
|
+
&[data-state="open"],
|
|
298
|
+
&[data-state="delayed-open"],
|
|
299
|
+
&[data-state="instant-open"] {
|
|
300
|
+
animation: uv-float-in var(--uv-duration-base) var(--ease-spring) both;
|
|
301
|
+
}
|
|
302
302
|
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
303
|
+
&[data-state="closed"] {
|
|
304
|
+
animation: uv-float-out var(--uv-duration-fast) var(--ease-snappy) both;
|
|
305
|
+
}
|
|
306
306
|
}
|
|
307
307
|
|
|
308
308
|
@utility uv-modal-motion {
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
309
|
+
&[data-state="open"] {
|
|
310
|
+
animation: uv-modal-in var(--uv-duration-slow) var(--ease-spring) both;
|
|
311
|
+
}
|
|
312
312
|
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
313
|
+
&[data-state="closed"] {
|
|
314
|
+
animation: uv-modal-out var(--uv-duration-fast) var(--ease-snappy) both;
|
|
315
|
+
}
|
|
316
316
|
}
|
|
317
317
|
|
|
318
318
|
@utility uv-overlay-motion {
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
319
|
+
&[data-state="open"] {
|
|
320
|
+
animation: uv-overlay-in var(--uv-duration-base) var(--ease-out-expo) both;
|
|
321
|
+
}
|
|
322
322
|
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
323
|
+
&[data-state="closed"] {
|
|
324
|
+
animation: uv-overlay-out var(--uv-duration-base) var(--ease-snappy) both;
|
|
325
|
+
}
|
|
326
326
|
}
|
|
327
327
|
|
|
328
328
|
@utility uv-collapsible-motion {
|
|
329
|
-
|
|
329
|
+
overflow: hidden;
|
|
330
330
|
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
331
|
+
&[data-state="open"] {
|
|
332
|
+
animation: uv-collapsible-down var(--uv-duration-base) var(--ease-out-expo);
|
|
333
|
+
}
|
|
334
334
|
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
335
|
+
&[data-state="closed"] {
|
|
336
|
+
animation: uv-collapsible-up var(--uv-duration-fast) var(--ease-snappy);
|
|
337
|
+
}
|
|
338
338
|
}
|
|
339
339
|
|
|
340
340
|
/* Shared interactive states for inputs, textareas, and field-like triggers (base colors stay in utility classes) */
|
|
341
341
|
@utility uv-field {
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
342
|
+
transition-property: border-color, box-shadow, background-color, color, opacity;
|
|
343
|
+
transition-duration: var(--uv-duration-fast);
|
|
344
|
+
transition-timing-function: var(--ease-snappy);
|
|
345
345
|
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
346
|
+
&:hover:not(:disabled):not([data-disabled]) {
|
|
347
|
+
border-color: var(--border-strong);
|
|
348
|
+
}
|
|
349
349
|
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
350
|
+
&:focus-visible,
|
|
351
|
+
&:focus-within:not(:has(button:focus-visible)),
|
|
352
|
+
&[data-state="open"] {
|
|
353
|
+
outline: none;
|
|
354
|
+
border-color: color-mix(in oklab, var(--primary) 75%, var(--border));
|
|
355
|
+
box-shadow: 0 0 0 3px color-mix(in oklab, var(--primary) 16%, transparent);
|
|
356
|
+
}
|
|
357
357
|
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
358
|
+
&[aria-invalid="true"] {
|
|
359
|
+
border-color: var(--destructive);
|
|
360
|
+
box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 14%, transparent);
|
|
361
|
+
}
|
|
362
362
|
}
|
|
363
363
|
|
|
364
364
|
.dark {
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
365
|
+
/* Native controls (date/time pickers, scrollbars, form widgets) follow the theme */
|
|
366
|
+
color-scheme: dark;
|
|
367
|
+
|
|
368
|
+
--background: var(--bg-main-dark);
|
|
369
|
+
--foreground: var(--text-primary-dark);
|
|
370
|
+
--card: var(--bg-card-dark);
|
|
371
|
+
--card-foreground: var(--text-primary-dark);
|
|
372
|
+
--popover: var(--bg-card-dark);
|
|
373
|
+
--popover-foreground: var(--text-primary-dark);
|
|
374
|
+
--primary: var(--button-primary-dark);
|
|
375
|
+
--primary-hover: var(--button-primary-hover-dark);
|
|
376
|
+
--primary-foreground: var(--button-primary-foreground-dark);
|
|
377
|
+
--secondary: var(--button-secondary-dark);
|
|
378
|
+
--secondary-foreground: var(--text-primary-dark);
|
|
379
|
+
--surface: var(--bg-surface-dark);
|
|
380
|
+
--muted: var(--bg-selected-dark);
|
|
381
|
+
--muted-foreground: var(--text-secondary-dark);
|
|
382
|
+
--accent: var(--bg-selected-dark);
|
|
383
|
+
--accent-foreground: var(--text-primary-dark);
|
|
384
|
+
--destructive: oklch(0.704 0.191 22.216);
|
|
385
|
+
--success: oklch(0.723 0.19 149.6);
|
|
386
|
+
--warning: oklch(0.795 0.16 70.1);
|
|
387
|
+
--info: oklch(0.707 0.165 254.6);
|
|
388
|
+
--border: var(--border-dark);
|
|
389
|
+
--border-strong: var(--border-hover-dark);
|
|
390
|
+
--input: var(--border-dark);
|
|
391
|
+
--ring: var(--button-primary-dark);
|
|
392
|
+
--chart-1: oklch(0.488 0.243 264.376);
|
|
393
|
+
--chart-2: oklch(0.696 0.17 162.48);
|
|
394
|
+
--chart-3: oklch(0.769 0.188 70.08);
|
|
395
|
+
--chart-4: oklch(0.627 0.265 303.9);
|
|
396
|
+
--chart-5: oklch(0.645 0.246 16.439);
|
|
397
|
+
--sidebar: var(--bg-card-dark);
|
|
398
|
+
--sidebar-foreground: var(--text-primary-dark);
|
|
399
|
+
--sidebar-primary: var(--button-primary-dark);
|
|
400
|
+
--sidebar-primary-foreground: var(--button-primary-foreground-dark);
|
|
401
|
+
--sidebar-accent: var(--bg-selected-dark);
|
|
402
|
+
--sidebar-accent-foreground: var(--text-primary-dark);
|
|
403
|
+
--sidebar-border: var(--border-dark);
|
|
404
|
+
--sidebar-ring: var(--button-primary-dark);
|
|
405
|
+
|
|
406
|
+
--uv-shadow-sm: 0 1px 2px rgb(0 0 0 / 0.3);
|
|
407
|
+
--uv-shadow-md: 0 1px 2px rgb(0 0 0 / 0.3), 0 4px 12px -4px rgb(0 0 0 / 0.4);
|
|
408
|
+
--uv-shadow-lg: 0 2px 4px rgb(0 0 0 / 0.3), 0 12px 32px -8px rgb(0 0 0 / 0.55);
|
|
409
|
+
--uv-shadow-xl: 0 4px 8px rgb(0 0 0 / 0.3), 0 24px 64px -12px rgb(0 0 0 / 0.7);
|
|
410
410
|
}
|
|
411
411
|
|
|
412
412
|
@layer base {
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
413
|
+
* {
|
|
414
|
+
@apply border-border outline-ring/50;
|
|
415
|
+
}
|
|
416
416
|
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
417
|
+
body {
|
|
418
|
+
@apply bg-background text-foreground;
|
|
419
|
+
}
|
|
420
420
|
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
421
|
+
::selection {
|
|
422
|
+
background-color: color-mix(in oklab, var(--primary) 30%, transparent);
|
|
423
|
+
}
|
|
424
424
|
}
|
|
425
425
|
|
|
426
426
|
body {
|
|
427
|
-
|
|
428
|
-
|
|
427
|
+
background: var(--bg-main-light);
|
|
428
|
+
color: var(--text-primary-light);
|
|
429
429
|
}
|
|
430
430
|
|
|
431
431
|
.dark body {
|
|
432
|
-
|
|
433
|
-
|
|
432
|
+
background: var(--bg-main-dark);
|
|
433
|
+
color: var(--text-primary-dark);
|
|
434
434
|
}
|
|
435
435
|
|
|
436
436
|
/*********************** AOS scroll animations ***********************/
|
|
@@ -441,104 +441,104 @@ body {
|
|
|
441
441
|
* The repeated attribute selector outranks the global AOS easing and duration rules; data-aos-delay keeps working.
|
|
442
442
|
*/
|
|
443
443
|
[data-aos="blur-up"][data-aos="blur-up"][data-aos="blur-up"].aos-init {
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
444
|
+
opacity: 0;
|
|
445
|
+
transform: translate3d(0, 18px, 0);
|
|
446
|
+
filter: blur(6px);
|
|
447
|
+
transition-property: opacity, transform, filter;
|
|
448
|
+
transition-duration: 700ms, 900ms, 700ms;
|
|
449
|
+
transition-timing-function: var(--ease-out-expo), var(--ease-spring), var(--ease-out-expo);
|
|
450
450
|
}
|
|
451
451
|
|
|
452
452
|
[data-aos="blur-up"][data-aos="blur-up"][data-aos="blur-up"].aos-init.aos-animate {
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
453
|
+
opacity: 1;
|
|
454
|
+
transform: none;
|
|
455
|
+
filter: none;
|
|
456
456
|
}
|
|
457
457
|
|
|
458
458
|
/*********************** Page transition animations ***********************/
|
|
459
459
|
|
|
460
460
|
.page-enter-active {
|
|
461
|
-
|
|
461
|
+
transition: opacity 0.32s var(--ease-out-expo), transform 0.42s var(--ease-spring), filter 0.32s var(--ease-out-expo);
|
|
462
462
|
}
|
|
463
463
|
|
|
464
464
|
.page-leave-active {
|
|
465
|
-
|
|
465
|
+
transition: opacity 0.12s var(--ease-snappy), transform 0.12s var(--ease-snappy), filter 0.12s var(--ease-snappy);
|
|
466
466
|
}
|
|
467
467
|
|
|
468
468
|
.page-enter-from {
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
469
|
+
opacity: 0;
|
|
470
|
+
transform: translateY(10px);
|
|
471
|
+
filter: blur(4px);
|
|
472
472
|
}
|
|
473
473
|
|
|
474
474
|
.page-leave-to {
|
|
475
|
-
|
|
476
|
-
|
|
475
|
+
opacity: 0;
|
|
476
|
+
transform: translateY(-4px);
|
|
477
477
|
}
|
|
478
478
|
|
|
479
479
|
/*********************** Theme switch (View Transitions API) ***********************/
|
|
480
480
|
|
|
481
481
|
::view-transition-old(root),
|
|
482
482
|
::view-transition-new(root) {
|
|
483
|
-
|
|
484
|
-
|
|
483
|
+
animation: none;
|
|
484
|
+
mix-blend-mode: normal;
|
|
485
485
|
}
|
|
486
486
|
|
|
487
487
|
.uv-theme-switching,
|
|
488
488
|
.uv-theme-switching *,
|
|
489
489
|
.uv-theme-switching *::before,
|
|
490
490
|
.uv-theme-switching *::after {
|
|
491
|
-
|
|
491
|
+
transition: none !important;
|
|
492
492
|
}
|
|
493
493
|
|
|
494
494
|
/*********************** Reduced motion ***********************/
|
|
495
495
|
|
|
496
496
|
@media (prefers-reduced-motion: reduce) {
|
|
497
|
-
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
|
|
504
|
-
|
|
497
|
+
*,
|
|
498
|
+
*::before,
|
|
499
|
+
*::after {
|
|
500
|
+
animation-duration: 0.01ms !important;
|
|
501
|
+
animation-iteration-count: 1 !important;
|
|
502
|
+
transition-duration: 0.01ms !important;
|
|
503
|
+
scroll-behavior: auto !important;
|
|
504
|
+
}
|
|
505
505
|
}
|
|
506
506
|
|
|
507
507
|
/*********************** Custom scrollbar ***********************/
|
|
508
508
|
|
|
509
509
|
/* Webkit browsers */
|
|
510
510
|
::-webkit-scrollbar {
|
|
511
|
-
|
|
512
|
-
|
|
511
|
+
width: 6px;
|
|
512
|
+
height: 6px;
|
|
513
513
|
}
|
|
514
514
|
|
|
515
515
|
::-webkit-scrollbar-track {
|
|
516
|
-
|
|
516
|
+
background: transparent;
|
|
517
517
|
}
|
|
518
518
|
|
|
519
519
|
::-webkit-scrollbar-thumb {
|
|
520
|
-
|
|
521
|
-
|
|
520
|
+
background-color: var(--border-light);
|
|
521
|
+
border-radius: 999px;
|
|
522
522
|
}
|
|
523
523
|
|
|
524
524
|
::-webkit-scrollbar-thumb:hover {
|
|
525
|
-
|
|
525
|
+
background-color: var(--text-secondary-light);
|
|
526
526
|
}
|
|
527
527
|
|
|
528
528
|
.dark ::-webkit-scrollbar-thumb {
|
|
529
|
-
|
|
529
|
+
background-color: var(--border-dark);
|
|
530
530
|
}
|
|
531
531
|
|
|
532
532
|
.dark ::-webkit-scrollbar-thumb:hover {
|
|
533
|
-
|
|
533
|
+
background-color: var(--text-secondary-dark);
|
|
534
534
|
}
|
|
535
535
|
|
|
536
536
|
/* Firefox */
|
|
537
537
|
* {
|
|
538
|
-
|
|
539
|
-
|
|
538
|
+
scrollbar-width: thin;
|
|
539
|
+
scrollbar-color: var(--border-light) transparent;
|
|
540
540
|
}
|
|
541
541
|
|
|
542
542
|
.dark * {
|
|
543
|
-
|
|
543
|
+
scrollbar-color: var(--border-dark) transparent;
|
|
544
544
|
}
|