You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

App.vue 1.7KB

1 vuosi sitten
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374
  1. <template>
  2. <div id="app">
  3. <v-app>
  4. <header>
  5. <v-toolbar color="secondary">
  6. <v-avatar size="60" tile>
  7. <v-img src="/logo.png">
  8. </v-img>
  9. </v-avatar>
  10. <v-btn to="/" text>
  11. <v-toolbar-title>{{ $name }}</v-toolbar-title>
  12. </v-btn>
  13. <v-toolbar-items>
  14. <v-btn @click="changeTheme()" text><span><v-icon>invert_colors</v-icon></span></v-btn>
  15. </v-toolbar-items>
  16. </v-toolbar>
  17. </header>
  18. <v-main>
  19. <Main></Main>
  20. </v-main>
  21. <v-footer elevation="10" padless>
  22. <v-card flat tile width="100%" class="text-center" color="primary">
  23. <v-card-text v-if="$donations">
  24. dERokevAZEZVJ2N7o39VH81BXBqX9ojtncnPTDMyiVbmYiTXQY93AUCLcor9xsWCKWhYy25ja89ikZWXWab9kXRB7LYfUmbQyS
  25. </v-card-text>
  26. <v-divider></v-divider>
  27. <v-card-text>
  28. {{ new Date().getFullYear() }} — <strong>{{ $name }}</strong>
  29. </v-card-text>
  30. </v-card>
  31. </v-footer>
  32. </v-app>
  33. </div>
  34. </template>
  35. <script>
  36. import Main from './views/Main'
  37. export default {
  38. name: 'app',
  39. components: {
  40. Main
  41. },
  42. mounted() {
  43. if (localStorage.theme) {
  44. this.$vuetify.theme.dark = localStorage.theme == "dark"
  45. } else {
  46. this.$vuetify.theme.dark = true
  47. }
  48. },
  49. methods: {
  50. changeTheme() {
  51. this.$vuetify.theme.dark = !this.$vuetify.theme.dark
  52. if (this.$vuetify.theme.dark) {
  53. localStorage.theme = "dark"
  54. } else {
  55. localStorage.theme = "light"
  56. }
  57. }
  58. }
  59. }
  60. </script>
  61. <style>
  62. #app {
  63. color: white;
  64. text-align: center;
  65. background: var(--v-anchor-base);
  66. }
  67. * {
  68. transition: background-color 200ms ease, color 150ms ease-in-out;
  69. }
  70. </style>