Change main theme colors

This commit is contained in:
2023-04-20 21:03:41 +02:00
parent c1e990e4ee
commit a3d86dda60
2 changed files with 35 additions and 15 deletions

View File

@@ -1,6 +1,7 @@
import { createVuetify, ThemeDefinition } from 'vuetify'
import * as components from 'vuetify/components'
import * as directives from 'vuetify/directives'
import { md3 } from 'vuetify/blueprints'
import '@mdi/font/css/materialdesignicons.css'
import { mdi } from 'vuetify/iconsets/mdi'
import { brands } from '~/iconsets/brands'
@@ -12,27 +13,20 @@ const myCustomDarkTheme: ThemeDefinition = {
colors: {
background: '#0A192F',
backgroundSecondary: '#112240',
primary: '#64FFDA',
primary: '#00DC82',
// primary: '#64FFDA',
secondary: '#8892B0',
"on-background": '#CCD6F6',
"on-backgroundSecondary": '#CCD6F6',
accent: colors.grey.darken3,
secondary: colors.amber.darken3,
// secondary: colors.amber.darken3,
info: colors.teal.lighten1,
warning: colors.amber.base,
error: colors.deepOrange.accent4,
success: colors.green.accent3
}
// Bert
/* dark: {
background: '#0B0C10',
primary: '#66FCF1',
accent: colors.grey.darken3,
secondary: colors.amber.darken3,
info: colors.teal.lighten1,
warning: colors.amber.base,
error: colors.deepOrange.accent4,
success: colors.green.accent3,
},
// Nuxt Default
dark: {
/* colors: {
primary: colors.blue.darken2,
accent: colors.grey.darken3,
secondary: colors.amber.darken3,
@@ -47,6 +41,12 @@ export default defineNuxtPlugin(nuxtApp => {
const vuetify = createVuetify({
components,
directives,
blueprint: md3,
defaults: {
VCard: {
elevation: 0,
},
},
theme: {
// customVariables: ['~/assets/variables.scss'],
defaultTheme: 'myCustomDarkTheme',
@@ -67,4 +67,5 @@ export default defineNuxtPlugin(nuxtApp => {
// Define global variables
nuxtApp.provide('myName', 'Manuel Veigel')
nuxtApp.provide('myEmail', 'maveigel@gmail.com')
})