diff --git a/arches/app/media/js/utils/create-vue-application.js b/arches/app/media/js/utils/create-vue-application.js index d5dc97e9ef9..fcd36564d45 100644 --- a/arches/app/media/js/utils/create-vue-application.js +++ b/arches/app/media/js/utils/create-vue-application.js @@ -7,16 +7,60 @@ import StyleClass from 'primevue/styleclass'; import ToastService from 'primevue/toastservice'; import Tooltip from 'primevue/tooltip'; -import Aura from '@primevue/themes/aura'; - +import { definePreset } from '@primevue/themes'; import { createApp } from 'vue'; import { createGettext } from "vue3-gettext"; +import Aura from '@primevue/themes/aura'; import arches from 'arches'; +export const ArchesPreset = definePreset(Aura, { + primitive: { + sky: { + 950: '#2d3c4b', // matches arches sidebar + }, + }, + semantic: { + primary: { + 50: '{sky.50}', + 100: '{sky.100}', + 200: '{sky.200}', + 300: '{sky.300}', + 400: '{sky.400}', + 500: '{sky.500}', + 600: '{sky.600}', + 700: '{sky.700}', + 800: '{sky.800}', + 900: '{sky.900}', + 950: '{sky.950}', + }, + }, + components: { + button: { + root: { + label: { + fontWeight: 600, + }, + }, + }, + datatable: { + column: { + title: { + fontWeight: 600, + }, + }, + }, + splitter: { + handle: { + background: '{surface.500}', + }, + }, + }, +}); + const DEFAULT_THEME = { theme: { - preset: Aura, + preset: ArchesPreset, options: { prefix: 'p', darkModeSelector: 'system', diff --git a/releases/8.0.0.md b/releases/8.0.0.md index ea7ec836576..445ddbfc9ee 100644 --- a/releases/8.0.0.md +++ b/releases/8.0.0.md @@ -4,6 +4,7 @@ Arches 8.0.0 Release Notes ### Major enhancements - 9613 Adds editable_future_graphs and the ability to update Graphs without unpublishing. - 11042 Adds `ResourceInstanceLifecycle`s and `ResourceInstanceLifecycleState`s +- Add token-based CSS theming [#11262](https://github.com/archesproject/arches/issues/11262) ### Additional highlights