mirror of
https://github.com/VueTubeApp/VueTube
synced 2025-01-03 14:11:08 +00:00
theme variables cleanup
This commit is contained in:
parent
ad9d916627
commit
0fa979684a
7 changed files with 24 additions and 26 deletions
|
@ -2,7 +2,7 @@
|
|||
<v-bottom-navigation
|
||||
v-model="tabSelection"
|
||||
shift
|
||||
class="bottomNav py-4 accent2"
|
||||
class="bottomNav py-4 accent"
|
||||
>
|
||||
<v-btn
|
||||
v-for="(item, i) in tabs"
|
||||
|
@ -15,7 +15,7 @@
|
|||
<span v-text="item.name" />
|
||||
<v-icon
|
||||
:color="tabSelection == i ? 'primary' : 'grey'"
|
||||
:class="tabSelection == i ? 'tab primaryAlt' : ''"
|
||||
:class="tabSelection == i ? 'tab primary lighten-2' : ''"
|
||||
v-text="item.icon"
|
||||
/>
|
||||
</v-btn>
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<v-card
|
||||
style="height: 4rem !important; display: flex; box-shadow: none !important"
|
||||
color="accent2"
|
||||
color="accent"
|
||||
class="topNav rounded-0 pa-3"
|
||||
>
|
||||
<h3 v-show="!search" class="my-auto ml-4" v-text="page" />
|
||||
|
|
|
@ -8,7 +8,7 @@
|
|||
@text-changed="textChanged"
|
||||
/>
|
||||
|
||||
<div class="accent2" style="height: 100%; margin-top: 4rem">
|
||||
<div class="accent" style="height: 100%; margin-top: 4rem">
|
||||
<div
|
||||
v-show="!search"
|
||||
class="background"
|
||||
|
@ -31,7 +31,7 @@
|
|||
|
||||
<div
|
||||
v-show="search"
|
||||
class="accent2"
|
||||
class="accent"
|
||||
style="
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
|
|
|
@ -54,19 +54,21 @@ export default {
|
|||
options: { customProperties: true },
|
||||
themes: {
|
||||
light: {
|
||||
primary: colors.red.lighten2,
|
||||
primaryAlt: colors.red.lighten4,
|
||||
accent: "#CD201F",
|
||||
accent2: "#fff",
|
||||
primary: {
|
||||
base: colors.red.lighten2,
|
||||
lighten2: colors.red.lighten4,
|
||||
},
|
||||
background: "#fff",
|
||||
accent: "#fff",
|
||||
info: "#000",
|
||||
},
|
||||
dark: {
|
||||
primary: colors.red.darken2, //colors.blue.darken2
|
||||
primaryAlt: "#533",
|
||||
accent: "#222",
|
||||
accent2: "#222",
|
||||
primary: {
|
||||
base: colors.red.darken2,
|
||||
lighten2: "#533",
|
||||
},
|
||||
background: "#333",
|
||||
accent: "#222",
|
||||
info: "#fff",
|
||||
},
|
||||
},
|
||||
|
|
|
@ -42,11 +42,11 @@ export default {
|
|||
|
||||
if (isOled == "true") {
|
||||
(this.$vuetify.theme.themes.dark.accent = "#000"),
|
||||
(this.$vuetify.theme.themes.dark.accent2 = "#000"),
|
||||
(this.$vuetify.theme.themes.dark.accent = "#000"),
|
||||
(this.$vuetify.theme.themes.dark.background = "#000");
|
||||
} else {
|
||||
(this.$vuetify.theme.themes.dark.accent = "#222"),
|
||||
(this.$vuetify.theme.themes.dark.accent2 = "#222"),
|
||||
(this.$vuetify.theme.themes.dark.accent = "#222"),
|
||||
(this.$vuetify.theme.themes.dark.background = "#333");
|
||||
}
|
||||
} else {
|
||||
|
|
|
@ -63,7 +63,7 @@ export default {
|
|||
|
||||
watch: {
|
||||
accentColor: function (val) {
|
||||
this.$vuetify.theme.currentTheme.primary = val;
|
||||
this.$vuetify.theme.currentTheme.primary.base = val;
|
||||
let primaryAlt = this.$vuetube.hexToRgb(val);
|
||||
|
||||
let rgbEdit = 130; //Light Mode
|
||||
|
@ -81,12 +81,12 @@ export default {
|
|||
primaryAlt.b
|
||||
);
|
||||
|
||||
this.$vuetify.theme.currentTheme.primaryAlt = primaryAlt;
|
||||
this.$vuetify.theme.currentTheme.primary.lighten2 = primaryAlt;
|
||||
},
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.accentColor = this.$vuetify.theme.themes.dark.primary;
|
||||
this.accentColor = this.$vuetify.theme.themes.dark.primary.base;
|
||||
this.roblox = localStorage.getItem("roblox") === "true";
|
||||
},
|
||||
|
||||
|
@ -94,17 +94,13 @@ export default {
|
|||
amoled() {
|
||||
this.$vuetify.theme.themes.dark.background === "#000"
|
||||
? ((this.$vuetify.theme.themes.dark.accent = "#222"),
|
||||
(this.$vuetify.theme.themes.dark.accent2 = "#222"),
|
||||
(this.$vuetify.theme.themes.dark.accent = "#222"),
|
||||
(this.$vuetify.theme.themes.dark.background = "#333"),
|
||||
localStorage.setItem("isOled", false))
|
||||
: ((this.$vuetify.theme.themes.dark.accent = "#000"),
|
||||
(this.$vuetify.theme.themes.dark.accent2 = "#000"),
|
||||
(this.$vuetify.theme.themes.dark.accent = "#000"),
|
||||
(this.$vuetify.theme.themes.dark.background = "#000"),
|
||||
localStorage.setItem("isOled", true));
|
||||
// doesn't work 😭
|
||||
// console.log(document.getElementsByClassName('v-application--wrap')[0])
|
||||
// console.log(document.getElementsByClassName('v-application--wrap')[0].style)
|
||||
// document.getElementsByClassName('v-application--wrap')[0].style.backgroundColor = "#000000 !important"
|
||||
},
|
||||
saveTheme(isDark) {
|
||||
this.$vuetube.statusBar.setBackground(
|
||||
|
|
|
@ -46,7 +46,7 @@
|
|||
|
||||
<v-bottom-sheet
|
||||
v-model="showMore"
|
||||
color="accent2"
|
||||
color="accent"
|
||||
style="z-index: 9999999"
|
||||
>
|
||||
<v-sheet style="padding: 1em">
|
||||
|
@ -59,7 +59,7 @@
|
|||
</div>
|
||||
</v-sheet>
|
||||
</v-bottom-sheet>
|
||||
<!-- <v-bottom-sheet v-model="share" color="accent2" style="z-index: 9999999">
|
||||
<!-- <v-bottom-sheet v-model="share" color="accent" style="z-index: 9999999">
|
||||
<v-sheet style="padding: 1em">
|
||||
<div class="scroll-y">
|
||||
{{ description }}
|
||||
|
|
Loading…
Reference in a new issue