0
0
Fork 0
mirror of https://github.com/VueTubeApp/VueTube synced 2024-11-07 20:15:05 +00:00
VueTube/NUXT/pages/settings.vue

71 lines
2 KiB
Vue
Raw Normal View History

2022-02-24 19:55:29 +00:00
<template>
<div class="mainContainer pt-1">
2022-02-24 19:55:29 +00:00
2022-03-02 15:57:29 +00:00
<v-card class="pb-5">
<v-card-title>Theme</v-card-title>
2022-02-25 00:33:03 +00:00
<v-row class="ml-3 mr-6">
<section class="row">
<v-switch
v-model="$vuetify.theme.dark"
label="Dark Theme"
hint="Bravo Six, Going Dark."
persistent-hint
inset
/>
</section>
<v-btn v-if="$vuetify.theme.dark" text tile class="white--text black" @click="amoled" >
2022-03-02 15:57:29 +00:00
{{
this.$vuetify.theme.themes.dark.background === '#000'
? 'LCD'
2022-02-25 00:33:03 +00:00
: 'OLED'
}}
2022-03-02 15:57:29 +00:00
<v-icon :size="this.$vuetify.theme.themes.dark.background === '#000' ? '.5rem' : '.9rem'" class="ml-2">mdi-brightness-2</v-icon>
</v-btn>
2022-02-25 00:33:03 +00:00
</v-row>
</v-card>
2022-02-24 19:55:29 +00:00
2022-02-24 22:29:34 +00:00
<v-card>
<v-card-title>Debug</v-card-title>
<section>
<div style="color: #999;">This is just a temporary section for messing with the tool while it's still being worked on :)</div>
<v-btn to="/watch">Open Watch Page</v-btn>
</section>
</v-card>
2022-02-24 19:55:29 +00:00
</div>
</template>
2022-02-25 00:33:03 +00:00
<script>
export default {
methods: {
amoled () {
2022-03-02 15:57:29 +00:00
this.$vuetify.theme.themes.dark.background === '#000' ? (
2022-03-02 17:35:38 +00:00
this.$vuetify.theme.themes.dark.accent = '#222',
2022-03-02 18:57:11 +00:00
this.$vuetify.theme.themes.dark.accent2 = '#222',
this.$vuetify.theme.themes.dark.background = '#333'
2022-02-25 00:33:03 +00:00
) : (
2022-03-02 15:57:29 +00:00
this.$vuetify.theme.themes.dark.accent = '#000',
2022-03-02 18:57:11 +00:00
this.$vuetify.theme.themes.dark.accent2 = '#000',
2022-03-02 15:57:29 +00:00
this.$vuetify.theme.themes.dark.background = '#000'
2022-02-25 00:33:03 +00:00
)
// 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"
}
}
}
</script>
2022-02-24 19:55:29 +00:00
<style scoped>
2022-02-24 22:29:34 +00:00
.v-card {
margin: 1em;
}
2022-02-24 22:29:34 +00:00
section {
padding: 0 1em 1em 1em;
2022-02-24 19:55:29 +00:00
}
</style>