admin-theme.vue 1.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849
  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='blue', dark, dense, flat)
  12. v-toolbar-title
  13. .subheading Theme
  14. v-btn(fab, absolute, right, bottom, small, light): v-icon save
  15. v-card-text
  16. 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.')
  17. template(slot='item', slot-scope='data')
  18. v-list-tile-avatar
  19. v-icon.blue--text(dark) filter_frames
  20. v-list-tile-content
  21. v-list-tile-title(v-html='data.item.text')
  22. v-list-tile-sub-title(v-html='data.item.author')
  23. v-divider
  24. v-switch(v-model='darkMode', label='Dark Mode', color='primary', persistent-hint, hint='Not recommended for accessibility')
  25. v-flex(lg6 xs12)
  26. v-card
  27. v-toolbar(color='blue', dark, dense, flat)
  28. v-toolbar-title
  29. .subheading Theme Options
  30. v-list
  31. </template>
  32. <script>
  33. export default {
  34. data() {
  35. return {
  36. themes: [
  37. { text: 'Default', author: 'requarks.io', value: 'default' }
  38. ],
  39. selectedTheme: 'default',
  40. darkMode: false
  41. }
  42. }
  43. }
  44. </script>
  45. <style lang='scss'>
  46. </style>