From 06850f3ed5379e9ffa483161ecfefd9a3f3bc142 Mon Sep 17 00:00:00 2001 From: Mert Sincan Date: Sun, 5 May 2024 21:35:38 +0100 Subject: [PATCH] Add 'Lara' theme --- components/lib/themes/lara/accordion/index.js | 15 + .../lib/themes/lara/accordion/package.json | 6 + .../lib/themes/lara/autocomplete/index.js | 46 ++ .../lib/themes/lara/autocomplete/package.json | 6 + components/lib/themes/lara/avatar/index.js | 8 + .../lib/themes/lara/avatar/package.json | 6 + components/lib/themes/lara/badge/index.js | 64 +++ components/lib/themes/lara/badge/package.json | 6 + components/lib/themes/lara/blockui/index.js | 1 + .../lib/themes/lara/blockui/package.json | 6 + .../lib/themes/lara/breadcrumb/index.js | 13 + .../lib/themes/lara/breadcrumb/package.json | 6 + components/lib/themes/lara/button/index.js | 394 ++++++++++++++++ .../lib/themes/lara/button/package.json | 6 + .../lib/themes/lara/buttongroup/index.js | 1 + .../lib/themes/lara/buttongroup/package.json | 6 + components/lib/themes/lara/card/index.js | 9 + components/lib/themes/lara/card/package.json | 6 + components/lib/themes/lara/carousel/index.js | 18 + .../lib/themes/lara/carousel/package.json | 6 + .../lib/themes/lara/cascadeselect/index.js | 37 ++ .../themes/lara/cascadeselect/package.json | 6 + components/lib/themes/lara/checkbox/index.js | 25 + .../lib/themes/lara/checkbox/package.json | 6 + components/lib/themes/lara/chip/index.js | 16 + components/lib/themes/lara/chip/package.json | 6 + .../lib/themes/lara/colorpicker/index.js | 22 + .../lib/themes/lara/colorpicker/package.json | 6 + .../lib/themes/lara/confirmdialog/index.js | 1 + .../themes/lara/confirmdialog/package.json | 6 + .../lib/themes/lara/confirmpopup/index.js | 7 + .../lib/themes/lara/confirmpopup/package.json | 6 + .../lib/themes/lara/contextmenu/index.js | 22 + .../lib/themes/lara/contextmenu/package.json | 6 + components/lib/themes/lara/datatable/index.js | 89 ++++ .../lib/themes/lara/datatable/package.json | 6 + components/lib/themes/lara/dataview/index.js | 16 + .../lib/themes/lara/dataview/package.json | 6 + .../lib/themes/lara/datepicker/index.js | 64 +++ .../lib/themes/lara/datepicker/package.json | 6 + components/lib/themes/lara/dialog/index.js | 7 + .../lib/themes/lara/dialog/package.json | 6 + components/lib/themes/lara/divider/index.js | 9 + .../lib/themes/lara/divider/package.json | 6 + components/lib/themes/lara/dock/index.js | 1 + components/lib/themes/lara/dock/package.json | 6 + components/lib/themes/lara/drawer/index.js | 7 + .../lib/themes/lara/drawer/package.json | 6 + components/lib/themes/lara/editor/index.js | 26 + .../lib/themes/lara/editor/package.json | 6 + components/lib/themes/lara/fieldset/index.js | 17 + .../lib/themes/lara/fieldset/package.json | 6 + .../lib/themes/lara/fileupload/index.js | 14 + .../lib/themes/lara/fileupload/package.json | 6 + .../lib/themes/lara/floatlabel/index.js | 7 + .../lib/themes/lara/floatlabel/package.json | 6 + components/lib/themes/lara/galleria/index.js | 82 ++++ .../lib/themes/lara/galleria/package.json | 6 + components/lib/themes/lara/iconfield/index.js | 5 + .../lib/themes/lara/iconfield/package.json | 6 + components/lib/themes/lara/image/index.js | 14 + components/lib/themes/lara/image/package.json | 6 + components/lib/themes/lara/index.js | 443 ++++++++++++++++++ .../lib/themes/lara/inlinemessage/index.js | 80 ++++ .../themes/lara/inlinemessage/package.json | 6 + components/lib/themes/lara/inplace/index.js | 16 + .../lib/themes/lara/inplace/package.json | 6 + .../lib/themes/lara/inputchips/index.js | 16 + .../lib/themes/lara/inputchips/package.json | 6 + .../lib/themes/lara/inputgroup/index.js | 7 + .../lib/themes/lara/inputgroup/package.json | 6 + .../lib/themes/lara/inputnumber/index.js | 33 ++ .../lib/themes/lara/inputnumber/package.json | 6 + components/lib/themes/lara/inputotp/index.js | 1 + .../lib/themes/lara/inputotp/package.json | 6 + components/lib/themes/lara/inputtext/index.js | 16 + .../lib/themes/lara/inputtext/package.json | 6 + components/lib/themes/lara/knob/index.js | 11 + components/lib/themes/lara/knob/package.json | 6 + components/lib/themes/lara/listbox/index.js | 29 ++ .../lib/themes/lara/listbox/package.json | 6 + components/lib/themes/lara/megamenu/index.js | 27 ++ .../lib/themes/lara/megamenu/package.json | 6 + components/lib/themes/lara/menu/index.js | 22 + components/lib/themes/lara/menu/package.json | 6 + components/lib/themes/lara/menubar/index.js | 27 ++ .../lib/themes/lara/menubar/package.json | 6 + components/lib/themes/lara/message/index.js | 116 +++++ .../lib/themes/lara/message/package.json | 6 + .../lib/themes/lara/metergroup/index.js | 5 + .../lib/themes/lara/metergroup/package.json | 6 + .../lib/themes/lara/multiselect/index.js | 40 ++ .../lib/themes/lara/multiselect/package.json | 6 + components/lib/themes/lara/orderlist/index.js | 1 + .../lib/themes/lara/orderlist/package.json | 6 + .../themes/lara/organizationchart/index.js | 17 + .../lara/organizationchart/package.json | 6 + components/lib/themes/lara/package.json | 6 + components/lib/themes/lara/paginator/index.js | 14 + .../lib/themes/lara/paginator/package.json | 6 + components/lib/themes/lara/panel/index.js | 7 + components/lib/themes/lara/panel/package.json | 6 + components/lib/themes/lara/panelmenu/index.js | 16 + .../lib/themes/lara/panelmenu/package.json | 6 + components/lib/themes/lara/password/index.js | 29 ++ .../lib/themes/lara/password/package.json | 6 + components/lib/themes/lara/picklist/index.js | 1 + .../lib/themes/lara/picklist/package.json | 6 + components/lib/themes/lara/popover/index.js | 7 + .../lib/themes/lara/popover/package.json | 6 + .../lib/themes/lara/progressbar/index.js | 11 + .../lib/themes/lara/progressbar/package.json | 6 + .../lib/themes/lara/progressspinner/index.js | 20 + .../themes/lara/progressspinner/package.json | 6 + .../lib/themes/lara/radiobutton/index.js | 23 + .../lib/themes/lara/radiobutton/package.json | 6 + components/lib/themes/lara/rating/index.js | 7 + .../lib/themes/lara/rating/package.json | 6 + .../lib/themes/lara/scrollpanel/index.js | 14 + .../lib/themes/lara/scrollpanel/package.json | 6 + components/lib/themes/lara/scrolltop/index.js | 1 + .../lib/themes/lara/scrolltop/package.json | 6 + components/lib/themes/lara/select/index.js | 43 ++ .../lib/themes/lara/select/package.json | 6 + .../lib/themes/lara/selectbutton/index.js | 14 + .../lib/themes/lara/selectbutton/package.json | 6 + components/lib/themes/lara/skeleton/index.js | 16 + .../lib/themes/lara/skeleton/package.json | 6 + components/lib/themes/lara/slider/index.js | 24 + .../lib/themes/lara/slider/package.json | 6 + components/lib/themes/lara/speeddial/index.js | 1 + .../lib/themes/lara/speeddial/package.json | 6 + .../lib/themes/lara/splitbutton/index.js | 1 + .../lib/themes/lara/splitbutton/package.json | 6 + components/lib/themes/lara/splitter/index.js | 10 + .../lib/themes/lara/splitter/package.json | 6 + components/lib/themes/lara/stepper/index.js | 21 + .../lib/themes/lara/stepper/package.json | 6 + components/lib/themes/lara/steps/index.js | 16 + components/lib/themes/lara/steps/package.json | 6 + components/lib/themes/lara/tabmenu/index.js | 12 + .../lib/themes/lara/tabmenu/package.json | 6 + components/lib/themes/lara/tabs/index.js | 34 ++ components/lib/themes/lara/tabs/package.json | 6 + components/lib/themes/lara/tabview/index.js | 34 ++ .../lib/themes/lara/tabview/package.json | 6 + components/lib/themes/lara/tag/index.js | 64 +++ components/lib/themes/lara/tag/package.json | 6 + components/lib/themes/lara/terminal/index.js | 7 + .../lib/themes/lara/terminal/package.json | 6 + components/lib/themes/lara/textarea/index.js | 16 + .../lib/themes/lara/textarea/package.json | 6 + .../lib/themes/lara/tieredmenu/index.js | 22 + .../lib/themes/lara/tieredmenu/package.json | 6 + components/lib/themes/lara/timeline/index.js | 10 + .../lib/themes/lara/timeline/package.json | 6 + components/lib/themes/lara/toast/index.js | 130 +++++ components/lib/themes/lara/toast/package.json | 6 + .../lib/themes/lara/togglebutton/index.js | 44 ++ .../lib/themes/lara/togglebutton/package.json | 6 + .../lib/themes/lara/toggleswitch/index.js | 42 ++ .../lib/themes/lara/toggleswitch/package.json | 6 + components/lib/themes/lara/toolbar/index.js | 7 + .../lib/themes/lara/toolbar/package.json | 6 + components/lib/themes/lara/tooltip/index.js | 16 + .../lib/themes/lara/tooltip/package.json | 6 + components/lib/themes/lara/tree/index.js | 24 + components/lib/themes/lara/tree/package.json | 6 + .../lib/themes/lara/treeselect/index.js | 24 + .../lib/themes/lara/treeselect/package.json | 6 + components/lib/themes/lara/treetable/index.js | 68 +++ .../lib/themes/lara/treetable/package.json | 6 + layouts/AppConfigurator.vue | 43 +- nuxt-vite.config.js | 2 +- nuxt.config.js | 4 +- plugins/app-state.js | 12 +- rollup.config.js | 2 +- 177 files changed, 3386 insertions(+), 7 deletions(-) create mode 100644 components/lib/themes/lara/accordion/index.js create mode 100644 components/lib/themes/lara/accordion/package.json create mode 100644 components/lib/themes/lara/autocomplete/index.js create mode 100644 components/lib/themes/lara/autocomplete/package.json create mode 100644 components/lib/themes/lara/avatar/index.js create mode 100644 components/lib/themes/lara/avatar/package.json create mode 100644 components/lib/themes/lara/badge/index.js create mode 100644 components/lib/themes/lara/badge/package.json create mode 100644 components/lib/themes/lara/blockui/index.js create mode 100644 components/lib/themes/lara/blockui/package.json create mode 100644 components/lib/themes/lara/breadcrumb/index.js create mode 100644 components/lib/themes/lara/breadcrumb/package.json create mode 100644 components/lib/themes/lara/button/index.js create mode 100644 components/lib/themes/lara/button/package.json create mode 100644 components/lib/themes/lara/buttongroup/index.js create mode 100644 components/lib/themes/lara/buttongroup/package.json create mode 100644 components/lib/themes/lara/card/index.js create mode 100644 components/lib/themes/lara/card/package.json create mode 100644 components/lib/themes/lara/carousel/index.js create mode 100644 components/lib/themes/lara/carousel/package.json create mode 100644 components/lib/themes/lara/cascadeselect/index.js create mode 100644 components/lib/themes/lara/cascadeselect/package.json create mode 100644 components/lib/themes/lara/checkbox/index.js create mode 100644 components/lib/themes/lara/checkbox/package.json create mode 100644 components/lib/themes/lara/chip/index.js create mode 100644 components/lib/themes/lara/chip/package.json create mode 100644 components/lib/themes/lara/colorpicker/index.js create mode 100644 components/lib/themes/lara/colorpicker/package.json create mode 100644 components/lib/themes/lara/confirmdialog/index.js create mode 100644 components/lib/themes/lara/confirmdialog/package.json create mode 100644 components/lib/themes/lara/confirmpopup/index.js create mode 100644 components/lib/themes/lara/confirmpopup/package.json create mode 100644 components/lib/themes/lara/contextmenu/index.js create mode 100644 components/lib/themes/lara/contextmenu/package.json create mode 100644 components/lib/themes/lara/datatable/index.js create mode 100644 components/lib/themes/lara/datatable/package.json create mode 100644 components/lib/themes/lara/dataview/index.js create mode 100644 components/lib/themes/lara/dataview/package.json create mode 100644 components/lib/themes/lara/datepicker/index.js create mode 100644 components/lib/themes/lara/datepicker/package.json create mode 100644 components/lib/themes/lara/dialog/index.js create mode 100644 components/lib/themes/lara/dialog/package.json create mode 100644 components/lib/themes/lara/divider/index.js create mode 100644 components/lib/themes/lara/divider/package.json create mode 100644 components/lib/themes/lara/dock/index.js create mode 100644 components/lib/themes/lara/dock/package.json create mode 100644 components/lib/themes/lara/drawer/index.js create mode 100644 components/lib/themes/lara/drawer/package.json create mode 100644 components/lib/themes/lara/editor/index.js create mode 100644 components/lib/themes/lara/editor/package.json create mode 100644 components/lib/themes/lara/fieldset/index.js create mode 100644 components/lib/themes/lara/fieldset/package.json create mode 100644 components/lib/themes/lara/fileupload/index.js create mode 100644 components/lib/themes/lara/fileupload/package.json create mode 100644 components/lib/themes/lara/floatlabel/index.js create mode 100644 components/lib/themes/lara/floatlabel/package.json create mode 100644 components/lib/themes/lara/galleria/index.js create mode 100644 components/lib/themes/lara/galleria/package.json create mode 100644 components/lib/themes/lara/iconfield/index.js create mode 100644 components/lib/themes/lara/iconfield/package.json create mode 100644 components/lib/themes/lara/image/index.js create mode 100644 components/lib/themes/lara/image/package.json create mode 100644 components/lib/themes/lara/index.js create mode 100644 components/lib/themes/lara/inlinemessage/index.js create mode 100644 components/lib/themes/lara/inlinemessage/package.json create mode 100644 components/lib/themes/lara/inplace/index.js create mode 100644 components/lib/themes/lara/inplace/package.json create mode 100644 components/lib/themes/lara/inputchips/index.js create mode 100644 components/lib/themes/lara/inputchips/package.json create mode 100644 components/lib/themes/lara/inputgroup/index.js create mode 100644 components/lib/themes/lara/inputgroup/package.json create mode 100644 components/lib/themes/lara/inputnumber/index.js create mode 100644 components/lib/themes/lara/inputnumber/package.json create mode 100644 components/lib/themes/lara/inputotp/index.js create mode 100644 components/lib/themes/lara/inputotp/package.json create mode 100644 components/lib/themes/lara/inputtext/index.js create mode 100644 components/lib/themes/lara/inputtext/package.json create mode 100644 components/lib/themes/lara/knob/index.js create mode 100644 components/lib/themes/lara/knob/package.json create mode 100644 components/lib/themes/lara/listbox/index.js create mode 100644 components/lib/themes/lara/listbox/package.json create mode 100644 components/lib/themes/lara/megamenu/index.js create mode 100644 components/lib/themes/lara/megamenu/package.json create mode 100644 components/lib/themes/lara/menu/index.js create mode 100644 components/lib/themes/lara/menu/package.json create mode 100644 components/lib/themes/lara/menubar/index.js create mode 100644 components/lib/themes/lara/menubar/package.json create mode 100644 components/lib/themes/lara/message/index.js create mode 100644 components/lib/themes/lara/message/package.json create mode 100644 components/lib/themes/lara/metergroup/index.js create mode 100644 components/lib/themes/lara/metergroup/package.json create mode 100644 components/lib/themes/lara/multiselect/index.js create mode 100644 components/lib/themes/lara/multiselect/package.json create mode 100644 components/lib/themes/lara/orderlist/index.js create mode 100644 components/lib/themes/lara/orderlist/package.json create mode 100644 components/lib/themes/lara/organizationchart/index.js create mode 100644 components/lib/themes/lara/organizationchart/package.json create mode 100644 components/lib/themes/lara/package.json create mode 100644 components/lib/themes/lara/paginator/index.js create mode 100644 components/lib/themes/lara/paginator/package.json create mode 100644 components/lib/themes/lara/panel/index.js create mode 100644 components/lib/themes/lara/panel/package.json create mode 100644 components/lib/themes/lara/panelmenu/index.js create mode 100644 components/lib/themes/lara/panelmenu/package.json create mode 100644 components/lib/themes/lara/password/index.js create mode 100644 components/lib/themes/lara/password/package.json create mode 100644 components/lib/themes/lara/picklist/index.js create mode 100644 components/lib/themes/lara/picklist/package.json create mode 100644 components/lib/themes/lara/popover/index.js create mode 100644 components/lib/themes/lara/popover/package.json create mode 100644 components/lib/themes/lara/progressbar/index.js create mode 100644 components/lib/themes/lara/progressbar/package.json create mode 100644 components/lib/themes/lara/progressspinner/index.js create mode 100644 components/lib/themes/lara/progressspinner/package.json create mode 100644 components/lib/themes/lara/radiobutton/index.js create mode 100644 components/lib/themes/lara/radiobutton/package.json create mode 100644 components/lib/themes/lara/rating/index.js create mode 100644 components/lib/themes/lara/rating/package.json create mode 100644 components/lib/themes/lara/scrollpanel/index.js create mode 100644 components/lib/themes/lara/scrollpanel/package.json create mode 100644 components/lib/themes/lara/scrolltop/index.js create mode 100644 components/lib/themes/lara/scrolltop/package.json create mode 100644 components/lib/themes/lara/select/index.js create mode 100644 components/lib/themes/lara/select/package.json create mode 100644 components/lib/themes/lara/selectbutton/index.js create mode 100644 components/lib/themes/lara/selectbutton/package.json create mode 100644 components/lib/themes/lara/skeleton/index.js create mode 100644 components/lib/themes/lara/skeleton/package.json create mode 100644 components/lib/themes/lara/slider/index.js create mode 100644 components/lib/themes/lara/slider/package.json create mode 100644 components/lib/themes/lara/speeddial/index.js create mode 100644 components/lib/themes/lara/speeddial/package.json create mode 100644 components/lib/themes/lara/splitbutton/index.js create mode 100644 components/lib/themes/lara/splitbutton/package.json create mode 100644 components/lib/themes/lara/splitter/index.js create mode 100644 components/lib/themes/lara/splitter/package.json create mode 100644 components/lib/themes/lara/stepper/index.js create mode 100644 components/lib/themes/lara/stepper/package.json create mode 100644 components/lib/themes/lara/steps/index.js create mode 100644 components/lib/themes/lara/steps/package.json create mode 100644 components/lib/themes/lara/tabmenu/index.js create mode 100644 components/lib/themes/lara/tabmenu/package.json create mode 100644 components/lib/themes/lara/tabs/index.js create mode 100644 components/lib/themes/lara/tabs/package.json create mode 100644 components/lib/themes/lara/tabview/index.js create mode 100644 components/lib/themes/lara/tabview/package.json create mode 100644 components/lib/themes/lara/tag/index.js create mode 100644 components/lib/themes/lara/tag/package.json create mode 100644 components/lib/themes/lara/terminal/index.js create mode 100644 components/lib/themes/lara/terminal/package.json create mode 100644 components/lib/themes/lara/textarea/index.js create mode 100644 components/lib/themes/lara/textarea/package.json create mode 100644 components/lib/themes/lara/tieredmenu/index.js create mode 100644 components/lib/themes/lara/tieredmenu/package.json create mode 100644 components/lib/themes/lara/timeline/index.js create mode 100644 components/lib/themes/lara/timeline/package.json create mode 100644 components/lib/themes/lara/toast/index.js create mode 100644 components/lib/themes/lara/toast/package.json create mode 100644 components/lib/themes/lara/togglebutton/index.js create mode 100644 components/lib/themes/lara/togglebutton/package.json create mode 100644 components/lib/themes/lara/toggleswitch/index.js create mode 100644 components/lib/themes/lara/toggleswitch/package.json create mode 100644 components/lib/themes/lara/toolbar/index.js create mode 100644 components/lib/themes/lara/toolbar/package.json create mode 100644 components/lib/themes/lara/tooltip/index.js create mode 100644 components/lib/themes/lara/tooltip/package.json create mode 100644 components/lib/themes/lara/tree/index.js create mode 100644 components/lib/themes/lara/tree/package.json create mode 100644 components/lib/themes/lara/treeselect/index.js create mode 100644 components/lib/themes/lara/treeselect/package.json create mode 100644 components/lib/themes/lara/treetable/index.js create mode 100644 components/lib/themes/lara/treetable/package.json diff --git a/components/lib/themes/lara/accordion/index.js b/components/lib/themes/lara/accordion/index.js new file mode 100644 index 000000000..739289846 --- /dev/null +++ b/components/lib/themes/lara/accordion/index.js @@ -0,0 +1,15 @@ +export default { + panel: { + borderColor: '{content.border.color}' + }, + header: { + background: '{content.background}', + color: '{text.muted.color}', + hoverColor: '{text.color}', + activeColor: '{text.color}' + }, + content: { + background: '{content.background}', + color: '{text.color}' + } +}; diff --git a/components/lib/themes/lara/accordion/package.json b/components/lib/themes/lara/accordion/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/accordion/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/autocomplete/index.js b/components/lib/themes/lara/autocomplete/index.js new file mode 100644 index 000000000..720613cdf --- /dev/null +++ b/components/lib/themes/lara/autocomplete/index.js @@ -0,0 +1,46 @@ +export default { + inputMultiple: { + background: '{form.field.background}', + disabledBackground: '{form.field.disabled.background}', + filledBackground: '{form.field.filled.background}', + filledFocusBackground: '{form.field.filled.focus.background}', + borderColor: '{form.field.border.color}', + hoverBorderColor: '{form.field.hover.border.color}', + focusBorderColor: '{form.field.focus.border.color}', + invalidBorderColor: '{form.field.invalid.border.color}', + color: '{form.field.color}', + disabledColor: '{form.field.disabled.color}', + placeholderColor: '{form.field.placeholder.color}', + boxShadow: '{form.field.box.shadow}' + }, + overlay: { + background: '{overlay.select.background}', + borderColor: '{overlay.select.border.color}', + color: '{overlay.select.color}' + }, + option: { + focusBackground: '{list.option.focus.background}', + selectedBackground: '{list.option.selected.background}', + selectedFocusBackground: '{list.option.selected.focus.background}', + color: '{list.option.color}', + focusColor: '{list.option.focus.color}', + selectedColor: '{list.option.selected.color}', + selectedFocusColor: '{list.option.selected.focus.color}' + }, + optionGroup: { + background: '{list.option.group.background}', + color: '{list.option.group.color}' + }, + dropdown: { + width: '2.5rem', + borderColor: '{form.field.border.color}', + hoverBorderColor: '{form.field.border.color}', + activeBorderColor: '{form.field.border.color}', + background: '{button.secondary.background}', + hoverBackground: '{button.secondary.hover.background}', + activeBackground: '{button.secondary.active.background}', + color: '{button.secondary.color}', + hoverColor: '{button.secondary.hover.color}', + activeColor: '{button.secondary.active.color}' + } +}; diff --git a/components/lib/themes/lara/autocomplete/package.json b/components/lib/themes/lara/autocomplete/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/autocomplete/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/avatar/index.js b/components/lib/themes/lara/avatar/index.js new file mode 100644 index 000000000..ed27100d4 --- /dev/null +++ b/components/lib/themes/lara/avatar/index.js @@ -0,0 +1,8 @@ +export default { + root: { + background: '{content.border.color}' + }, + group: { + borderColor: '{content.background}' + } +}; diff --git a/components/lib/themes/lara/avatar/package.json b/components/lib/themes/lara/avatar/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/avatar/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/badge/index.js b/components/lib/themes/lara/badge/index.js new file mode 100644 index 000000000..9f1388991 --- /dev/null +++ b/components/lib/themes/lara/badge/index.js @@ -0,0 +1,64 @@ +export default { + colorScheme: { + light: { + primary: { + background: '{primary.color}', + color: '{primary.contrast.color}' + }, + secondary: { + background: '{surface.100}', + color: '{surface.600}' + }, + success: { + background: '{green.500}', + color: '{surface.0}' + }, + info: { + background: '{sky.500}', + color: '{surface.0}' + }, + warn: { + background: '{orange.500}', + color: '{surface.0}' + }, + danger: { + background: '{red.500}', + color: '{surface.0}' + }, + contrast: { + background: '{surface.950}', + color: '{surface.0}' + } + }, + dark: { + primary: { + background: '{primary.color}', + color: '{primary.contrast.color}' + }, + secondary: { + background: '{surface.800}', + color: '{surface.300}' + }, + success: { + background: '{green.400}', + color: '{green.950}' + }, + info: { + background: '{sky.400}', + color: '{sky.950}' + }, + warn: { + background: '{orange.400}', + color: '{orange.950}' + }, + danger: { + background: '{red.400}', + color: '{red.950}' + }, + contrast: { + background: '{surface.0}', + color: '{surface.950}' + } + } + } +}; diff --git a/components/lib/themes/lara/badge/package.json b/components/lib/themes/lara/badge/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/badge/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/blockui/index.js b/components/lib/themes/lara/blockui/index.js new file mode 100644 index 000000000..ff8b4c563 --- /dev/null +++ b/components/lib/themes/lara/blockui/index.js @@ -0,0 +1 @@ +export default {}; diff --git a/components/lib/themes/lara/blockui/package.json b/components/lib/themes/lara/blockui/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/blockui/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/breadcrumb/index.js b/components/lib/themes/lara/breadcrumb/index.js new file mode 100644 index 000000000..10ebb783b --- /dev/null +++ b/components/lib/themes/lara/breadcrumb/index.js @@ -0,0 +1,13 @@ +export default { + root: { + background: '{content.background}' + }, + item: { + color: '{text.muted.color}', + hoverColor: '{text.color}', + iconColor: '{navigation.item.icon.color}' + }, + separator: { + color: '{navigation.item.icon.color}' + } +}; diff --git a/components/lib/themes/lara/breadcrumb/package.json b/components/lib/themes/lara/breadcrumb/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/breadcrumb/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/button/index.js b/components/lib/themes/lara/button/index.js new file mode 100644 index 000000000..cf6d134dd --- /dev/null +++ b/components/lib/themes/lara/button/index.js @@ -0,0 +1,394 @@ +export default { + colorScheme: { + light: { + root: { + primary: { + background: '{primary.color}', + hoverBackground: '{primary.hover.color}', + activeBackground: '{primary.active.color}', + borderColor: '{primary.color}', + hoverBorderColor: '{primary.hover.color}', + activeBorderColor: '{primary.active.color}', + color: '{primary.inverseColor}', + hoverColor: '{primary.inverseColor}', + activeColor: '{primary.inverseColor}' + }, + secondary: { + background: '{surface.100}', + hoverBackground: '{surface.200}', + activeBackground: '{surface.300}', + borderColor: '{surface.100}', + hoverBorderColor: '{surface.200}', + activeBorderColor: '{surface.300}', + color: '{surface.600}', + hoverColor: '{surface.700}', + activeColor: '{surface.800}' + }, + info: { + background: '{sky.500}', + hoverBackground: '{sky.600}', + activeBackground: '{sky.700}', + borderColor: '{sky.500}', + hoverBorderColor: '{sky.600}', + activeBorderColor: '{sky.700}', + color: '#ffffff', + hoverColor: '#ffffff', + activeColor: '#ffffff' + }, + success: { + background: '{green.500}', + hoverBackground: '{green.600}', + activeBackground: '{green.700}', + borderColor: '{green.500}', + hoverBorderColor: '{green.600}', + activeBorderColor: '{green.700}', + color: '#ffffff', + hoverColor: '#ffffff', + activeColor: '#ffffff' + }, + warn: { + background: '{orange.500}', + hoverBackground: '{orange.600}', + activeBackground: '{orange.700}', + borderColor: '{orange.500}', + hoverBorderColor: '{orange.600}', + activeBorderColor: '{orange.700}', + color: '#ffffff', + hoverColor: '#ffffff', + activeColor: '#ffffff' + }, + help: { + background: '{purple.500}', + hoverBackground: '{purple.600}', + activeBackground: '{purple.700}', + borderColor: '{purple.500}', + hoverBorderColor: '{purple.600}', + activeBorderColor: '{purple.700}', + color: '#ffffff', + hoverColor: '#ffffff', + activeColor: '#ffffff' + }, + danger: { + background: '{red.500}', + hoverBackground: '{red.600}', + activeBackground: '{red.700}', + borderColor: '{red.500}', + hoverBorderColor: '{red.600}', + activeBorderColor: '{red.700}', + color: '#ffffff', + hoverColor: '#ffffff', + activeColor: '#ffffff' + }, + contrast: { + background: '{surface.950}', + hoverBackground: '{surface.900}', + activeBackground: '{surface.800}', + borderColor: '{surface.950}', + hoverBorderColor: '{surface.900}', + activeBorderColor: '{surface.800}', + color: '{surface.0}', + hoverColor: '{surface.0}', + activeColor: '{surface.0}' + } + }, + outlined: { + primary: { + hoverBackground: '{primary.50}', + activeBackground: '{primary.100}', + borderColor: '{primary.200}', + color: '{primary.color}' + }, + secondary: { + hoverBackground: '{surface.50}', + activeBackground: '{surface.100}', + borderColor: '{surface.200}', + color: '{surface.500}' + }, + success: { + hoverBackground: '{green.50}', + activeBackground: '{green.100}', + borderColor: '{green.200}', + color: '{green.500}' + }, + info: { + hoverBackground: '{sky.50}', + activeBackground: '{sky.100}', + borderColor: '{sky.200}', + color: '{sky.500}' + }, + warn: { + hoverBackground: '{orange.50}', + activeBackground: '{orange.100}', + borderColor: '{orange.200}', + color: '{orange.500}' + }, + help: { + hoverBackground: '{purple.50}', + activeBackground: '{purple.100}', + borderColor: '{purple.200}', + color: '{purple.500}' + }, + danger: { + hoverBackground: '{red.50}', + activeBackground: '{red.100}', + borderColor: '{red.200}', + color: '{red.500}' + }, + contrast: { + hoverBackground: '{surface.50}', + activeBackground: '{surface.100}', + borderColor: '{surface.700}', + color: '{surface.950}' + }, + plain: { + hoverBackground: '{surface.50}', + activeBackground: '{surface.100}', + borderColor: '{surface.200}', + color: '{surface.700}' + } + }, + text: { + primary: { + hoverBackground: '{primary.50}', + activeBackground: '{primary.100}', + color: '{primary.color}' + }, + secondary: { + hoverBackground: '{surface.50}', + activeBackground: '{surface.100}', + color: '{surface.500}' + }, + success: { + hoverBackground: '{green.50}', + activeBackground: '{green.100}', + color: '{green.500}' + }, + info: { + hoverBackground: '{sky.50}', + activeBackground: '{sky.100}', + color: '{sky.500}' + }, + warn: { + hoverBackground: '{orange.50}', + activeBackground: '{orange.100}', + color: '{orange.500}' + }, + help: { + hoverBackground: '{purple.50}', + activeBackground: '{purple.100}', + color: '{purple.600}' + }, + danger: { + hoverBackground: '{red.50}', + activeBackground: '{red.100}', + color: '{red.500}' + }, + plain: { + hoverBackground: '{surface.50}', + activeBackground: '{surface.100}', + color: '{surface.700}' + } + }, + link: { + color: '{primary.color}', + hoverColor: '{primary.color}', + activeColor: '{primary.color}' + } + }, + dark: { + root: { + primary: { + background: '{primary.color}', + hoverBackground: '{primary.hover.color}', + activeBackground: '{primary.active.color}', + borderColor: '{primary.color}', + hoverBorderColor: '{primary.hover.color}', + activeBorderColor: '{primary.active.color}', + color: '{primary.inverseColor}', + hoverColor: '{primary.inverseColor}', + activeColor: '{primary.inverseColor}' + }, + secondary: { + background: '{surface.800}', + hoverBackground: '{surface.700}', + activeBackground: '{surface.600}', + borderColor: '{surface.800}', + hoverBorderColor: '{surface.700}', + activeBorderColor: '{surface.600}', + color: '{surface.300}', + hoverColor: '{surface.200}', + activeColor: '{surface.100}' + }, + info: { + background: '{sky.400}', + hoverBackground: '{sky.300}', + activeBackground: '{sky.200}', + borderColor: '{sky.400}', + hoverBorderColor: '{sky.300}', + activeBorderColor: '{sky.200}', + color: '{sky.950}', + hoverColor: '{sky.950}', + activeColor: '{sky.950}' + }, + success: { + background: '{green.400}', + hoverBackground: '{green.300}', + activeBackground: '{green.200}', + borderColor: '{green.400}', + hoverBorderColor: '{green.300}', + activeBorderColor: '{green.200}', + color: '{green.950}', + hoverColor: '{green.950}', + activeColor: '{green.950}' + }, + warn: { + background: '{orange.400}', + hoverBackground: '{orange.300}', + activeBackground: '{orange.200}', + borderColor: '{orange.400}', + hoverBorderColor: '{orange.300}', + activeBorderColor: '{orange.200}', + color: '{orange.950}', + hoverColor: '{orange.950}', + activeColor: '{orange.950}' + }, + help: { + background: '{purple.400}', + hoverBackground: '{purple.300}', + activeBackground: '{purple.200}', + borderColor: '{purple.400}', + hoverBorderColor: '{purple.300}', + activeBorderColor: '{purple.200}', + color: '{purple.950}', + hoverColor: '{purple.950}', + activeColor: '{purple.950}' + }, + danger: { + background: '{red.400}', + hoverBackground: '{red.300}', + activeBackground: '{red.200}', + borderColor: '{red.400}', + hoverBorderColor: '{red.300}', + activeBorderColor: '{red.200}', + color: '{red.950}', + hoverColor: '{red.950}', + activeColor: '{red.950}' + }, + contrast: { + background: '{surface.0}', + hoverBackground: '{surface.100}', + activeBackground: '{surface.200}', + borderColor: '{surface.0}', + hoverBorderColor: '{surface.100}', + activeBorderColor: '{surface.200}', + color: '{surface.950}', + hoverColor: '{surface.950}', + activeColor: '{surface.950}' + } + }, + outlined: { + primary: { + hoverBackground: 'color-mix(in srgb, {primary.color}, transparent 96%)', + activeBackground: 'color-mix(in srgb, {primary.color}, transparent 84%)', + borderColor: '{primary.900}', + color: '{primary.color}' + }, + secondary: { + hoverBackground: 'rgba(255,255,255,0.04)', + activeBackground: 'rgba(255,255,255,0.16)', + borderColor: '{surface.700}', + color: '{surface.400}' + }, + success: { + hoverBackground: 'color-mix(in srgb, {green.400}, transparent 96%)', + activeBackground: 'color-mix(in srgb, {green.400}, transparent 84%)', + borderColor: '{green.900}', + color: '{green.400}' + }, + info: { + hoverBackground: 'color-mix(in srgb, {sky.400}, transparent 96%)', + activeBackground: 'color-mix(in srgb, {sky.400}, transparent 84%)', + borderColor: '{sky.900}', + color: '{sky.400}' + }, + warn: { + hoverBackground: 'color-mix(in srgb, {orange.400}, transparent 96%)', + activeBackground: 'color-mix(in srgb, {orange.400}, transparent 84%)', + borderColor: '{orange.900}', + color: '{orange.400}' + }, + help: { + hoverBackground: 'color-mix(in srgb, {help.400}, transparent 96%)', + activeBackground: 'color-mix(in srgb, {help.400}, transparent 84%)', + borderColor: '{purple.900}', + color: '{purple.400}' + }, + danger: { + hoverBackground: 'color-mix(in srgb, {danger.400}, transparent 96%)', + activeBackground: 'color-mix(in srgb, {danger.400}, transparent 84%)', + borderColor: '{red.900}', + color: '{red.400}' + }, + contrast: { + hoverBackground: '{surface.800}', + activeBackground: '{surface.700}', + borderColor: '{surface.500}', + color: '{surface.0}' + }, + plain: { + hoverBackground: '{surface.800}', + activeBackground: '{surface.700}', + borderColor: '{surface.600}', + color: '{surface.0}' + } + }, + text: { + primary: { + hoverBackground: 'color-mix(in srgb, {primary.color}, transparent 96%)', + activeBackground: 'color-mix(in srgb, {primary.color}, transparent 84%)', + color: '{primary.color}' + }, + secondary: { + hoverBackground: '{surface.800}', + activeBackground: '{surface.700}', + color: '{surface.400}' + }, + success: { + hoverBackground: 'color-mix(in srgb, {green.400}, transparent 96%)', + activeBackground: 'color-mix(in srgb, {green.400}, transparent 84%)', + color: '{green.400}' + }, + info: { + hoverBackground: 'color-mix(in srgb, {sky.400}, transparent 96%)', + activeBackground: 'color-mix(in srgb, {sky.400}, transparent 84%)', + color: '{sky.400}' + }, + warn: { + hoverBackground: 'color-mix(in srgb, {orange.400}, transparent 96%)', + activeBackground: 'color-mix(in srgb, {orange.400}, transparent 84%)', + color: '{orange.400}' + }, + help: { + hoverBackground: 'color-mix(in srgb, {purple.400}, transparent 96%)', + activeBackground: 'color-mix(in srgb, {purple.400}, transparent 84%)', + color: '{purple.400}' + }, + danger: { + hoverBackground: 'color-mix(in srgb, {red.400}, transparent 96%)', + activeBackground: 'color-mix(in srgb, {red.400}, transparent 84%)', + color: '{red.400}' + }, + plain: { + hoverBackground: '{surface.800}', + activeBackground: '{surface.700}', + color: '{surface.0}' + } + }, + link: { + color: '{primary.color}', + hoverColor: '{primary.color}', + activeColor: '{primary.color}' + } + } + } +}; diff --git a/components/lib/themes/lara/button/package.json b/components/lib/themes/lara/button/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/button/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/buttongroup/index.js b/components/lib/themes/lara/buttongroup/index.js new file mode 100644 index 000000000..ff8b4c563 --- /dev/null +++ b/components/lib/themes/lara/buttongroup/index.js @@ -0,0 +1 @@ +export default {}; diff --git a/components/lib/themes/lara/buttongroup/package.json b/components/lib/themes/lara/buttongroup/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/buttongroup/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/card/index.js b/components/lib/themes/lara/card/index.js new file mode 100644 index 000000000..d074b9223 --- /dev/null +++ b/components/lib/themes/lara/card/index.js @@ -0,0 +1,9 @@ +export default { + root: { + background: '{content.background}', + color: '{text.color}' + }, + subtitle: { + color: '{text.muted.color}' + } +}; diff --git a/components/lib/themes/lara/card/package.json b/components/lib/themes/lara/card/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/card/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/carousel/index.js b/components/lib/themes/lara/carousel/index.js new file mode 100644 index 000000000..d81d4456a --- /dev/null +++ b/components/lib/themes/lara/carousel/index.js @@ -0,0 +1,18 @@ +export default { + colorScheme: { + light: { + indicator: { + background: '{surface.200}', + hoverBackground: '{surface.300}', + activeBackground: '{primary.color}' + } + }, + dark: { + indicator: { + background: '{surface.700}', + hoverBackground: '{surface.600}', + activeBackground: '{primary.color}' + } + } + } +}; diff --git a/components/lib/themes/lara/carousel/package.json b/components/lib/themes/lara/carousel/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/carousel/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/cascadeselect/index.js b/components/lib/themes/lara/cascadeselect/index.js new file mode 100644 index 000000000..96b2a199c --- /dev/null +++ b/components/lib/themes/lara/cascadeselect/index.js @@ -0,0 +1,37 @@ +export default { + root: { + background: '{form.field.background}', + disabledBackground: '{form.field.disabled.background}', + filledBackground: '{form.field.filled.background}', + filledFocusBackground: '{form.field.filled.focus.background}', + borderColor: '{form.field.border.color}', + hoverBorderColor: '{form.field.hover.border.color}', + focusBorderColor: '{form.field.focus.border.color}', + invalidBorderColor: '{form.field.invalid.border.color}', + color: '{form.field.color}', + disabledColor: '{form.field.disabled.color}', + placeholderColor: '{form.field.placeholder.color}', + boxShadow: '{form.field.box.shadow}' + }, + dropdown: { + color: '{form.field.icon.color}' + }, + overlay: { + background: '{overlay.select.background}', + borderColor: '{overlay.select.border.color}', + color: '{overlay.select.color}' + }, + option: { + focusBackground: '{list.option.focus.background}', + selectedBackground: '{list.option.selected.background}', + selectedFocusBackground: '{list.option.selected.focus.background}', + color: '{list.option.color}', + focusColor: '{list.option.focus.color}', + selectedColor: '{list.option.selected.color}', + selectedFocusColor: '{list.option.selected.focus.color}', + icon: { + color: '{list.option.icon.color}', + focusColor: '{list.option.icon.focus.color}', + } + } +}; diff --git a/components/lib/themes/lara/cascadeselect/package.json b/components/lib/themes/lara/cascadeselect/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/cascadeselect/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/checkbox/index.js b/components/lib/themes/lara/checkbox/index.js new file mode 100644 index 000000000..15ccb8e37 --- /dev/null +++ b/components/lib/themes/lara/checkbox/index.js @@ -0,0 +1,25 @@ +export default { + root: { + borderRadius: '{rounded.sm}', + width: '1.25rem', + height: '1.25rem', + background: '{form.field.background}', + checkedBackground: '{primary.color}', + checkedHoverBackground: '{primary.hover.color}', + disabledBackground: '{form.field.disabled.background}', + filledBackground: '{form.field.filled.background}', + borderColor: '{form.field.border.color}', + hoverBorderColor: '{form.field.hover.border.color}', + checkedBorderColor: '{primary.color}', + checkedHoverBorderColor: '{primary.hover.color}', + invalidBorderColor: '{form.field.invalid.border.color}', + boxShadow: '{form.field.box.shadow}' + }, + icon: { + size: '0.875rem', + color: '{form.field.color}', + checkedColor: '{primary.inverse.color}', + checkedHoverColor: '{primary.inverse.color}', + disabledColor: '{form.field.disabled.color}' + } +}; diff --git a/components/lib/themes/lara/checkbox/package.json b/components/lib/themes/lara/checkbox/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/checkbox/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/chip/index.js b/components/lib/themes/lara/chip/index.js new file mode 100644 index 000000000..dc105c981 --- /dev/null +++ b/components/lib/themes/lara/chip/index.js @@ -0,0 +1,16 @@ +export default { + colorScheme: { + light: { + root: { + background: '{surface.100}', + color: '{surface.800}' + } + }, + dark: { + root: { + background: '{surface.700}', + color: '{surface.0}' + } + } + } +}; diff --git a/components/lib/themes/lara/chip/package.json b/components/lib/themes/lara/chip/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/chip/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/colorpicker/index.js b/components/lib/themes/lara/colorpicker/index.js new file mode 100644 index 000000000..03bab0c37 --- /dev/null +++ b/components/lib/themes/lara/colorpicker/index.js @@ -0,0 +1,22 @@ +export default { + colorScheme: { + light: { + panel: { + background: '{surface.800}', + borderColor: '{surface.900}' + }, + handle: { + color: '{surface.0}' + } + }, + dark: { + panel: { + background: '{surface.900}', + borderColor: '{surface.700}' + }, + handle: { + color: '{surface.0}' + } + } + } +}; diff --git a/components/lib/themes/lara/colorpicker/package.json b/components/lib/themes/lara/colorpicker/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/colorpicker/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/confirmdialog/index.js b/components/lib/themes/lara/confirmdialog/index.js new file mode 100644 index 000000000..ff8b4c563 --- /dev/null +++ b/components/lib/themes/lara/confirmdialog/index.js @@ -0,0 +1 @@ +export default {}; diff --git a/components/lib/themes/lara/confirmdialog/package.json b/components/lib/themes/lara/confirmdialog/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/confirmdialog/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/confirmpopup/index.js b/components/lib/themes/lara/confirmpopup/index.js new file mode 100644 index 000000000..f6ad4d3ea --- /dev/null +++ b/components/lib/themes/lara/confirmpopup/index.js @@ -0,0 +1,7 @@ +export default { + root: { + background: '{content.background}', + borderColor: '{content.border.color}', + color: '{content.color}' + } +}; diff --git a/components/lib/themes/lara/confirmpopup/package.json b/components/lib/themes/lara/confirmpopup/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/confirmpopup/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/contextmenu/index.js b/components/lib/themes/lara/contextmenu/index.js new file mode 100644 index 000000000..e0539fecb --- /dev/null +++ b/components/lib/themes/lara/contextmenu/index.js @@ -0,0 +1,22 @@ +export default { + root: { + background: '{content.background}', + borderColor: '{content.border.color}', + color: '{content.color}' + }, + item: { + focusBackground: '{navigation.item.focus.background}', + color: '{navigation.item.color}', + focusColor: '{navigation.item.focus.color}', + icon: { + color: '{navigation.item.icon.color}', + hoverColor: '{navigation.item.icon.hover.color}' + } + }, + submenuItem: { + color: '{navigation.submenu.color}' + }, + separator: { + borderColor: '{content.border.color}' + } +}; diff --git a/components/lib/themes/lara/contextmenu/package.json b/components/lib/themes/lara/contextmenu/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/contextmenu/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/datatable/index.js b/components/lib/themes/lara/datatable/index.js new file mode 100644 index 000000000..969d26e8e --- /dev/null +++ b/components/lib/themes/lara/datatable/index.js @@ -0,0 +1,89 @@ +export default { + header: { + background: '{content.background}', + borderColor: '{datatable.border.color}', + color: '{content.color}' + }, + headerCell: { + background: '{content.background}', + hoverBackground: '{content.hover.background}', + borderColor: '{datatable.border.color}', + color: '{content.color}', + hoverColor: '{content.hover.color}' + }, + row: { + background: '{content.background}', + hoverBackground: '{content.hover.background}', + color: '{content.color}', + hoverColor: '{content.hover.color}' + }, + bodyCell: { + borderColor: '{datatable.border.color}' + }, + footerCell: { + background: '{content.background}', + borderColor: '{datatable.border.color}', + color: '{content.color}' + }, + footer: { + background: '{content.background}', + borderColor: '{datatable.border.color}', + color: '{content.color}' + }, + dropPointColor: '{primary.color}', + resizeIndicatorColor: '{primary.color}', + sortIcon: { + color: '{text.muted.color}', + hoverColor: '{text.hover.muted.color}' + }, + rowToggleButton: { + hoverBackground: '{content.hover.background}', + highlightHoverBackground: '{content.background}', + color: '{text.color}', + hoverColor: '{text.muted.color}' + }, + filter: { + overlay: { + background: '{content.background}', + borderColor: '{content.border.color}', + color: '{content.color}' + }, + rule: { + borderColor: '{content.border.color}' + }, + filterConstraint: { + hoverBackground: '{content.hover.background}', + selectedBackground: '{highlight.background}', + color: '{text.color}', + hoverColor: '{text.hover.color}', + selectedColor: '{highlight.color}', + separator: { + borderColor: '{content.border.color}' + } + } + }, + colorScheme: { + light: { + root: { + borderColor: '{content.border.color}' + }, + row: { + stripedBackground: '{surface.50}' + }, + bodyCell: { + selectedBorderColor: '{primary.100}' + } + }, + dark: { + root: { + borderColor: '{surface.800}' + }, + row: { + stripedBackground: '{surface.950}' + }, + bodyCell: { + selectedBorderColor: '{primary.900}' + } + } + } +}; diff --git a/components/lib/themes/lara/datatable/package.json b/components/lib/themes/lara/datatable/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/datatable/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/dataview/index.js b/components/lib/themes/lara/dataview/index.js new file mode 100644 index 000000000..3995b628f --- /dev/null +++ b/components/lib/themes/lara/dataview/index.js @@ -0,0 +1,16 @@ +export default { + header: { + background: '{content.background}', + borderColor: '{content.border.color}', + color: '{content.color}' + }, + content: { + background: '{content.background}', + color: '{content.color}' + }, + footer: { + background: '{content.background}', + borderColor: '{content.border.color}', + color: '{content.color}' + } +}; diff --git a/components/lib/themes/lara/dataview/package.json b/components/lib/themes/lara/dataview/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/dataview/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/datepicker/index.js b/components/lib/themes/lara/datepicker/index.js new file mode 100644 index 000000000..e17d7d8b3 --- /dev/null +++ b/components/lib/themes/lara/datepicker/index.js @@ -0,0 +1,64 @@ +export default { + root: { + background: '{content.background}', + borderColor: '{content.border.color}', + color: '{content.color}' + }, + header: { + background: '{content.background}', + borderColor: '{content.border.color}', + color: '{content.color}' + }, + dropdown: { + width: '2.5rem', + borderColor: '{form.field.border.color}', + hoverBorderColor: '{form.field.border.color}', + activeBorderColor: '{form.field.border.color}', + background: '{button.secondary.background}', + hoverBackground: '{button.secondary.hover.background}', + activeBackground: '{button.secondary.active.background}', + color: '{button.secondary.color}', + hoverColor: '{button.secondary.hover.color}', + activeColor: '{button.secondary.active.color}' + }, + viewMonth: { + hoverBackground: '{content.hover.background}', + color: '{content.color}', + hoverColor: '{content.hover.color}' + }, + viewYear: { + hoverBackground: '{content.hover.background}', + color: '{content.color}', + hoverColor: '{content.hover.color}' + }, + group: { + borderColor: '{content.border.color}' + }, + date: { + hoverBackground: '{content.hover.background}', + selectedBackground: '{highlight.background}', + color: '{content.color}', + hoverColor: '{content.hover.color}', + selectedColor: '{highlight.color}' + }, + buttonbar: { + borderColor: '{content.border.color}' + }, + timePicker: { + borderColor: '{content.border.color}' + }, + colorScheme: { + light: { + today: { + background: '{surface.200}', + color: '{surface.900}' + } + }, + dark: { + today: { + background: '{surface.700}', + color: '{surface.0}' + } + } + } +}; diff --git a/components/lib/themes/lara/datepicker/package.json b/components/lib/themes/lara/datepicker/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/datepicker/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/dialog/index.js b/components/lib/themes/lara/dialog/index.js new file mode 100644 index 000000000..f6ad4d3ea --- /dev/null +++ b/components/lib/themes/lara/dialog/index.js @@ -0,0 +1,7 @@ +export default { + root: { + background: '{content.background}', + borderColor: '{content.border.color}', + color: '{content.color}' + } +}; diff --git a/components/lib/themes/lara/dialog/package.json b/components/lib/themes/lara/dialog/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/dialog/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/divider/index.js b/components/lib/themes/lara/divider/index.js new file mode 100644 index 000000000..0570e83cc --- /dev/null +++ b/components/lib/themes/lara/divider/index.js @@ -0,0 +1,9 @@ +export default { + root: { + borderColor: '{content.border.color}' + }, + content: { + background: '{content.background}', + color: '{text.color}' + } +}; diff --git a/components/lib/themes/lara/divider/package.json b/components/lib/themes/lara/divider/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/divider/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/dock/index.js b/components/lib/themes/lara/dock/index.js new file mode 100644 index 000000000..ff8b4c563 --- /dev/null +++ b/components/lib/themes/lara/dock/index.js @@ -0,0 +1 @@ +export default {}; diff --git a/components/lib/themes/lara/dock/package.json b/components/lib/themes/lara/dock/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/dock/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/drawer/index.js b/components/lib/themes/lara/drawer/index.js new file mode 100644 index 000000000..f6ad4d3ea --- /dev/null +++ b/components/lib/themes/lara/drawer/index.js @@ -0,0 +1,7 @@ +export default { + root: { + background: '{content.background}', + borderColor: '{content.border.color}', + color: '{content.color}' + } +}; diff --git a/components/lib/themes/lara/drawer/package.json b/components/lib/themes/lara/drawer/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/drawer/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/editor/index.js b/components/lib/themes/lara/editor/index.js new file mode 100644 index 000000000..0c490b406 --- /dev/null +++ b/components/lib/themes/lara/editor/index.js @@ -0,0 +1,26 @@ +export default { + toolbar: { + background: '{content.background}', + borderColor: '{content.border.color}' + }, + toolbarItem: { + color: '{text.muted.color}', + hoverColor: '{text.color}', + activeColor: '{primary.color}' + }, + overlay: { + background: '{content.background}', + borderColor: '{content.border.color}', + color: '{content.color}' + }, + overlayItem: { + hoverBackground: '{content.hover.background}', + color: '{content.color}', + hoverColor: '{content.hover.color}' + }, + content: { + background: '{content.background}', + borderColor: '{content.border.color}', + color: '{content.color}' + } +}; diff --git a/components/lib/themes/lara/editor/package.json b/components/lib/themes/lara/editor/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/editor/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/fieldset/index.js b/components/lib/themes/lara/fieldset/index.js new file mode 100644 index 000000000..a0d4ae327 --- /dev/null +++ b/components/lib/themes/lara/fieldset/index.js @@ -0,0 +1,17 @@ +export default { + root: { + background: '{content.background}', + borderColor: '{content.border.color}', + color: '{content.color}' + }, + legend: { + background: '{content.background}', + color: '{content.color}', + hoverBackground: '{content.hover.background}', + hoverColor: '{content.hover.color}' + }, + toggleIcon: { + color: '{text.muted.color}', + hoverColor: '{text.hover.muted.color}' + } +}; diff --git a/components/lib/themes/lara/fieldset/package.json b/components/lib/themes/lara/fieldset/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/fieldset/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/fileupload/index.js b/components/lib/themes/lara/fileupload/index.js new file mode 100644 index 000000000..fe85ff4c4 --- /dev/null +++ b/components/lib/themes/lara/fileupload/index.js @@ -0,0 +1,14 @@ +export default { + root: { + background: '{content.background}', + borderColor: '{content.border.color}', + color: '{content.color}' + }, + content: { + highlightBackground: '{highlight.background}', + highlightBorderColor: '{highlight.color}' + }, + file: { + borderColor: '{content.border.color}' + } +}; diff --git a/components/lib/themes/lara/fileupload/package.json b/components/lib/themes/lara/fileupload/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/fileupload/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/floatlabel/index.js b/components/lib/themes/lara/floatlabel/index.js new file mode 100644 index 000000000..e83127703 --- /dev/null +++ b/components/lib/themes/lara/floatlabel/index.js @@ -0,0 +1,7 @@ +export default { + root: { + color: '{form.field.float.label.color}', + focusColor: '{form.field.float.label.focus.color}', + invalidColor: '{form.field.float.label.invalid.color}' + } +}; diff --git a/components/lib/themes/lara/floatlabel/package.json b/components/lib/themes/lara/floatlabel/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/floatlabel/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/galleria/index.js b/components/lib/themes/lara/galleria/index.js new file mode 100644 index 000000000..2fbf64b13 --- /dev/null +++ b/components/lib/themes/lara/galleria/index.js @@ -0,0 +1,82 @@ +export default { + colorScheme: { + light: { + navButton: { + hoverBackground: 'rgba(255, 255, 255, 0.1)', + color: '{surface.100}' + }, + thumbnailNavButton: { + hoverBackground: '{surface.200}', + color: '{surface.600}', + hoverColor: '{surface.700}' + }, + thumbnailsContent: { + background: '{surface.50}' + }, + caption: { + background: 'rgba(0, 0, 0, 0.5)', + color: '{surface.100}' + }, + indicatorButton: { + background: '{surface.200}', + hoverBackground: '{surface.300}', + activeBackground: '{primary.color}' + }, + insetIndicatorList: { + background: 'rgba(0, 0, 0, 0.5)' + }, + insetIndicatorButton: { + background: 'rgba(255, 255, 255, 0.4)', + hoverBackground: 'rgba(255, 255, 255, 0.6)', + activeBackground: 'rgba(255, 255, 255, 0.9)' + }, + mask: { + background: 'rgba(0,0,0,0.9)' + }, + closeButton: { + hoverBackground: 'rgba(255,255,255,0.1)', + color: '{surface.50}', + hoverColor: '{surface.0}' + } + }, + dark: { + navButton: { + hoverBackground: 'rgba(255, 255, 255, 0.1)', + color: '{surface.400}' + }, + thumbnailNavButton: { + hoverBackground: '{surface.800}', + color: '{surface.400}', + hoverColor: '{surface.300}' + }, + thumbnailsContent: { + background: '{surface.950}' + }, + caption: { + background: 'rgba(0, 0, 0, 0.5)', + color: '{surface.100}' + }, + indicatorButton: { + background: '{surface.200}', + hoverBackground: '{surface.300}', + activeBackground: '{primary.color}' + }, + insetIndicatorList: { + background: 'rgba(0, 0, 0, 0.5)' + }, + insetIndicatorButton: { + background: 'rgba(255, 255, 255, 0.4)', + hoverBackground: 'rgba(255, 255, 255, 0.6)', + activeBackground: 'rgba(255, 255, 255, 0.9)' + }, + mask: { + background: 'rgba(0,0,0,0.9)' + }, + closeButton: { + hoverBackground: 'rgba(255,255,255,0.1)', + color: '{surface.50}', + hoverColor: '{surface.0}' + } + } + } +}; diff --git a/components/lib/themes/lara/galleria/package.json b/components/lib/themes/lara/galleria/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/galleria/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/iconfield/index.js b/components/lib/themes/lara/iconfield/index.js new file mode 100644 index 000000000..1e0102d5f --- /dev/null +++ b/components/lib/themes/lara/iconfield/index.js @@ -0,0 +1,5 @@ +export default { + icon: { + color: '{form.field.icon.color}' + } +}; diff --git a/components/lib/themes/lara/iconfield/package.json b/components/lib/themes/lara/iconfield/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/iconfield/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/image/index.js b/components/lib/themes/lara/image/index.js new file mode 100644 index 000000000..0a79539de --- /dev/null +++ b/components/lib/themes/lara/image/index.js @@ -0,0 +1,14 @@ +export default { + previewMask: { + background: '{mask.background}', + color: '{surface.200}' + }, + mask: { + background: 'rgba(0,0,0,0.9)' + }, + action: { + hoverBackground: 'rgba(255,255,255,0.1)', + color: '{surface.50}', + hoverColor: '{surface.0}' + } +}; diff --git a/components/lib/themes/lara/image/package.json b/components/lib/themes/lara/image/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/image/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/index.js b/components/lib/themes/lara/index.js new file mode 100644 index 000000000..726c8a4cb --- /dev/null +++ b/components/lib/themes/lara/index.js @@ -0,0 +1,443 @@ +import accordion from 'primevue/themes/lara/accordion'; +import autocomplete from 'primevue/themes/lara/autocomplete'; +import avatar from 'primevue/themes/lara/avatar'; +import badge from 'primevue/themes/lara/badge'; +import blockui from 'primevue/themes/lara/blockui'; +import breadcrumb from 'primevue/themes/lara/breadcrumb'; +import button from 'primevue/themes/lara/button'; +import buttongroup from 'primevue/themes/lara/buttongroup'; +import card from 'primevue/themes/lara/card'; +import carousel from 'primevue/themes/lara/carousel'; +import cascadeselect from 'primevue/themes/lara/cascadeselect'; +import checkbox from 'primevue/themes/lara/checkbox'; +import chip from 'primevue/themes/lara/chip'; +import colorpicker from 'primevue/themes/lara/colorpicker'; +import confirmdialog from 'primevue/themes/lara/confirmdialog'; +import confirmpopup from 'primevue/themes/lara/confirmpopup'; +import contextmenu from 'primevue/themes/lara/contextmenu'; +import datatable from 'primevue/themes/lara/datatable'; +import dataview from 'primevue/themes/lara/dataview'; +import datepicker from 'primevue/themes/lara/datepicker'; +import dialog from 'primevue/themes/lara/dialog'; +import divider from 'primevue/themes/lara/divider'; +import dock from 'primevue/themes/lara/dock'; +import drawer from 'primevue/themes/lara/drawer'; +import editor from 'primevue/themes/lara/editor'; +import fieldset from 'primevue/themes/lara/fieldset'; +import fileupload from 'primevue/themes/lara/fileupload'; +import floatlabel from 'primevue/themes/lara/floatlabel'; +import galleria from 'primevue/themes/lara/galleria'; +import iconfield from 'primevue/themes/lara/iconfield'; +import image from 'primevue/themes/lara/image'; +import inlinemessage from 'primevue/themes/lara/inlinemessage'; +import inplace from 'primevue/themes/lara/inplace'; +import inputchips from 'primevue/themes/lara/inputchips'; +import inputgroup from 'primevue/themes/lara/inputgroup'; +import inputnumber from 'primevue/themes/lara/inputnumber'; +import inputotp from 'primevue/themes/lara/inputotp'; +import inputtext from 'primevue/themes/lara/inputtext'; +import knob from 'primevue/themes/lara/knob'; +import listbox from 'primevue/themes/lara/listbox'; +import megamenu from 'primevue/themes/lara/megamenu'; +import menu from 'primevue/themes/lara/menu'; +import menubar from 'primevue/themes/lara/menubar'; +import message from 'primevue/themes/lara/message'; +import metergroup from 'primevue/themes/lara/metergroup'; +import multiselect from 'primevue/themes/lara/multiselect'; +import orderlist from 'primevue/themes/lara/orderlist'; +import organizationchart from 'primevue/themes/lara/organizationchart'; +import paginator from 'primevue/themes/lara/paginator'; +import panel from 'primevue/themes/lara/panel'; +import panelmenu from 'primevue/themes/lara/panelmenu'; +import password from 'primevue/themes/lara/password'; +import picklist from 'primevue/themes/lara/picklist'; +import popover from 'primevue/themes/lara/popover'; +import progressbar from 'primevue/themes/lara/progressbar'; +import progressspinner from 'primevue/themes/lara/progressspinner'; +import radiobutton from 'primevue/themes/lara/radiobutton'; +import rating from 'primevue/themes/lara/rating'; +import scrollpanel from 'primevue/themes/lara/scrollpanel'; +import scrolltop from 'primevue/themes/lara/scrolltop'; +import select from 'primevue/themes/lara/select'; +import selectbutton from 'primevue/themes/lara/selectbutton'; +import skeleton from 'primevue/themes/lara/skeleton'; +import slider from 'primevue/themes/lara/slider'; +import speeddial from 'primevue/themes/lara/speeddial'; +import splitbutton from 'primevue/themes/lara/splitbutton'; +import splitter from 'primevue/themes/lara/splitter'; +import stepper from 'primevue/themes/lara/stepper'; +import steps from 'primevue/themes/lara/steps'; +import tabmenu from 'primevue/themes/lara/tabmenu'; +import tabs from 'primevue/themes/lara/tabs'; +import tabview from 'primevue/themes/lara/tabview'; +import tag from 'primevue/themes/lara/tag'; +import terminal from 'primevue/themes/lara/terminal'; +import textarea from 'primevue/themes/lara/textarea'; +import tieredmenu from 'primevue/themes/lara/tieredmenu'; +import timeline from 'primevue/themes/lara/timeline'; +import toast from 'primevue/themes/lara/toast'; +import togglebutton from 'primevue/themes/lara/togglebutton'; +import toggleswitch from 'primevue/themes/lara/toggleswitch'; +import toolbar from 'primevue/themes/lara/toolbar'; +import tooltip from 'primevue/themes/lara/tooltip'; +import tree from 'primevue/themes/lara/tree'; +import treeselect from 'primevue/themes/lara/treeselect'; +import treetable from 'primevue/themes/lara/treetable'; + +export default { + primitive: { + rounded: { + sm: '4px', + base: '6px', + lg: '8px', + xl: '12px' + }, + emerald: { 50: '#ecfdf5', 100: '#d1fae5', 200: '#a7f3d0', 300: '#6ee7b7', 400: '#34d399', 500: '#10b981', 600: '#059669', 700: '#047857', 800: '#065f46', 900: '#064e3b', 950: '#022c22' }, + green: { 50: '#f0fdf4', 100: '#dcfce7', 200: '#bbf7d0', 300: '#86efac', 400: '#4ade80', 500: '#22c55e', 600: '#16a34a', 700: '#15803d', 800: '#166534', 900: '#14532d', 950: '#052e16' }, + lime: { 50: '#f7fee7', 100: '#ecfccb', 200: '#d9f99d', 300: '#bef264', 400: '#a3e635', 500: '#84cc16', 600: '#65a30d', 700: '#4d7c0f', 800: '#3f6212', 900: '#365314', 950: '#1a2e05' }, + red: { 50: '#fef2f2', 100: '#fee2e2', 200: '#fecaca', 300: '#fca5a5', 400: '#f87171', 500: '#ef4444', 600: '#dc2626', 700: '#b91c1c', 800: '#991b1b', 900: '#7f1d1d', 950: '#450a0a' }, + orange: { 50: '#fff7ed', 100: '#ffedd5', 200: '#fed7aa', 300: '#fdba74', 400: '#fb923c', 500: '#f97316', 600: '#ea580c', 700: '#c2410c', 800: '#9a3412', 900: '#7c2d12', 950: '#431407' }, + amber: { 50: '#fffbeb', 100: '#fef3c7', 200: '#fde68a', 300: '#fcd34d', 400: '#fbbf24', 500: '#f59e0b', 600: '#d97706', 700: '#b45309', 800: '#92400e', 900: '#78350f', 950: '#451a03' }, + yellow: { 50: '#fefce8', 100: '#fef9c3', 200: '#fef08a', 300: '#fde047', 400: '#facc15', 500: '#eab308', 600: '#ca8a04', 700: '#a16207', 800: '#854d0e', 900: '#713f12', 950: '#422006' }, + teal: { 50: '#f0fdfa', 100: '#ccfbf1', 200: '#99f6e4', 300: '#5eead4', 400: '#2dd4bf', 500: '#14b8a6', 600: '#0d9488', 700: '#0f766e', 800: '#115e59', 900: '#134e4a', 950: '#042f2e' }, + cyan: { 50: '#ecfeff', 100: '#cffafe', 200: '#a5f3fc', 300: '#67e8f9', 400: '#22d3ee', 500: '#06b6d4', 600: '#0891b2', 700: '#0e7490', 800: '#155e75', 900: '#164e63', 950: '#083344' }, + sky: { 50: '#f0f9ff', 100: '#e0f2fe', 200: '#bae6fd', 300: '#7dd3fc', 400: '#38bdf8', 500: '#0ea5e9', 600: '#0284c7', 700: '#0369a1', 800: '#075985', 900: '#0c4a6e', 950: '#082f49' }, + blue: { 50: '#eff6ff', 100: '#dbeafe', 200: '#bfdbfe', 300: '#93c5fd', 400: '#60a5fa', 500: '#3b82f6', 600: '#2563eb', 700: '#1d4ed8', 800: '#1e40af', 900: '#1e3a8a', 950: '#172554' }, + indigo: { 50: '#eef2ff', 100: '#e0e7ff', 200: '#c7d2fe', 300: '#a5b4fc', 400: '#818cf8', 500: '#6366f1', 600: '#4f46e5', 700: '#4338ca', 800: '#3730a3', 900: '#312e81', 950: '#1e1b4b' }, + violet: { 50: '#f5f3ff', 100: '#ede9fe', 200: '#ddd6fe', 300: '#c4b5fd', 400: '#a78bfa', 500: '#8b5cf6', 600: '#7c3aed', 700: '#6d28d9', 800: '#5b21b6', 900: '#4c1d95', 950: '#2e1065' }, + purple: { 50: '#faf5ff', 100: '#f3e8ff', 200: '#e9d5ff', 300: '#d8b4fe', 400: '#c084fc', 500: '#a855f7', 600: '#9333ea', 700: '#7e22ce', 800: '#6b21a8', 900: '#581c87', 950: '#3b0764' }, + fuchsia: { 50: '#fdf4ff', 100: '#fae8ff', 200: '#f5d0fe', 300: '#f0abfc', 400: '#e879f9', 500: '#d946ef', 600: '#c026d3', 700: '#a21caf', 800: '#86198f', 900: '#701a75', 950: '#4a044e' }, + pink: { 50: '#fdf2f8', 100: '#fce7f3', 200: '#fbcfe8', 300: '#f9a8d4', 400: '#f472b6', 500: '#ec4899', 600: '#db2777', 700: '#be185d', 800: '#9d174d', 900: '#831843', 950: '#500724' }, + rose: { 50: '#fff1f2', 100: '#ffe4e6', 200: '#fecdd3', 300: '#fda4af', 400: '#fb7185', 500: '#f43f5e', 600: '#e11d48', 700: '#be123c', 800: '#9f1239', 900: '#881337', 950: '#4c0519' }, + slate: { 50: '#f8fafc', 100: '#f1f5f9', 200: '#e2e8f0', 300: '#cbd5e1', 400: '#94a3b8', 500: '#64748b', 600: '#475569', 700: '#334155', 800: '#1e293b', 900: '#0f172a', 950: '#020617' }, + gray: { 50: '#f9fafb', 100: '#f3f4f6', 200: '#e5e7eb', 300: '#d1d5db', 400: '#9ca3af', 500: '#6b7280', 600: '#4b5563', 700: '#374151', 800: '#1f2937', 900: '#111827', 950: '#030712' }, + zinc: { 50: '#fafafa', 100: '#f4f4f5', 200: '#e4e4e7', 300: '#d4d4d8', 400: '#a1a1aa', 500: '#71717a', 600: '#52525b', 700: '#3f3f46', 800: '#27272a', 900: '#18181b', 950: '#09090b' }, + neutral: { 50: '#fafafa', 100: '#f5f5f5', 200: '#e5e5e5', 300: '#d4d4d4', 400: '#a3a3a3', 500: '#737373', 600: '#525252', 700: '#404040', 800: '#262626', 900: '#171717', 950: '#0a0a0a' }, + stone: { 50: '#fafaf9', 100: '#f5f5f4', 200: '#e7e5e4', 300: '#d6d3d1', 400: '#a8a29e', 500: '#78716c', 600: '#57534e', 700: '#44403c', 800: '#292524', 900: '#1c1917', 950: '#0c0a09' } + }, + semantic: { + transitionDuration: '0.2s', + focusRing: { + width: '1px', + style: 'solid', + color: '{primary.500}', + offset: '2px' + }, + anchorGutter: '2px', + // @todo - dummy test + primary: { + 50: '{blue.50}', + 100: '{blue.100}', + 200: '{blue.200}', + 300: '{blue.300}', + 400: '{blue.400}', + 500: '{blue.500}', + 600: '{blue.600}', + 700: '{blue.700}', + 800: '{blue.800}', + 900: '{blue.900}', + 950: '{blue.950}' + }, + colorScheme: { + light: { + surface: { + 0: '#ffffff', + 50: '{slate.50}', + 100: '{slate.100}', + 200: '{slate.200}', + 300: '{slate.300}', + 400: '{slate.400}', + 500: '{slate.500}', + 600: '{slate.600}', + 700: '{slate.700}', + 800: '{slate.800}', + 900: '{slate.900}', + 950: '{slate.950}' + }, + primary: { + color: '{primary.500}', + contrastColor: '#ffffff', + hoverColor: '{primary.600}', + activeColor: '{primary.700}' + }, + highlight: { + background: '{primary.50}', + focusBackground: '{primary.100}', + color: '{primary.700}', + focusColor: '{primary.800}' + }, + maskBackground: 'rgba(0,0,0,0.4)', + formField: { + background: '{surface.0}', + disabledBackground: '{surface.200}', + filledBackground: '{surface.50}', + filledFocusBackground: '{surface.0}', + borderColor: '{surface.300}', + hoverBorderColor: '{surface.400}', + focusBorderColor: '{primary.color}', + invalidBorderColor: '{red.400}', + color: '{surface.700}', + disabledColor: '{surface.500}', + placeholderColor: '{surface.500}', + floatLabelColor: '{surface.500}', + floatLabelFocusColor: '{surface.500}', + floatLabelInvalidColor: '{red.400}', + iconColor: '{surface.400}', + boxShadow: '0 0 #0000, 0 0 #0000, 0 1px 2px 0 rgba(18, 18, 23, 0.05)' + }, + text: { + color: '{surface.700}', + hoverColor: '{surface.800}', + mutedColor: '{surface.500}', + hoverMutedColor: '{surface.600}' + }, + content: { + background: '{surface.0}', + hoverBackground: '{surface.100}', + borderColor: '{surface.200}', + color: '{text.color}', + hoverColor: '{text.hover.color}' + }, + overlay: { + select: { + background: '{surface.0}', + borderColor: '{surface.200}', + color: '{text.color}' + }, + popover: { + background: '{surface.0}', + borderColor: '{surface.200}', + color: '{text.color}' + } + }, + list: { + option: { + focusBackground: '{surface.100}', + selectedBackground: '{highlight.background}', + selectedFocusBackground: '{highlight.focus.background}', + color: '{text.color}', + focusColor: '{text.hover.color}', + selectedColor: '{highlight.color}', + selectedFocusColor: '{highlight.focus.color}', + icon: { + color: '{surface.400}', + focusColor: '{surface.500}' + } + }, + optionGroup: { + background: '{surface.0}', + color: '{text.muted.color}' + } + }, + navigation: { + item: { + focusBackground: '{surface.100}', + color: '{text.color}', + hoverColor: '{text.hover.color}', + icon: { + color: '{surface.400}', + focusColor: '{surface.500}' + } + }, + submenu: { + color: '{surface.400}' + } + } + }, + dark: { + surface: { + 0: '#ffffff', + 50: '{zinc.50}', + 100: '{zinc.100}', + 200: '{zinc.200}', + 300: '{zinc.300}', + 400: '{zinc.400}', + 500: '{zinc.500}', + 600: '{zinc.600}', + 700: '{zinc.700}', + 800: '{zinc.800}', + 900: '{zinc.900}', + 950: '{zinc.950}' + }, + primary: { + color: '{primary.400}', + contrastColor: '{surface.900}', + hoverColor: '{primary.300}', + activeColor: '{primary.200}' + }, + highlight: { + background: 'color-mix(in srgb, {primary.400}, transparent 84%)', + focusBackground: 'color-mix(in srgb, {primary.400}, transparent 76%)', + color: 'rgba(255,255,255,.87)', + focusColor: 'rgba(255,255,255,.87)' + }, + maskBackground: 'rgba(0,0,0,0.4)', + formField: { + background: '{surface.950}', + disabledBackground: '{surface.700}', + filledBackground: '{surface.800}', + filledFocusBackground: '{surface.950}', + borderColor: '{surface.700}', + hoverBorderColor: '{surface.600}', + focusBorderColor: '{primary.color}', + invalidBorderColor: '{red.300}', + color: '{surface.0}', + disabledColor: '{surface.400}', + placeholderColor: '{surface.400}', + floatLabelColor: '{surface.400}', + floatLabelFocusColor: '{surface.400}', + floatLabelInvalidColor: '{red.300}', + iconColor: '{surface.400}', + boxShadow: '0 0 #0000, 0 0 #0000, 0 1px 2px 0 rgba(18, 18, 23, 0.05)' + }, + text: { + color: '{surface.0}', + hoverColor: '{surface.0}', + mutedColor: '{surface.400}', + hoverMutedColor: '{surface.300}' + }, + content: { + background: '{surface.900}', + hoverBackground: '{surface.800}', + borderColor: '{surface.700}', + color: '{text.color}', + hoverColor: '{text.hover.color}' + }, + overlay: { + select: { + background: '{surface.900}', + borderColor: '{surface.700}', + color: '{text.color}' + }, + popover: { + background: '{surface.900}', + borderColor: '{surface.700}', + color: '{text.color}' + } + }, + list: { + option: { + focusBackground: '{surface.800}', + selectedBackground: '{highlight.background}', + selectedFocusBackground: '{highlight.focus.background}', + color: '{text.color}', + focusColor: '{text.hover.color}', + selectedColor: '{highlight.color}', + selectedFocusColor: '{highlight.focus.color}', + icon: { + color: '{surface.500}', + focusColor: '{surface.400}' + } + }, + optionGroup: { + background: '{surface.900}', + color: '{text.muted.color}' + } + }, + navigation: { + item: { + focusBackground: '{surface.800}', + color: '{text.color}', + hoverColor: '{text.hover.color}', + icon: { + color: '{surface.500}', + focusColor: '{surface.400}' + } + }, + submenu: { + color: '{surface.500}' + } + } + } + } + }, + components: { + accordion, + autocomplete, + avatar, + badge, + blockui, + breadcrumb, + button, + buttongroup, + datepicker, + card, + carousel, + cascadeselect, + checkbox, + chip, + colorpicker, + confirmdialog, + confirmpopup, + contextmenu, + dataview, + datatable, + dialog, + divider, + dock, + drawer, + editor, + fieldset, + fileupload, + floatlabel, + galleria, + iconfield, + image, + inlinemessage, + inplace, + inputchips, + inputgroup, + inputnumber, + inputotp, + toggleswitch, + inputtext, + knob, + listbox, + megamenu, + menu, + menubar, + message, + metergroup, + multiselect, + orderlist, + organizationchart, + popover, + paginator, + password, + panel, + panelmenu, + picklist, + progressbar, + progressspinner, + radiobutton, + rating, + scrollpanel, + scrolltop, + select, + selectbutton, + skeleton, + slider, + speeddial, + splitter, + splitbutton, + stepper, + steps, + tabmenu, + tabs, + tabview, + textarea, + tieredmenu, + tag, + terminal, + timeline, + togglebutton, + tree, + treeselect, + treetable, + toast, + toolbar + }, + directives: { + tooltip + } +}; diff --git a/components/lib/themes/lara/inlinemessage/index.js b/components/lib/themes/lara/inlinemessage/index.js new file mode 100644 index 000000000..0ee806605 --- /dev/null +++ b/components/lib/themes/lara/inlinemessage/index.js @@ -0,0 +1,80 @@ +export default { + colorScheme: { + light: { + info: { + background: 'color-mix(in srgb, {blue.50}, transparent 5%)', + borderColor: '{blue.200}', + color: '{blue.600}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)' + }, + success: { + background: 'color-mix(in srgb, {green.50}, transparent 5%)', + borderColor: '{green.200}', + color: '{green.600}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)' + }, + warn: { + background: 'color-mix(in srgb,{yellow.50}, transparent 5%)', + borderColor: '{yellow.200}', + color: '{yellow.600}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)' + }, + error: { + background: 'color-mix(in srgb, {red.50}, transparent 5%)', + borderColor: '{red.200}', + color: '{red.600}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)' + }, + secondary: { + background: '{surface.100}', + borderColor: '{surface.200}', + color: '{surface.600}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)' + }, + contrast: { + background: '{surface.900}', + borderColor: '{surface.950}', + color: '{surface.50}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)' + } + }, + dark: { + info: { + background: 'color-mix(in srgb, {blue.500}, transparent 84%)', + borderColor: 'color-mix(in srgb, {blue.700}, transparent 64%)', + color: '{blue.500}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)' + }, + success: { + background: 'color-mix(in srgb, {green.500}, transparent 84%)', + borderColor: 'color-mix(in srgb, {green.700}, transparent 64%)', + color: '{green.500}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)' + }, + warn: { + background: 'color-mix(in srgb, {yellow.500}, transparent 84%)', + borderColor: 'color-mix(in srgb, {yellow.700}, transparent 64%)', + color: '{yellow.500}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)' + }, + error: { + background: 'color-mix(in srgb, {red.500}, transparent 84%)', + borderColor: 'color-mix(in srgb, {red.700}, transparent 64%)', + color: '{red.500}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)' + }, + secondary: { + background: '{surface.800}', + borderColor: '{surface.700}', + color: '{surface.300}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)' + }, + contrast: { + background: '{surface.0}', + borderColor: '{surface.100}', + color: '{surface.950}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)' + } + } + } +}; diff --git a/components/lib/themes/lara/inlinemessage/package.json b/components/lib/themes/lara/inlinemessage/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/inlinemessage/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/inplace/index.js b/components/lib/themes/lara/inplace/index.js new file mode 100644 index 000000000..9bdd8e58a --- /dev/null +++ b/components/lib/themes/lara/inplace/index.js @@ -0,0 +1,16 @@ +export default { + colorScheme: { + light: { + display: { + hoverBackground: '{surface.100}', + hoverColor: '{surface.800}' + } + }, + dark: { + display: { + hoverBackground: '{surface.800}', + hoverColor: '{surface.0}' + } + } + } +}; diff --git a/components/lib/themes/lara/inplace/package.json b/components/lib/themes/lara/inplace/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/inplace/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/inputchips/index.js b/components/lib/themes/lara/inputchips/index.js new file mode 100644 index 000000000..ee6501b37 --- /dev/null +++ b/components/lib/themes/lara/inputchips/index.js @@ -0,0 +1,16 @@ +export default { + root: { + background: '{form.field.background}', + disabledBackground: '{form.field.disabled.background}', + filledBackground: '{form.field.filled.background}', + filledFocusBackground: '{form.field.filled.focus.background}', + borderColor: '{form.field.border.color}', + hoverBorderColor: '{form.field.hover.border.color}', + focusBorderColor: '{form.field.focus.border.color}', + invalidBorderColor: '{form.field.invalid.border.color}', + color: '{form.field.color}', + disabledColor: '{form.field.disabled.color}', + placeholderColor: '{form.field.placeholder.color}', + boxShadow: '{form.field.box.shadow}' + } +}; diff --git a/components/lib/themes/lara/inputchips/package.json b/components/lib/themes/lara/inputchips/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/inputchips/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/inputgroup/index.js b/components/lib/themes/lara/inputgroup/index.js new file mode 100644 index 000000000..98043141a --- /dev/null +++ b/components/lib/themes/lara/inputgroup/index.js @@ -0,0 +1,7 @@ +export default { + addon: { + background: '{form.field.background}', + borderColor: '{form.field.border.color}', + color: '{form.field.icon.color}' + } +}; diff --git a/components/lib/themes/lara/inputgroup/package.json b/components/lib/themes/lara/inputgroup/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/inputgroup/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/inputnumber/index.js b/components/lib/themes/lara/inputnumber/index.js new file mode 100644 index 000000000..fb8ad1783 --- /dev/null +++ b/components/lib/themes/lara/inputnumber/index.js @@ -0,0 +1,33 @@ +export default { + button: { + width: '2.5rem' + }, + colorScheme: { + light: { + button: { + background: 'transparent', + hoverBackground: '{surface.100}', + activeBackground: '{surface.200}', + borderColor: '{form.field.border.color}', + hoverBorderColor: '{form.field.border.color}', + activeBorderColor: '{form.field.border.color}', + color: '{surface.400}', + hoverColor: '{surface.500}', + activeColor: '{surface.600}' + } + }, + dark: { + button: { + background: 'transparent', + hoverBackground: '{surface.800}', + activeBackground: '{surface.700}', + borderColor: '{form.field.border.color}', + hoverBorderColor: '{form.field.border.color}', + activeBorderColor: '{form.field.border.color}', + color: '{surface.400}', + hoverColor: '{surface.300}', + activeColor: '{surface.200}' + } + } + } +}; diff --git a/components/lib/themes/lara/inputnumber/package.json b/components/lib/themes/lara/inputnumber/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/inputnumber/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/inputotp/index.js b/components/lib/themes/lara/inputotp/index.js new file mode 100644 index 000000000..ff8b4c563 --- /dev/null +++ b/components/lib/themes/lara/inputotp/index.js @@ -0,0 +1 @@ +export default {}; diff --git a/components/lib/themes/lara/inputotp/package.json b/components/lib/themes/lara/inputotp/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/inputotp/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/inputtext/index.js b/components/lib/themes/lara/inputtext/index.js new file mode 100644 index 000000000..ee6501b37 --- /dev/null +++ b/components/lib/themes/lara/inputtext/index.js @@ -0,0 +1,16 @@ +export default { + root: { + background: '{form.field.background}', + disabledBackground: '{form.field.disabled.background}', + filledBackground: '{form.field.filled.background}', + filledFocusBackground: '{form.field.filled.focus.background}', + borderColor: '{form.field.border.color}', + hoverBorderColor: '{form.field.hover.border.color}', + focusBorderColor: '{form.field.focus.border.color}', + invalidBorderColor: '{form.field.invalid.border.color}', + color: '{form.field.color}', + disabledColor: '{form.field.disabled.color}', + placeholderColor: '{form.field.placeholder.color}', + boxShadow: '{form.field.box.shadow}' + } +}; diff --git a/components/lib/themes/lara/inputtext/package.json b/components/lib/themes/lara/inputtext/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/inputtext/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/knob/index.js b/components/lib/themes/lara/knob/index.js new file mode 100644 index 000000000..6223509de --- /dev/null +++ b/components/lib/themes/lara/knob/index.js @@ -0,0 +1,11 @@ +export default { + value: { + background: '{primary.color}' + }, + range: { + background: '{content.border.color}' + }, + text: { + color: '{text.muted.color}' + } +}; diff --git a/components/lib/themes/lara/knob/package.json b/components/lib/themes/lara/knob/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/knob/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/listbox/index.js b/components/lib/themes/lara/listbox/index.js new file mode 100644 index 000000000..5ac90ddf8 --- /dev/null +++ b/components/lib/themes/lara/listbox/index.js @@ -0,0 +1,29 @@ +export default { + root: { + background: '{form.field.background}', + disabledBackground: '{form.field.disabled.background}', + borderColor: '{form.field.border.color}', + hoverBorderColor: '{form.field.hover.border.color}', + focusBorderColor: '{form.field.focus.border.color}', + invalidBorderColor: '{form.field.invalid.border.color}', + color: '{form.field.color}', + disabledColor: '{form.field.disabled.color}', + boxShadow: '{form.field.box.shadow}' + }, + option: { + focusBackground: '{list.option.focus.background}', + selectedBackground: '{list.option.selected.background}', + selectedFocusBackground: '{list.option.selected.focus.background}', + color: '{list.option.color}', + focusColor: '{list.option.focus.color}', + selectedColor: '{list.option.selected.color}', + selectedFocusColor: '{list.option.selected.focus.color}' + }, + optionGroup: { + background: '{list.option.group.background}', + color: '{list.option.group.color}' + }, + filterIcon: { + color: '{form.field.icon.color}' + } +}; diff --git a/components/lib/themes/lara/listbox/package.json b/components/lib/themes/lara/listbox/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/listbox/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/megamenu/index.js b/components/lib/themes/lara/megamenu/index.js new file mode 100644 index 000000000..575698534 --- /dev/null +++ b/components/lib/themes/lara/megamenu/index.js @@ -0,0 +1,27 @@ +export default { + root: { + background: '{content.background}', + borderColor: '{content.border.color}', + color: '{content.color}' + }, + item: { + focusBackground: '{navigation.item.focus.background}', + color: '{navigation.item.color}', + focusColor: '{navigation.item.focus.color}', + icon: { + color: '{navigation.item.icon.color}', + hoverColor: '{navigation.item.icon.hover.color}' + } + }, + submenuItem: { + color: '{navigation.submenu.color}' + }, + separator: { + borderColor: '{content.border.color}' + }, + mobileToggle: { + color: '{text.muted.color}', + hoverColor: '{text.muted.hover.color}', + hoverBackground: '{content.hover.background}' + } +}; diff --git a/components/lib/themes/lara/megamenu/package.json b/components/lib/themes/lara/megamenu/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/megamenu/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/menu/index.js b/components/lib/themes/lara/menu/index.js new file mode 100644 index 000000000..e0539fecb --- /dev/null +++ b/components/lib/themes/lara/menu/index.js @@ -0,0 +1,22 @@ +export default { + root: { + background: '{content.background}', + borderColor: '{content.border.color}', + color: '{content.color}' + }, + item: { + focusBackground: '{navigation.item.focus.background}', + color: '{navigation.item.color}', + focusColor: '{navigation.item.focus.color}', + icon: { + color: '{navigation.item.icon.color}', + hoverColor: '{navigation.item.icon.hover.color}' + } + }, + submenuItem: { + color: '{navigation.submenu.color}' + }, + separator: { + borderColor: '{content.border.color}' + } +}; diff --git a/components/lib/themes/lara/menu/package.json b/components/lib/themes/lara/menu/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/menu/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/menubar/index.js b/components/lib/themes/lara/menubar/index.js new file mode 100644 index 000000000..575698534 --- /dev/null +++ b/components/lib/themes/lara/menubar/index.js @@ -0,0 +1,27 @@ +export default { + root: { + background: '{content.background}', + borderColor: '{content.border.color}', + color: '{content.color}' + }, + item: { + focusBackground: '{navigation.item.focus.background}', + color: '{navigation.item.color}', + focusColor: '{navigation.item.focus.color}', + icon: { + color: '{navigation.item.icon.color}', + hoverColor: '{navigation.item.icon.hover.color}' + } + }, + submenuItem: { + color: '{navigation.submenu.color}' + }, + separator: { + borderColor: '{content.border.color}' + }, + mobileToggle: { + color: '{text.muted.color}', + hoverColor: '{text.muted.hover.color}', + hoverBackground: '{content.hover.background}' + } +}; diff --git a/components/lib/themes/lara/menubar/package.json b/components/lib/themes/lara/menubar/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/menubar/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/message/index.js b/components/lib/themes/lara/message/index.js new file mode 100644 index 000000000..410fa31af --- /dev/null +++ b/components/lib/themes/lara/message/index.js @@ -0,0 +1,116 @@ +export default { + colorScheme: { + light: { + info: { + background: 'color-mix(in srgb, {blue.50}, transparent 5%)', + borderColor: '{blue.200}', + color: '{blue.600}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)', + closeButton: { + hoverBackground: '{blue.100}' + } + }, + success: { + background: 'color-mix(in srgb, {green.50}, transparent 5%)', + borderColor: '{green.200}', + color: '{green.600}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)', + closeButton: { + hoverBackground: '{green.100}' + } + }, + warn: { + background: 'color-mix(in srgb,{yellow.50}, transparent 5%)', + borderColor: '{yellow.200}', + color: '{yellow.600}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)', + closeButton: { + hoverBackground: '{yellow.100}' + } + }, + error: { + background: 'color-mix(in srgb, {red.50}, transparent 5%)', + borderColor: '{red.200}', + color: '{red.600}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)', + closeButton: { + hoverBackground: '{red.100}' + } + }, + secondary: { + background: '{surface.100}', + borderColor: '{surface.200}', + color: '{surface.600}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)', + closeButton: { + hoverBackground: '{surface.200}' + } + }, + contrast: { + background: '{surface.900}', + borderColor: '{surface.950}', + color: '{surface.50}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)', + closeButton: { + hoverBackground: '{surface.800}' + } + } + }, + dark: { + info: { + background: 'color-mix(in srgb, {blue.500}, transparent 84%)', + borderColor: 'color-mix(in srgb, {blue.700}, transparent 64%)', + color: '{blue.500}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)', + closeButton: { + hoverBackground: 'rgba(255, 255, 255, 0.05)' + } + }, + success: { + background: 'color-mix(in srgb, {green.500}, transparent 84%)', + borderColor: 'color-mix(in srgb, {green.700}, transparent 64%)', + color: '{green.500}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)', + closeButton: { + hoverBackground: 'rgba(255, 255, 255, 0.05)' + } + }, + warn: { + background: 'color-mix(in srgb, {yellow.500}, transparent 84%)', + borderColor: 'color-mix(in srgb, {yellow.700}, transparent 64%)', + color: '{yellow.500}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)', + closeButton: { + hoverBackground: 'rgba(255, 255, 255, 0.05)' + } + }, + error: { + background: 'color-mix(in srgb, {red.500}, transparent 84%)', + borderColor: 'color-mix(in srgb, {red.700}, transparent 64%)', + color: '{red.500}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)', + closeButton: { + hoverBackground: 'rgba(255, 255, 255, 0.05)' + } + }, + secondary: { + background: '{surface.800}', + borderColor: '{surface.700}', + color: '{surface.300}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)', + closeButton: { + hoverBackground: '{surface.700}' + } + }, + contrast: { + background: '{surface.0}', + borderColor: '{surface.100}', + color: '{surface.950}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)', + closeButton: { + hoverBackground: '{surface.100}' + } + } + } + } +}; diff --git a/components/lib/themes/lara/message/package.json b/components/lib/themes/lara/message/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/message/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/metergroup/index.js b/components/lib/themes/lara/metergroup/index.js new file mode 100644 index 000000000..d1a7b456c --- /dev/null +++ b/components/lib/themes/lara/metergroup/index.js @@ -0,0 +1,5 @@ +export default { + meters: { + background: '{content.border.color}' + } +}; diff --git a/components/lib/themes/lara/metergroup/package.json b/components/lib/themes/lara/metergroup/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/metergroup/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/multiselect/index.js b/components/lib/themes/lara/multiselect/index.js new file mode 100644 index 000000000..eeadcb602 --- /dev/null +++ b/components/lib/themes/lara/multiselect/index.js @@ -0,0 +1,40 @@ +export default { + root: { + background: '{form.field.background}', + disabledBackground: '{form.field.disabled.background}', + filledBackground: '{form.field.filled.background}', + filledFocusBackground: '{form.field.filled.focus.background}', + borderColor: '{form.field.border.color}', + hoverBorderColor: '{form.field.hover.border.color}', + focusBorderColor: '{form.field.focus.border.color}', + invalidBorderColor: '{form.field.invalid.border.color}', + color: '{form.field.color}', + disabledColor: '{form.field.disabled.color}', + placeholderColor: '{form.field.placeholder.color}', + boxShadow: '{form.field.box.shadow}' + }, + dropdown: { + color: '{form.field.icon.color}' + }, + overlay: { + background: '{overlay.select.background}', + borderColor: '{overlay.select.border.color}', + color: '{overlay.select.color}' + }, + option: { + focusBackground: '{list.option.focus.background}', + selectedBackground: '{list.option.selected.background}', + selectedFocusBackground: '{list.option.selected.focus.background}', + color: '{list.option.color}', + focusColor: '{list.option.focus.color}', + selectedColor: '{list.option.selected.color}', + selectedFocusColor: '{list.option.selected.focus.color}' + }, + optionGroup: { + background: '{list.option.group.background}', + color: '{list.option.group.color}' + }, + filterIcon: { + color: '{form.field.icon.color}' + } +}; diff --git a/components/lib/themes/lara/multiselect/package.json b/components/lib/themes/lara/multiselect/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/multiselect/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/orderlist/index.js b/components/lib/themes/lara/orderlist/index.js new file mode 100644 index 000000000..ff8b4c563 --- /dev/null +++ b/components/lib/themes/lara/orderlist/index.js @@ -0,0 +1 @@ +export default {}; diff --git a/components/lib/themes/lara/orderlist/package.json b/components/lib/themes/lara/orderlist/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/orderlist/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/organizationchart/index.js b/components/lib/themes/lara/organizationchart/index.js new file mode 100644 index 000000000..3b4277704 --- /dev/null +++ b/components/lib/themes/lara/organizationchart/index.js @@ -0,0 +1,17 @@ +export default { + node: { + background: '{content.background}', + hoverBackground: '{content.hover.background}', + borderColor: '{content.border.color}', + color: '{text.color}', + hoverColor: '{text.hover.color}' + }, + nodeToggleButton: { + background: '{content.background}', + borderColor: '{content.border.color}', + color: '{text.muted.color}' + }, + connector: { + color: '{content.border.color}' + } +}; diff --git a/components/lib/themes/lara/organizationchart/package.json b/components/lib/themes/lara/organizationchart/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/organizationchart/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/package.json b/components/lib/themes/lara/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/paginator/index.js b/components/lib/themes/lara/paginator/index.js new file mode 100644 index 000000000..b7315cdb9 --- /dev/null +++ b/components/lib/themes/lara/paginator/index.js @@ -0,0 +1,14 @@ +export default { + root: { + background: '{content.background}', + color: '{content.color}' + }, + navButton: { + hoverBackground: '{content.hover.background}', + color: '{text.muted.color}', + hoverColor: '{text.hover.muted.color}' + }, + currentPageReport: { + color: '{text.muted.color}' + } +}; diff --git a/components/lib/themes/lara/paginator/package.json b/components/lib/themes/lara/paginator/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/paginator/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/panel/index.js b/components/lib/themes/lara/panel/index.js new file mode 100644 index 000000000..fe953017e --- /dev/null +++ b/components/lib/themes/lara/panel/index.js @@ -0,0 +1,7 @@ +export default { + root: { + background: 'red', // @todo - dummy test + borderColor: '{content.border.color}', + color: '{content.color}' + } +}; diff --git a/components/lib/themes/lara/panel/package.json b/components/lib/themes/lara/panel/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/panel/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/panelmenu/index.js b/components/lib/themes/lara/panelmenu/index.js new file mode 100644 index 000000000..8054c8f76 --- /dev/null +++ b/components/lib/themes/lara/panelmenu/index.js @@ -0,0 +1,16 @@ +export default { + panel: { + background: '{content.background}', + borderColor: '{content.border.color}', + color: '{content.color}' + }, + item: { + focusBackground: '{navigation.item.focus.background}', + color: '{navigation.item.color}', + focusColor: '{navigation.item.focus.color}', + icon: { + color: '{navigation.item.icon.color}', + hoverColor: '{navigation.item.icon.hover.color}' + } + } +}; diff --git a/components/lib/themes/lara/panelmenu/package.json b/components/lib/themes/lara/panelmenu/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/panelmenu/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/password/index.js b/components/lib/themes/lara/password/index.js new file mode 100644 index 000000000..05bb83661 --- /dev/null +++ b/components/lib/themes/lara/password/index.js @@ -0,0 +1,29 @@ +export default { + meter: { + borderColor: '{content.border.color}' + }, + icon: { + color: '{form.field.icon.color}' + }, + overlay: { + background: '{overlay.popover.background}', + borderColor: '{overlay.popover.border.color}', + color: '{overlay.popover.color}' + }, + colorScheme: { + light: { + strength: { + weakBackground: '{red.500}', + mediumBackground: '{amber.500}', + strongBackground: '{green.500}' + } + }, + dark: { + strength: { + weakBackground: '{red.400}', + mediumBackground: '{amber.400}', + strongBackground: '{green.400}' + } + } + } +}; diff --git a/components/lib/themes/lara/password/package.json b/components/lib/themes/lara/password/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/password/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/picklist/index.js b/components/lib/themes/lara/picklist/index.js new file mode 100644 index 000000000..ff8b4c563 --- /dev/null +++ b/components/lib/themes/lara/picklist/index.js @@ -0,0 +1 @@ +export default {}; diff --git a/components/lib/themes/lara/picklist/package.json b/components/lib/themes/lara/picklist/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/picklist/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/popover/index.js b/components/lib/themes/lara/popover/index.js new file mode 100644 index 000000000..f6ad4d3ea --- /dev/null +++ b/components/lib/themes/lara/popover/index.js @@ -0,0 +1,7 @@ +export default { + root: { + background: '{content.background}', + borderColor: '{content.border.color}', + color: '{content.color}' + } +}; diff --git a/components/lib/themes/lara/popover/package.json b/components/lib/themes/lara/popover/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/popover/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/progressbar/index.js b/components/lib/themes/lara/progressbar/index.js new file mode 100644 index 000000000..0c2459225 --- /dev/null +++ b/components/lib/themes/lara/progressbar/index.js @@ -0,0 +1,11 @@ +export default { + root: { + background: '{content.border.color}' + }, + value: { + background: '{primary.color}' + }, + label: { + color: '{primary.inverse.color}' + } +}; diff --git a/components/lib/themes/lara/progressbar/package.json b/components/lib/themes/lara/progressbar/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/progressbar/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/progressspinner/index.js b/components/lib/themes/lara/progressspinner/index.js new file mode 100644 index 000000000..30c1c4175 --- /dev/null +++ b/components/lib/themes/lara/progressspinner/index.js @@ -0,0 +1,20 @@ +export default { + colorScheme: { + light: { + root: { + 'color.1': '{red.500}', + 'color.2': '{blue.500}', + 'color.3': '{green.500}', + 'color.4': '{yellow.500}' + } + }, + dark: { + root: { + 'color.1': '{red.400}', + 'color.2': '{blue.400}', + 'color.3': '{green.400}', + 'color.4': '{yellow.400}' + } + } + } +}; diff --git a/components/lib/themes/lara/progressspinner/package.json b/components/lib/themes/lara/progressspinner/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/progressspinner/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/radiobutton/index.js b/components/lib/themes/lara/radiobutton/index.js new file mode 100644 index 000000000..423303dcb --- /dev/null +++ b/components/lib/themes/lara/radiobutton/index.js @@ -0,0 +1,23 @@ +export default { + root: { + width: '1.25rem', + height: '1.25rem', + background: '{form.field.background}', + checkedBackground: '{primary.color}', + checkedHoverBackground: '{primary.hover.color}', + disabledBackground: '{form.field.disabled.background}', + filledBackground: '{form.field.filled.background}', + borderColor: '{form.field.border.color}', + hoverBordercolor: '{form.field.hover.border.color}', + checkedBorderColor: '{primary.color}', + checkedHoverBorderColor: '{primary.hover.color}', + invalidBorderColor: '{form.field.invalid.border.color}', + boxShadow: '{form.field.box.shadow}' + }, + icon: { + size: '0.75rem', + checkedColor: '{primary.inverse.color}', + checkedHoverColor: '{primary.inverse.color}', + disabledColor: '{form.field.disabled.color}' + } +}; diff --git a/components/lib/themes/lara/radiobutton/package.json b/components/lib/themes/lara/radiobutton/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/radiobutton/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/rating/index.js b/components/lib/themes/lara/rating/index.js new file mode 100644 index 000000000..b5b8b25a3 --- /dev/null +++ b/components/lib/themes/lara/rating/index.js @@ -0,0 +1,7 @@ +export default { + icon: { + color: '{text.muted.color}', + hoverColor: '{primary.color}', + activeColor: '{primary.color}' + } +}; diff --git a/components/lib/themes/lara/rating/package.json b/components/lib/themes/lara/rating/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/rating/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/scrollpanel/index.js b/components/lib/themes/lara/scrollpanel/index.js new file mode 100644 index 000000000..93b3bada9 --- /dev/null +++ b/components/lib/themes/lara/scrollpanel/index.js @@ -0,0 +1,14 @@ +export default { + colorScheme: { + light: { + bar: { + background: '{surface.100}' + } + }, + dark: { + bar: { + background: '{surface.800}' + } + } + } +}; diff --git a/components/lib/themes/lara/scrollpanel/package.json b/components/lib/themes/lara/scrollpanel/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/scrollpanel/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/scrolltop/index.js b/components/lib/themes/lara/scrolltop/index.js new file mode 100644 index 000000000..ff8b4c563 --- /dev/null +++ b/components/lib/themes/lara/scrolltop/index.js @@ -0,0 +1 @@ +export default {}; diff --git a/components/lib/themes/lara/scrolltop/package.json b/components/lib/themes/lara/scrolltop/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/scrolltop/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/select/index.js b/components/lib/themes/lara/select/index.js new file mode 100644 index 000000000..e636df8cf --- /dev/null +++ b/components/lib/themes/lara/select/index.js @@ -0,0 +1,43 @@ +export default { + root: { + background: '{form.field.background}', + disabledBackground: '{form.field.disabled.background}', + filledBackground: '{form.field.filled.background}', + filledFocusBackground: '{form.field.filled.focus.background}', + borderColor: '{form.field.border.color}', + hoverBorderColor: '{form.field.hover.border.color}', + focusBorderColor: '{form.field.focus.border.color}', + invalidBorderColor: '{form.field.invalid.border.color}', + color: '{form.field.color}', + disabledColor: '{form.field.disabled.color}', + placeholderColor: '{form.field.placeholder.color}', + boxShadow: '{form.field.box.shadow}' + }, + dropdown: { + color: '{form.field.icon.color}' + }, + overlay: { + background: '{overlay.select.background}', + borderColor: '{overlay.select.border.color}', + color: '{overlay.select.color}' + }, + option: { + focusBackground: '{list.option.focus.background}', + selectedBackground: '{list.option.selected.background}', + selectedFocusBackground: '{list.option.selected.focus.background}', + color: '{list.option.color}', + focusColor: '{list.option.focus.color}', + selectedColor: '{list.option.selected.color}', + selectedFocusColor: '{list.option.selected.focus.color}' + }, + optionGroup: { + background: '{list.option.group.background}', + color: '{list.option.group.color}' + }, + filterIcon: { + color: '{form.field.icon.color}' + }, + checkmark: { + color: '{list.option.color}' + } +}; diff --git a/components/lib/themes/lara/select/package.json b/components/lib/themes/lara/select/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/select/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/selectbutton/index.js b/components/lib/themes/lara/selectbutton/index.js new file mode 100644 index 000000000..d22a34184 --- /dev/null +++ b/components/lib/themes/lara/selectbutton/index.js @@ -0,0 +1,14 @@ +export default { + colorScheme: { + light: { + root: { + invalidBorderColor: '{form.field.invalid.border.color}' + } + }, + dark: { + root: { + invalidBorderColor: '{form.field.invalid.border.color}' + } + } + } +}; diff --git a/components/lib/themes/lara/selectbutton/package.json b/components/lib/themes/lara/selectbutton/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/selectbutton/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/skeleton/index.js b/components/lib/themes/lara/skeleton/index.js new file mode 100644 index 000000000..16aa0c517 --- /dev/null +++ b/components/lib/themes/lara/skeleton/index.js @@ -0,0 +1,16 @@ +export default { + colorScheme: { + light: { + root: { + background: '{surface.200}', + animationBackground: 'rgba(255,255,255,0.4)' + } + }, + dark: { + root: { + background: 'rgba(255, 255, 255, 0.06)', + animationBackground: 'rgba(255, 255, 255, 0.04)' + } + } + } +}; diff --git a/components/lib/themes/lara/skeleton/package.json b/components/lib/themes/lara/skeleton/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/skeleton/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/slider/index.js b/components/lib/themes/lara/slider/index.js new file mode 100644 index 000000000..a90a3d656 --- /dev/null +++ b/components/lib/themes/lara/slider/index.js @@ -0,0 +1,24 @@ +export default { + track: { + background: '{content.border.color}' + }, + range: { + background: '{primary.color}' + }, + handle: { + background: '{content.border.color}', + hoverBackground: '{content.border.color}' + }, + colorScheme: { + light: { + handle: { + contentBackground: '{surface.0}' + } + }, + dark: { + handle: { + contentBackground: '{surface.950}' + } + } + } +}; diff --git a/components/lib/themes/lara/slider/package.json b/components/lib/themes/lara/slider/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/slider/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/speeddial/index.js b/components/lib/themes/lara/speeddial/index.js new file mode 100644 index 000000000..ff8b4c563 --- /dev/null +++ b/components/lib/themes/lara/speeddial/index.js @@ -0,0 +1 @@ +export default {}; diff --git a/components/lib/themes/lara/speeddial/package.json b/components/lib/themes/lara/speeddial/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/speeddial/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/splitbutton/index.js b/components/lib/themes/lara/splitbutton/index.js new file mode 100644 index 000000000..ff8b4c563 --- /dev/null +++ b/components/lib/themes/lara/splitbutton/index.js @@ -0,0 +1 @@ +export default {}; diff --git a/components/lib/themes/lara/splitbutton/package.json b/components/lib/themes/lara/splitbutton/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/splitbutton/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/splitter/index.js b/components/lib/themes/lara/splitter/index.js new file mode 100644 index 000000000..43e1a1229 --- /dev/null +++ b/components/lib/themes/lara/splitter/index.js @@ -0,0 +1,10 @@ +export default { + root: { + background: '{content.background}', + borderColor: '{content.border.color}', + color: '{content.color}' + }, + gutter: { + background: '{content.border.color}' + } +}; diff --git a/components/lib/themes/lara/splitter/package.json b/components/lib/themes/lara/splitter/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/splitter/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/stepper/index.js b/components/lib/themes/lara/stepper/index.js new file mode 100644 index 000000000..95cc4fb82 --- /dev/null +++ b/components/lib/themes/lara/stepper/index.js @@ -0,0 +1,21 @@ +export default { + separator: { + background: '{content.border.color}', + activeBackground: '{primary.color}' + }, + itemTitle: { + color: '{text.color}', + activeColor: '{primary.color}' + }, + itemNumber: { + background: '{content.background}', + activeBackground: '{content.background}', + borderColor: '{content.border.color}', + color: '{text.muted.color}', + activeColor: '{primary.color}' + }, + panelContent: { + background: '{content.background}', + color: '{content.color}' + } +}; diff --git a/components/lib/themes/lara/stepper/package.json b/components/lib/themes/lara/stepper/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/stepper/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/steps/index.js b/components/lib/themes/lara/steps/index.js new file mode 100644 index 000000000..e113ada66 --- /dev/null +++ b/components/lib/themes/lara/steps/index.js @@ -0,0 +1,16 @@ +export default { + separator: { + background: '{content.border.color}' + }, + itemLabel: { + color: '{text.color}', + activeColor: '{primary.color}' + }, + itemNumber: { + background: '{content.background}', + activeBackground: '{content.background}', + borderColor: '{content.border.color}', + color: '{text.muted.color}', + activeColor: '{primary.color}' + } +}; diff --git a/components/lib/themes/lara/steps/package.json b/components/lib/themes/lara/steps/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/steps/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/tabmenu/index.js b/components/lib/themes/lara/tabmenu/index.js new file mode 100644 index 000000000..229336322 --- /dev/null +++ b/components/lib/themes/lara/tabmenu/index.js @@ -0,0 +1,12 @@ +export default { + tablist: { + background: '{content.background}', + borderColor: '{content.border.color}' + }, + itemLink: { + borderColor: '{content.border.color}', + activeBorderColor: '{primary.color}', + color: '{text.muted.color}', + hoverColor: '{text.color}' + } +}; diff --git a/components/lib/themes/lara/tabmenu/package.json b/components/lib/themes/lara/tabmenu/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/tabmenu/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/tabs/index.js b/components/lib/themes/lara/tabs/index.js new file mode 100644 index 000000000..00024c7bb --- /dev/null +++ b/components/lib/themes/lara/tabs/index.js @@ -0,0 +1,34 @@ +export default { + tabList: { + background: '{content.background}', + borderColor: '{content.border.color}' + }, + tab: { + borderColor: '{content.border.color}', + activeBorderColor: '{primary.color}', + color: '{text.muted.color}', + hoverColor: '{text.color}', + activeColor: '{primary.color}' + }, + tabPanel: { + background: '{content.background}', + color: '{content.color}' + }, + navButton: { + background: '{content.background}', + color: '{text.muted.color}', + hoverColor: '{text.color}' + }, + colorScheme: { + light: { + navButton: { + boxShadow: '0px 0px 10px 50px rgba(255, 255, 255, 0.6)' + } + }, + dark: { + navButton: { + boxShadow: '0px 0px 10px 50px color-mix(in srgb, {content.background}, transparent 50%)' + } + } + } +}; diff --git a/components/lib/themes/lara/tabs/package.json b/components/lib/themes/lara/tabs/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/tabs/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/tabview/index.js b/components/lib/themes/lara/tabview/index.js new file mode 100644 index 000000000..00024c7bb --- /dev/null +++ b/components/lib/themes/lara/tabview/index.js @@ -0,0 +1,34 @@ +export default { + tabList: { + background: '{content.background}', + borderColor: '{content.border.color}' + }, + tab: { + borderColor: '{content.border.color}', + activeBorderColor: '{primary.color}', + color: '{text.muted.color}', + hoverColor: '{text.color}', + activeColor: '{primary.color}' + }, + tabPanel: { + background: '{content.background}', + color: '{content.color}' + }, + navButton: { + background: '{content.background}', + color: '{text.muted.color}', + hoverColor: '{text.color}' + }, + colorScheme: { + light: { + navButton: { + boxShadow: '0px 0px 10px 50px rgba(255, 255, 255, 0.6)' + } + }, + dark: { + navButton: { + boxShadow: '0px 0px 10px 50px color-mix(in srgb, {content.background}, transparent 50%)' + } + } + } +}; diff --git a/components/lib/themes/lara/tabview/package.json b/components/lib/themes/lara/tabview/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/tabview/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/tag/index.js b/components/lib/themes/lara/tag/index.js new file mode 100644 index 000000000..77d23852b --- /dev/null +++ b/components/lib/themes/lara/tag/index.js @@ -0,0 +1,64 @@ +export default { + colorScheme: { + light: { + primary: { + background: '{primary.100}', + color: '{primary.700}' + }, + secondary: { + background: '{surface.100}', + color: '{surface.600}' + }, + success: { + background: '{green.100}', + color: '{green.700}' + }, + info: { + background: '{sky.100}', + color: '{sky.700}' + }, + warn: { + background: '{orange.100}', + color: '{orange.700}' + }, + danger: { + background: '{red.100}', + color: '{red.700}' + }, + contrast: { + background: '{surface.950}', + color: '{surface.0}' + } + }, + dark: { + primary: { + background: 'color-mix(in srgb, {primary.500}, transparent 84%)', + color: '{primary.300}' + }, + secondary: { + background: '{surface.800}', + color: '{surface.300}' + }, + success: { + background: 'color-mix(in srgb, {green.500}, transparent 84%)', + color: '{green.300}' + }, + info: { + background: 'color-mix(in srgb, {sky.500}, transparent 84%)', + color: '{sky.300}' + }, + warn: { + background: 'color-mix(in srgb, {orange.500}, transparent 84%)', + color: '{orange.300}' + }, + danger: { + background: 'color-mix(in srgb, {red.500}, transparent 84%)', + color: '{red.300}' + }, + contrast: { + background: '{surface.0}', + color: '{surface.950}' + } + } + } +}; diff --git a/components/lib/themes/lara/tag/package.json b/components/lib/themes/lara/tag/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/tag/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/terminal/index.js b/components/lib/themes/lara/terminal/index.js new file mode 100644 index 000000000..a679e9ad8 --- /dev/null +++ b/components/lib/themes/lara/terminal/index.js @@ -0,0 +1,7 @@ +export default { + root: { + background: '{form.field.background}', + borderColor: '{form.field.border.color}', + color: '{form.field.color}' + } +}; diff --git a/components/lib/themes/lara/terminal/package.json b/components/lib/themes/lara/terminal/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/terminal/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/textarea/index.js b/components/lib/themes/lara/textarea/index.js new file mode 100644 index 000000000..ee6501b37 --- /dev/null +++ b/components/lib/themes/lara/textarea/index.js @@ -0,0 +1,16 @@ +export default { + root: { + background: '{form.field.background}', + disabledBackground: '{form.field.disabled.background}', + filledBackground: '{form.field.filled.background}', + filledFocusBackground: '{form.field.filled.focus.background}', + borderColor: '{form.field.border.color}', + hoverBorderColor: '{form.field.hover.border.color}', + focusBorderColor: '{form.field.focus.border.color}', + invalidBorderColor: '{form.field.invalid.border.color}', + color: '{form.field.color}', + disabledColor: '{form.field.disabled.color}', + placeholderColor: '{form.field.placeholder.color}', + boxShadow: '{form.field.box.shadow}' + } +}; diff --git a/components/lib/themes/lara/textarea/package.json b/components/lib/themes/lara/textarea/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/textarea/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/tieredmenu/index.js b/components/lib/themes/lara/tieredmenu/index.js new file mode 100644 index 000000000..e0539fecb --- /dev/null +++ b/components/lib/themes/lara/tieredmenu/index.js @@ -0,0 +1,22 @@ +export default { + root: { + background: '{content.background}', + borderColor: '{content.border.color}', + color: '{content.color}' + }, + item: { + focusBackground: '{navigation.item.focus.background}', + color: '{navigation.item.color}', + focusColor: '{navigation.item.focus.color}', + icon: { + color: '{navigation.item.icon.color}', + hoverColor: '{navigation.item.icon.hover.color}' + } + }, + submenuItem: { + color: '{navigation.submenu.color}' + }, + separator: { + borderColor: '{content.border.color}' + } +}; diff --git a/components/lib/themes/lara/tieredmenu/package.json b/components/lib/themes/lara/tieredmenu/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/tieredmenu/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/timeline/index.js b/components/lib/themes/lara/timeline/index.js new file mode 100644 index 000000000..16f32a615 --- /dev/null +++ b/components/lib/themes/lara/timeline/index.js @@ -0,0 +1,10 @@ +export default { + eventMarker: { + background: '{content.background}', + borderColor: '{content.border.color}', + contentColor: '{primary.color}' + }, + eventConnector: { + color: '{content.border.color}' + } +}; diff --git a/components/lib/themes/lara/timeline/package.json b/components/lib/themes/lara/timeline/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/timeline/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/toast/index.js b/components/lib/themes/lara/toast/index.js new file mode 100644 index 000000000..24d048684 --- /dev/null +++ b/components/lib/themes/lara/toast/index.js @@ -0,0 +1,130 @@ +export default { + colorScheme: { + light: { + blur: '1.5px', + info: { + background: 'color-mix(in srgb, {blue.50}, transparent 5%)', + borderColor: '{blue.200}', + color: '{blue.600}', + detailColor: '{surface.700}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)', + closeButton: { + hoverBackground: '{blue.100}' + } + }, + success: { + background: 'color-mix(in srgb, {green.50}, transparent 5%)', + borderColor: '{green.200}', + color: '{green.600}', + detailColor: '{surface.700}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)', + closeButton: { + hoverBackground: '{green.100}' + } + }, + warn: { + background: 'color-mix(in srgb,{yellow.50}, transparent 5%)', + borderColor: '{yellow.200}', + color: '{yellow.600}', + detailColor: '{surface.700}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)', + closeButton: { + hoverBackground: '{yellow.100}' + } + }, + error: { + background: 'color-mix(in srgb, {red.50}, transparent 5%)', + borderColor: '{red.200}', + color: '{red.600}', + detailColor: '{surface.700}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)', + closeButton: { + hoverBackground: '{red.100}' + } + }, + secondary: { + background: '{surface.100}', + borderColor: '{surface.200}', + color: '{surface.600}', + detailColor: '{surface.700}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)', + closeButton: { + hoverBackground: '{surface.200}' + } + }, + contrast: { + background: '{surface.900}', + borderColor: '{surface.950}', + color: '{surface.50}', + detailColor: '{surface.0}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)', + closeButton: { + hoverBackground: '{surface.800}' + } + } + }, + dark: { + blur: '10px', + info: { + background: 'color-mix(in srgb, {blue.500}, transparent 84%)', + borderColor: 'color-mix(in srgb, {blue.700}, transparent 64%)', + color: '{blue.500}', + detailColor: '{surface.0}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)', + closeButton: { + hoverBackground: 'rgba(255, 255, 255, 0.05)' + } + }, + success: { + background: 'color-mix(in srgb, {green.500}, transparent 84%)', + borderColor: 'color-mix(in srgb, {green.700}, transparent 64%)', + color: '{green.500}', + detailColor: '{surface.0}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)', + closeButton: { + hoverBackground: 'rgba(255, 255, 255, 0.05)' + } + }, + warn: { + background: 'color-mix(in srgb, {yellow.500}, transparent 84%)', + borderColor: 'color-mix(in srgb, {yellow.700}, transparent 64%)', + color: '{yellow.500}', + detailColor: '{surface.0}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)', + closeButton: { + hoverBackground: 'rgba(255, 255, 255, 0.05)' + } + }, + error: { + background: 'color-mix(in srgb, {red.500}, transparent 84%)', + borderColor: 'color-mix(in srgb, {red.700}, transparent 64%)', + color: '{red.500}', + detailColor: '{surface.0}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)', + closeButton: { + hoverBackground: 'rgba(255, 255, 255, 0.05)' + } + }, + secondary: { + background: '{surface.800}', + borderColor: '{surface.700}', + color: '{surface.300}', + detailColor: '{surface.0}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)', + closeButton: { + hoverBackground: '{surface.700}' + } + }, + contrast: { + background: '{surface.0}', + borderColor: '{surface.100}', + color: '{surface.950}', + detailColor: '{surface.950}', + boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)', + closeButton: { + hoverBackground: '{surface.100}' + } + } + } + } +}; diff --git a/components/lib/themes/lara/toast/package.json b/components/lib/themes/lara/toast/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/toast/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/togglebutton/index.js b/components/lib/themes/lara/togglebutton/index.js new file mode 100644 index 000000000..94ce34b78 --- /dev/null +++ b/components/lib/themes/lara/togglebutton/index.js @@ -0,0 +1,44 @@ +export default { + colorScheme: { + light: { + root: { + background: '{surface.100}', + checkedBackground: '{surface.0}', + disabledBackground: '{form.field.disabled.background}', + borderColor: '{surface.100}', + disabledBorderColor: '{form.field.disabled.background}', + invalidBorderColor: '{form.field.invalid.border.color}', + color: '{surface.500}', + hoverColor: '{surface.700}', + checkedColor: '{surface.900}', + disabledColor: '{form.field.disabled.color}' + }, + icon: { + color: '{surface.500}', + hoverColor: '{surface.700}', + checkedColor: '{surface.900}', + disabledColor: '{form.field.disabled.color}' + } + }, + dark: { + root: { + background: '{surface.950}', + checkedBackground: '{surface.800}', + disabledBackground: '{form.field.disabled.background}', + borderColor: '{surface.950}', + disabledBorderColor: '{form.field.disabled.background}', + invalidBorderColor: '{form.field.invalid.border.color}', + color: '{surface.400}', + hoverColor: '{surface.300}', + checkedColor: '{surface.0}', + disabledColor: '{form.field.disabled.color}' + }, + icon: { + color: '{surface.400}', + hoverColor: '{surface.300}', + checkedColor: '{surface.0}', + disabledColor: '{form.field.disabled.color}' + } + } + } +}; diff --git a/components/lib/themes/lara/togglebutton/package.json b/components/lib/themes/lara/togglebutton/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/togglebutton/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/toggleswitch/index.js b/components/lib/themes/lara/toggleswitch/index.js new file mode 100644 index 000000000..fd33edf7c --- /dev/null +++ b/components/lib/themes/lara/toggleswitch/index.js @@ -0,0 +1,42 @@ +export default { + handle: { + borderRadius: '50%' + }, + root: { + borderRadius: '30px' + }, + colorScheme: { + light: { + root: { + background: '{surface.300}', + invalidBackground: '{red.400}', + hoverBackground: '{surface.400}', + checkedBackground: '{primary.500}', + checkedHoverBackground: '{primary.600}' + }, + handle: { + background: '{surface.0}', + hoverBackground: '{surface.0}', + checkedBackground: '{surface.0}', + checkedHoverBackground: '{surface.0}', + invalidBackground: '{surface.0}' + } + }, + dark: { + root: { + background: '{surface.700}', + invalidBackground: '{red.300}', + hoverBackground: '{surface.600}', + checkedBackground: '{primary.400}', + checkedHoverBackground: '{primary.300}' + }, + handle: { + background: '{surface.400}', + hoverBackground: '{surface.300}', + checkedBackground: '{surface.900}', + checkedHoverBackground: '{surface.900}', + invalidBackground: '{surface.900}' + } + } + } +}; diff --git a/components/lib/themes/lara/toggleswitch/package.json b/components/lib/themes/lara/toggleswitch/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/toggleswitch/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/toolbar/index.js b/components/lib/themes/lara/toolbar/index.js new file mode 100644 index 000000000..f6ad4d3ea --- /dev/null +++ b/components/lib/themes/lara/toolbar/index.js @@ -0,0 +1,7 @@ +export default { + root: { + background: '{content.background}', + borderColor: '{content.border.color}', + color: '{content.color}' + } +}; diff --git a/components/lib/themes/lara/toolbar/package.json b/components/lib/themes/lara/toolbar/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/toolbar/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/tooltip/index.js b/components/lib/themes/lara/tooltip/index.js new file mode 100644 index 000000000..95dd5cc6e --- /dev/null +++ b/components/lib/themes/lara/tooltip/index.js @@ -0,0 +1,16 @@ +export default { + colorScheme: { + light: { + root: { + background: '{surface.700}', + color: '{surface.0}' + } + }, + dark: { + root: { + background: '{surface.700}', + color: '{surface.0}' + } + } + } +}; diff --git a/components/lib/themes/lara/tooltip/package.json b/components/lib/themes/lara/tooltip/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/tooltip/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/tree/index.js b/components/lib/themes/lara/tree/index.js new file mode 100644 index 000000000..3e08dc3e5 --- /dev/null +++ b/components/lib/themes/lara/tree/index.js @@ -0,0 +1,24 @@ +export default { + root: { + background: '{content.background}', + color: '{content.color}' + }, + node: { + hoverBackground: '{content.hover.background}', + color: '{text.color}', + hoverColor: '{text.hover.color}' + }, + nodeIcon: { + color: '{text.muted.color}', + hoverColor: '{text.hover.muted.color}' + }, + nodeToggleButton: { + hoverBackground: '{content.hover.background}', + highlightHoverBackground: '{content.background}', + color: '{text.muted.color}', + hoverColor: '{text.hover.muted.color}' + }, + filterIcon: { + color: '{surface.400}' + } +}; diff --git a/components/lib/themes/lara/tree/package.json b/components/lib/themes/lara/tree/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/tree/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/treeselect/index.js b/components/lib/themes/lara/treeselect/index.js new file mode 100644 index 000000000..602e2d12b --- /dev/null +++ b/components/lib/themes/lara/treeselect/index.js @@ -0,0 +1,24 @@ +export default { + root: { + background: '{form.field.background}', + disabledBackground: '{form.field.disabled.background}', + filledBackground: '{form.field.filled.background}', + filledFocusBackground: '{form.field.filled.focus.background}', + borderColor: '{form.field.border.color}', + hoverBorderColor: '{form.field.hover.border.color}', + focusBorderColor: '{form.field.focus.border.color}', + invalidBorderColor: '{form.field.invalid.border.color}', + color: '{form.field.color}', + disabledColor: '{form.field.disabled.color}', + placeholderColor: '{form.field.placeholder.color}', + boxShadow: '{form.field.box.shadow}' + }, + dropdown: { + color: '{form.field.icon.color}' + }, + overlay: { + background: '{overlay.select.background}', + borderColor: '{overlay.select.border.color}', + color: '{overlay.select.color}' + } +}; diff --git a/components/lib/themes/lara/treeselect/package.json b/components/lib/themes/lara/treeselect/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/treeselect/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/components/lib/themes/lara/treetable/index.js b/components/lib/themes/lara/treetable/index.js new file mode 100644 index 000000000..dfee366ca --- /dev/null +++ b/components/lib/themes/lara/treetable/index.js @@ -0,0 +1,68 @@ +export default { + header: { + background: '{content.background}', + borderColor: '{datatable.border.color}', + color: '{content.color}' + }, + headerCell: { + background: '{content.background}', + hoverBackground: '{content.hover.background}', + borderColor: '{datatable.border.color}', + color: '{content.color}', + hoverColor: '{content.hover.color}' + }, + row: { + background: '{content.background}', + hoverBackground: '{content.hover.background}', + color: '{content.color}', + hoverColor: '{content.hover.color}' + }, + bodyCell: { + borderColor: '{datatable.border.color}' + }, + footerCell: { + background: '{content.background}', + borderColor: '{datatable.border.color}', + color: '{content.color}' + }, + footer: { + background: '{content.background}', + borderColor: '{datatable.border.color}', + color: '{content.color}' + }, + resizeIndicatorColor: '{primary.color}', + sortIcon: { + color: '{text.muted.color}', + hoverColor: '{text.hover.muted.color}' + }, + nodeToggleButton: { + hoverBackground: '{content.hover.background}', + highlightHoverBackground: '{content.background}', + color: '{text.color}', + hoverColor: '{text.muted.color}' + }, + colorScheme: { + light: { + root: { + borderColor: '{content.border.color}' + }, + row: { + stripedBackground: '{surface.50}' + }, + bodyCell: { + selectedBorderColor: '{primary.100}' + } + }, + dark: { + root: { + borderColor: '{surface.800}' + }, + row: { + stripedBackground: '{surface.950}' + }, + bodyCell: { + selectedBorderColor: '{primary.900}' + } + } + } +}; diff --git a/components/lib/themes/lara/treetable/package.json b/components/lib/themes/lara/treetable/package.json new file mode 100644 index 000000000..f8e9d7ae0 --- /dev/null +++ b/components/lib/themes/lara/treetable/package.json @@ -0,0 +1,6 @@ +{ + "main": "./index.cjs.js", + "module": "./index.esm.js", + "unpkg": "./index.min.js", + "types": "./index.d.ts" +} diff --git a/layouts/AppConfigurator.vue b/layouts/AppConfigurator.vue index e9147ea68..aaa739afd 100755 --- a/layouts/AppConfigurator.vue +++ b/layouts/AppConfigurator.vue @@ -8,6 +8,7 @@ v-for="primaryColor of primaryColors" :key="primaryColor.name" type="button" + :title="primaryColor.name" @click="updateColors('primary', primaryColor)" :class="{ 'active-color': selectedPrimaryColor === primaryColor.name }" :style="{ backgroundColor: `${primaryColor.name === 'noir' ? 'var(--text-color)' : primaryColor.palette['500']}` }" @@ -21,12 +22,19 @@ v-for="surface of surfaces" :key="surface.name" type="button" + :title="surface.name" @click="updateColors('surface', surface)" :class="{ 'active-color': selectedSurfaceColor === surface.name }" :style="{ backgroundColor: `${surface.palette['500']}` }" > +
+
+ Presets + +
+
Ripple @@ -39,14 +47,19 @@