block.vue 1.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344
  1. <script lang='ts' setup>
  2. import tempItem from './comp/temp_item.vue'
  3. import BlockImg from '~/assets/images/block_icon.png'
  4. const list = [
  5. {
  6. title: 'Trendy & Market-Ready Designs',
  7. desc:
  8. 'Selected products that taps into current consumer trends, ensuring businesses always offer fresh, in-demand products.',
  9. img: BlockImg,
  10. },
  11. {
  12. title: 'Unique & Engaging Aesthetics',
  13. desc:
  14. 'Products featuring unique, engaging aesthetics that enhance shelf appeal and create memorable shopping experiences.',
  15. img: BlockImg,
  16. },
  17. {
  18. title: 'Quality & Supply Chain Reliability',
  19. desc:
  20. 'Premium products supported by a dependable supply network, ensuring both product integrity and reliable inventory flow.',
  21. img: BlockImg,
  22. },
  23. ]
  24. </script>
  25. <template>
  26. <div class="bg-#F9FAFB py-120px">
  27. <div class="w-1200-auto text-center">
  28. <h2 class="text-36px fw-800 text-#333 !mb-80px custom-title-font">
  29. EJET Spark Selects Products <span class="custom-title-bg03">With</span>
  30. </h2>
  31. <div class="flex gap-40px">
  32. <div v-for="(item, index) in list" :key="index">
  33. <temp-item :item />
  34. </div>
  35. </div>
  36. </div>
  37. </div>
  38. </template>
  39. <style lang='less' scoped>
  40. </style>