Initial Version
This commit is contained in:
root
148
core/src/plugins/vuetify/defaults.ts
Normal file
148
core/src/plugins/vuetify/defaults.ts
Normal file
@@ -0,0 +1,148 @@
|
||||
export default {
|
||||
IconBtn: {
|
||||
icon: true,
|
||||
color: 'default',
|
||||
variant: 'text',
|
||||
},
|
||||
VAlert: {
|
||||
VBtn: {
|
||||
color: undefined,
|
||||
},
|
||||
},
|
||||
VAvatar: {
|
||||
// ℹ️ Remove after next release
|
||||
variant: 'flat',
|
||||
},
|
||||
VBadge: {
|
||||
// set v-badge default color to primary
|
||||
color: 'primary',
|
||||
},
|
||||
VBtn: {
|
||||
// set v-btn default color to primary
|
||||
color: 'primary',
|
||||
style: 'text-transform: none;',
|
||||
},
|
||||
VCard: {
|
||||
rounded: 'lg',
|
||||
elevation: 2,
|
||||
},
|
||||
VChip: {
|
||||
elevation: 0,
|
||||
},
|
||||
VMenu: {
|
||||
offset: '2px',
|
||||
},
|
||||
VPagination: {
|
||||
density: 'comfortable',
|
||||
showFirstLastPage: true,
|
||||
variant: 'tonal',
|
||||
},
|
||||
VTabs: {
|
||||
// set v-tabs default color to primary
|
||||
color: 'primary',
|
||||
VSlideGroup: {
|
||||
showArrows: true,
|
||||
},
|
||||
},
|
||||
VTooltip: {
|
||||
// set v-tooltip default location to top
|
||||
location: 'top',
|
||||
},
|
||||
VCheckboxBtn: {
|
||||
color: 'primary',
|
||||
},
|
||||
VCheckbox: {
|
||||
// set v-checkbox default color to primary
|
||||
color: 'primary',
|
||||
density: 'comfortable',
|
||||
hideDetails: 'auto',
|
||||
},
|
||||
VRadioGroup: {
|
||||
color: 'primary',
|
||||
density: 'comfortable',
|
||||
hideDetails: 'auto',
|
||||
},
|
||||
VRadio: {
|
||||
density: 'comfortable',
|
||||
hideDetails: 'auto',
|
||||
},
|
||||
VSelect: {
|
||||
variant: 'outlined',
|
||||
color: 'primary',
|
||||
hideDetails: 'auto',
|
||||
density: 'comfortable',
|
||||
},
|
||||
VRangeSlider: {
|
||||
// set v-range-slider default color to primary
|
||||
color: 'primary',
|
||||
thumbLabel: true,
|
||||
hideDetails: 'auto',
|
||||
trackSize: 6,
|
||||
thumbSize: 22,
|
||||
elevation: 4,
|
||||
},
|
||||
VRating: {
|
||||
// set v-rating default color to primary
|
||||
activeColor: 'warning',
|
||||
color: 'disabled',
|
||||
},
|
||||
VProgressCircular: {
|
||||
// set v-progress-circular default color to primary
|
||||
color: 'primary',
|
||||
},
|
||||
VProgressLinear: {
|
||||
color: 'primary',
|
||||
},
|
||||
VSlider: {
|
||||
// set v-slider default color to primary
|
||||
color: 'primary',
|
||||
trackSize: 6,
|
||||
hideDetails: 'auto',
|
||||
thumbSize: 22,
|
||||
elevation: 4,
|
||||
},
|
||||
VSnackbar: {
|
||||
VBtn: {
|
||||
size: 'small',
|
||||
},
|
||||
},
|
||||
VTextField: {
|
||||
variant: 'outlined',
|
||||
density: 'comfortable',
|
||||
color: 'primary',
|
||||
hideDetails: 'auto',
|
||||
},
|
||||
VAutocomplete: {
|
||||
variant: 'outlined',
|
||||
color: 'primary',
|
||||
density: 'comfortable',
|
||||
hideDetails: 'auto',
|
||||
},
|
||||
VCombobox: {
|
||||
variant: 'outlined',
|
||||
color: 'primary',
|
||||
hideDetails: 'auto',
|
||||
density: 'comfortable',
|
||||
},
|
||||
VFileInput: {
|
||||
variant: 'outlined',
|
||||
color: 'primary',
|
||||
hideDetails: 'auto',
|
||||
density: 'comfortable',
|
||||
},
|
||||
VTextarea: {
|
||||
variant: 'outlined',
|
||||
color: 'primary',
|
||||
hideDetails: 'auto',
|
||||
density: 'comfortable',
|
||||
},
|
||||
VSwitch: {
|
||||
// set v-switch default color to primary
|
||||
inset: true,
|
||||
color: 'primary',
|
||||
hideDetails: 'auto',
|
||||
},
|
||||
VNavigationDrawer: {
|
||||
touchless: true,
|
||||
},
|
||||
}
|
||||
14
core/src/plugins/vuetify/icons.ts
Normal file
14
core/src/plugins/vuetify/icons.ts
Normal file
@@ -0,0 +1,14 @@
|
||||
import type { IconAliases } from 'vuetify'
|
||||
import { aliases as mdiAliases, mdi } from 'vuetify/iconsets/mdi'
|
||||
|
||||
const aliases: Partial<IconAliases> = {
|
||||
...mdiAliases,
|
||||
}
|
||||
|
||||
export const icons = {
|
||||
defaultSet: 'mdi',
|
||||
aliases,
|
||||
sets: {
|
||||
mdi,
|
||||
},
|
||||
}
|
||||
24
core/src/plugins/vuetify/index.ts
Normal file
24
core/src/plugins/vuetify/index.ts
Normal file
@@ -0,0 +1,24 @@
|
||||
import { createVuetify } from 'vuetify'
|
||||
import { VBtn } from 'vuetify/components/VBtn'
|
||||
import * as components from 'vuetify/components'
|
||||
import * as directives from 'vuetify/directives'
|
||||
import defaults from './defaults'
|
||||
import { icons } from './icons'
|
||||
import { themes } from './theme'
|
||||
|
||||
// Styles
|
||||
import 'vuetify/styles'
|
||||
|
||||
export default createVuetify({
|
||||
components,
|
||||
directives,
|
||||
aliases: {
|
||||
IconBtn: VBtn,
|
||||
},
|
||||
defaults,
|
||||
icons,
|
||||
theme: {
|
||||
defaultTheme: 'light',
|
||||
themes,
|
||||
},
|
||||
})
|
||||
144
core/src/plugins/vuetify/theme.ts
Normal file
144
core/src/plugins/vuetify/theme.ts
Normal file
@@ -0,0 +1,144 @@
|
||||
import type { ThemeDefinition } from 'vuetify'
|
||||
|
||||
export const staticPrimaryColor = '#6366F1'
|
||||
export const staticPrimaryDarkenColor = '#4F46E5'
|
||||
|
||||
export const themes: Record<string, ThemeDefinition> = {
|
||||
light: {
|
||||
dark: false,
|
||||
colors: {
|
||||
// Primary brand colors - Modern indigo
|
||||
'primary': staticPrimaryColor,
|
||||
'on-primary': '#FFFFFF',
|
||||
'primary-darken-1': staticPrimaryDarkenColor,
|
||||
'primary-lighten-1': '#818CF8',
|
||||
|
||||
// Secondary - Purple accent
|
||||
'secondary': '#8B5CF6',
|
||||
'secondary-darken-1': '#7C3AED',
|
||||
'secondary-lighten-1': '#A78BFA',
|
||||
'on-secondary': '#FFFFFF',
|
||||
|
||||
// Semantic colors
|
||||
'success': '#10B981',
|
||||
'on-success': '#FFFFFF',
|
||||
'info': '#3B82F6',
|
||||
'on-info': '#FFFFFF',
|
||||
'warning': '#F59E0B',
|
||||
'on-warning': '#FFFFFF',
|
||||
'error': '#EF4444',
|
||||
'on-error': '#FFFFFF',
|
||||
|
||||
// Surface & backgrounds
|
||||
'background': '#F8FAFC',
|
||||
'on-background': '#0F172A',
|
||||
'surface': '#FFFFFF',
|
||||
'on-surface': '#0F172A',
|
||||
'surface-bright': '#FFFFFF',
|
||||
'surface-variant': '#F1F5F9',
|
||||
'on-surface-variant': '#64748B',
|
||||
|
||||
// Grey scale
|
||||
'grey': '#64748B',
|
||||
'grey-darken-1': '#475569',
|
||||
'grey-lighten-1': '#94A3B8',
|
||||
'grey-lighten-2': '#CBD5E1',
|
||||
'grey-lighten-3': '#E2E8F0',
|
||||
'grey-lighten-4': '#F1F5F9',
|
||||
'grey-lighten-5': '#F8FAFC',
|
||||
|
||||
// Component specific
|
||||
'perfect-scrollbar-thumb': '#CBD5E1',
|
||||
'track-bg': '#F1F5F9',
|
||||
},
|
||||
|
||||
variables: {
|
||||
'border-color': '#E2E8F0',
|
||||
'border-opacity': 0.12,
|
||||
'high-emphasis-opacity': 0.87,
|
||||
'medium-emphasis-opacity': 0.60,
|
||||
'disabled-opacity': 0.38,
|
||||
'idle-opacity': 0.04,
|
||||
'hover-opacity': 0.04,
|
||||
'focus-opacity': 0.12,
|
||||
'selected-opacity': 0.08,
|
||||
'activated-opacity': 0.12,
|
||||
'pressed-opacity': 0.12,
|
||||
'dragged-opacity': 0.08,
|
||||
'theme-kbd': '#212529',
|
||||
'theme-on-kbd': '#FFFFFF',
|
||||
'theme-code': '#F5F5F5',
|
||||
'theme-on-code': '#000000',
|
||||
},
|
||||
},
|
||||
|
||||
dark: {
|
||||
dark: true,
|
||||
colors: {
|
||||
// Primary brand colors - Lighter shades for dark mode
|
||||
'primary': '#818CF8',
|
||||
'on-primary': '#FFFFFF',
|
||||
'primary-darken-1': '#6366F1',
|
||||
'primary-lighten-1': '#A5B4FC',
|
||||
|
||||
// Secondary - Purple accent
|
||||
'secondary': '#A78BFA',
|
||||
'secondary-darken-1': '#8B5CF6',
|
||||
'secondary-lighten-1': '#C4B5FD',
|
||||
'on-secondary': '#FFFFFF',
|
||||
|
||||
// Semantic colors - Adjusted for dark mode
|
||||
'success': '#34D399',
|
||||
'on-success': '#FFFFFF',
|
||||
'info': '#60A5FA',
|
||||
'on-info': '#FFFFFF',
|
||||
'warning': '#FBBF24',
|
||||
'on-warning': '#FFFFFF',
|
||||
'error': '#F87171',
|
||||
'on-error': '#FFFFFF',
|
||||
|
||||
// Surface & backgrounds - Dark slate palette
|
||||
'background': '#0F172A',
|
||||
'on-background': '#F1F5F9',
|
||||
'surface': '#1E293B',
|
||||
'on-surface': '#F1F5F9',
|
||||
'surface-bright': '#334155',
|
||||
'surface-variant': '#1E293B',
|
||||
'on-surface-variant': '#94A3B8',
|
||||
|
||||
// Grey scale
|
||||
'grey': '#94A3B8',
|
||||
'grey-darken-1': '#CBD5E1',
|
||||
'grey-lighten-1': '#64748B',
|
||||
'grey-lighten-2': '#475569',
|
||||
'grey-lighten-3': '#334155',
|
||||
'grey-lighten-4': '#1E293B',
|
||||
'grey-lighten-5': '#0F172A',
|
||||
|
||||
// Component specific
|
||||
'perfect-scrollbar-thumb': '#475569',
|
||||
'track-bg': '#334155',
|
||||
},
|
||||
|
||||
variables: {
|
||||
'border-color': '#334155',
|
||||
'border-opacity': 0.12,
|
||||
'high-emphasis-opacity': 0.87,
|
||||
'medium-emphasis-opacity': 0.60,
|
||||
'disabled-opacity': 0.38,
|
||||
'idle-opacity': 0.10,
|
||||
'hover-opacity': 0.08,
|
||||
'focus-opacity': 0.12,
|
||||
'selected-opacity': 0.12,
|
||||
'activated-opacity': 0.16,
|
||||
'pressed-opacity': 0.14,
|
||||
'dragged-opacity': 0.10,
|
||||
'theme-kbd': '#212529',
|
||||
'theme-on-kbd': '#FFFFFF',
|
||||
'theme-code': '#343434',
|
||||
'theme-on-code': '#CCCCCC',
|
||||
},
|
||||
},
|
||||
}
|
||||
|
||||
export default themes
|
||||
Reference in New Issue
Block a user