FeatureList.vue 581 B

123456789101112131415161718192021222324252627282930313233343536373839404142
  1. <script>
  2. export default {
  3. props: {
  4. items: {
  5. required: true,
  6. },
  7. },
  8. };
  9. </script>
  10. <template>
  11. <ul class="FeatureList">
  12. <template v-for="item in items" :key="item.id">
  13. <li>
  14. <span v-html="item.text"></span>
  15. <FeatureList v-if="item.items" :items="item.items" />
  16. </li>
  17. </template>
  18. </ul>
  19. </template>
  20. <style scoped>
  21. .FeatureList {
  22. margin: 0.55em 0;
  23. padding-left: 1em;
  24. list-style: disc;
  25. line-height: 1.5;
  26. & ul {
  27. padding-left: 1em;
  28. list-style: disc;
  29. }
  30. & li {
  31. margin-top: 0.5em;
  32. }
  33. @media (min-width: 640px) {
  34. font-size: 1.15rem;
  35. }
  36. }
  37. </style>