NEXT craftinamerica.org. Base setup for headless wordpress https://www.craftinamerica.org
您最多选择25个主题 主题必须以字母或数字开头,可以包含连字符 (-),并且长度不得超过35个字符

app.vue 3.1KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119
  1. <template lang="pug">
  2. div#theme.f-col
  3. cia-nav
  4. cia-hero
  5. main.f-col
  6. router-view
  7. cia-footer
  8. </template>
  9. <script>
  10. import navigation from '@/components/navigation/navigation'
  11. import hero from '@/components/hero'
  12. import footer from '@/components/footer'
  13. import '@/sss'
  14. export default {
  15. components: {
  16. 'cia-nav': navigation,
  17. 'cia-hero': hero,
  18. 'cia-footer': footer,
  19. },
  20. data () {
  21. return {}
  22. }
  23. }
  24. </script>
  25. <style lang="postcss">
  26. @import './sss/variables.sss'
  27. html > body
  28. font-family: $sans
  29. font-size: $base
  30. main
  31. background-color: green
  32. width: 100%
  33. :--headings
  34. color: red
  35. > [class^="page--"]
  36. background-color: pink
  37. max-width: 100em
  38. width: 90%
  39. padding: $ms 0
  40. align-items: flex-start
  41. /* Block Shadow Thing */
  42. .shadow
  43. box-shadow: rgb(34, 36, 37) 0px 0px 4px 0px
  44. /* Content Pieces */
  45. .post
  46. background-color: teal
  47. margin: 0 0 $ms
  48. &--title
  49. color: yellow
  50. padding: 0 0 $ms
  51. &--content
  52. color: orange
  53. &--block > p
  54. color: white
  55. .wp-block-image
  56. margin: 0
  57. img
  58. width: 100%
  59. > ul
  60. list-style: none
  61. /* Single & List Pages */
  62. > article
  63. background-color: lightpink
  64. > *
  65. padding: $ms
  66. > section, > header
  67. margin: 0 0 $ms
  68. > section .block-wrapper
  69. img
  70. width: 100%
  71. .wp-block-gallery
  72. .blocks-gallery
  73. &-grid
  74. list-style: none
  75. &-item
  76. loat: left
  77. &.columns-1
  78. .blocks-gallery-item
  79. width: 100%
  80. &.columns-2
  81. .blocks-gallery-item
  82. width: 50%
  83. &.columns-3
  84. .blocks-gallery-item
  85. width: 33.33%
  86. &.columns-4
  87. .blocks-gallery-item
  88. width: 25%
  89. > aside
  90. background-color: salmon
  91. margin: 0 0 0 $ms
  92. min-width: 27%
  93. width: 27%
  94. > section
  95. > *
  96. padding: $ms
  97. margin: 0 0 $ms 0
  98. > .post
  99. background-color: blue
  100. nav, footer
  101. &.main
  102. background-color: #ccc
  103. padding: $ms
  104. width: 100%
  105. ul > li
  106. padding: 0 $ms
  107. </style>