feat 新增紫色主题

This commit is contained in:
jxxghp
2023-09-05 10:15:20 +08:00
parent a70e467b69
commit 985d1baff5
3 changed files with 58 additions and 4 deletions

View File

@@ -10,6 +10,10 @@ const themes: ThemeSwitcherTheme[] = [
name: 'dark',
icon: 'mdi-weather-night',
},
{
name: 'purple',
icon: 'mdi-brightness-4',
},
]
</script>

View File

@@ -57,7 +57,7 @@ const theme: VuetifyOptions['theme'] = {
dark: {
dark: true,
colors: {
'primary': '#9155FD',
'primary': '#6E66ED',
'secondary': '#8A8D93',
'on-secondary': '#fff',
'success': '#56CA00',
@@ -104,6 +104,57 @@ const theme: VuetifyOptions['theme'] = {
'shadow-key-ambient-opacity': 'rgba(20, 18, 33, 0.04)',
},
},
purple: {
dark: true,
colors: {
'primary': '#9155FD',
'secondary': '#8A8D93',
'on-secondary': '#fff',
'success': '#56CA00',
'info': '#16B1FF',
'warning': '#FFB400',
'error': '#FF4C51',
'on-primary': '#FFFFFF',
'on-success': '#FFFFFF',
'on-warning': '#FFFFFF',
'background': '#28243D',
'on-background': '#E7E3FC',
'surface': '#312D4B',
'on-surface': '#E7E3FC',
'grey-50': '#2A2E42',
'grey-100': '#474360',
'grey-200': '#4A5072',
'grey-300': '#5E6692',
'grey-400': '#7983BB',
'grey-500': '#8692D0',
'grey-600': '#AAB3DE',
'grey-700': '#B6BEE3',
'grey-800': '#CFD3EC',
'grey-900': '#E7E9F6',
'perfect-scrollbar-thumb': '#4A5072',
'skin-bordered-background': '#312d4b',
'skin-bordered-surface': '#312d4b',
},
variables: {
'code-color': '#d400ff',
'overlay-scrim-background': '#2C2942',
'overlay-scrim-opacity': 0.6,
'hover-opacity': 0.04,
'focus-opacity': 0.1,
'selected-opacity': 0.12,
'activated-opacity': 0.1,
'pressed-opacity': 0.14,
'dragged-opacity': 0.1,
'border-color': '#E7E3FC',
'table-header-background': '#3D3759',
'custom-background': '#373452',
// Shadows
'shadow-key-umbra-opacity': 'rgba(20, 18, 33, 0.08)',
'shadow-key-penumbra-opacity': 'rgba(20, 18, 33, 0.12)',
'shadow-key-ambient-opacity': 'rgba(20, 18, 33, 0.04)',
},
},
},
}

View File

@@ -3,14 +3,13 @@
@tailwind components;
@tailwind utilities;
#nprogress .bar {
background: #7D34FD !important;
background: rgb(var(--v-theme-primary)) !important;
top: env(safe-area-inset-top) !important;
}
#nprogress .peg {
box-shadow: 0 0 10px #7D34FD, 0 0 5px #7D34FD !important;
box-shadow: 0 0 10px rgb(var(--v-theme-primary)), 0 0 5px rgb(var(--v-theme-primary)) !important;
-webkit-transform: rotate(0deg) translate(0px, -1px);
-ms-transform: rotate(0deg) translate(0px, -1px);
transform: rotate(0deg) translate(0px, -1px);