admin-theme.vue 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354
  1. <template lang='pug'>
  2. v-container(fluid, fill-height, grid-list-lg)
  3. v-layout(row wrap)
  4. v-flex(xs12)
  5. .headline.primary--text Theme
  6. .subheading.grey--text Modify the look &amp; feel of your wiki
  7. v-form.pt-3
  8. v-layout(row wrap)
  9. v-flex(lg6 xs12)
  10. v-card
  11. v-toolbar(color='primary', dark, dense, flat)
  12. v-toolbar-title
  13. .subheading Theme
  14. v-card-text
  15. v-select(:items='themes', prepend-icon='palette', v-model='selectedTheme', label='Site Theme', persistent-hint, hint='Themes affect how content pages are displayed. Other site sections (such as the editor or admin area) are not affected.')
  16. template(slot='item', slot-scope='data')
  17. v-list-tile-avatar
  18. v-icon.blue--text(dark) filter_frames
  19. v-list-tile-content
  20. v-list-tile-title(v-html='data.item.text')
  21. v-list-tile-sub-title(v-html='data.item.author')
  22. v-divider
  23. v-switch(v-model='darkMode', label='Dark Mode', color='primary', persistent-hint, hint='Not recommended for accessibility.')
  24. v-divider.my-0
  25. v-card-actions.grey.lighten-4
  26. v-spacer
  27. v-btn(color='primary', :loading='loading', @click='save')
  28. v-icon(left) chevron_right
  29. span Save
  30. v-flex(lg6 xs12)
  31. v-card
  32. v-toolbar(color='teal', dark, dense, flat)
  33. v-toolbar-title
  34. .subheading Download Themes
  35. v-card-text.caption -- Coming soon --
  36. </template>
  37. <script>
  38. export default {
  39. data() {
  40. return {
  41. themes: [
  42. { text: 'Default', author: 'requarks.io', value: 'default' }
  43. ],
  44. selectedTheme: 'default',
  45. darkMode: false
  46. }
  47. }
  48. }
  49. </script>
  50. <style lang='scss'>
  51. </style>