0
0
Fork 0
mirror of https://github.com/VueTubeApp/VueTube synced 2025-01-03 14:11:08 +00:00

theme variables cleanup

This commit is contained in:
Nikita Krupin 2022-03-21 20:52:45 -04:00
parent ad9d916627
commit 0fa979684a
7 changed files with 24 additions and 26 deletions

View file

@ -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>

View file

@ -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" />

View file

@ -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;

View file

@ -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",
},
},

View file

@ -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 {

View file

@ -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(

View file

@ -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 }}