<script lang='ts' setup> import icon_01 from '~/assets/images/blog_icon01.png' import icon_02 from '~/assets/images/blog_icon02.png' import icon_03 from '~/assets/images/blog_icon03.png' import icon_04 from '~/assets/images/blog_icon04.png' const list = [ { icon: icon_01, title: 'Stock-Keeping', total: '20,000', }, { icon: icon_02, title: 'Supplier Portfolio', total: '2,000', }, { icon: icon_03, title: 'Display Solutions', total: '2,00', }, { icon: icon_04, title: 'Brand Designs', total: '20', }, ] </script> <template> <div class="bg-#0F0820 pt-110px pb-120px data-section" data-section-color="#0F0820" > <div class="w-1200-auto text-center flex gap-190px justify-between"> <div v-for="item, index in list" :key="index"> <img :src="item.icon" alt="" class="w-80px h-80px mx-auto" > <div class="text-#fff text-36px fw-900 mt-20px mb-10px ls-2 custom-title-font"> {{ item.total }}+ </div> <div class="text-#fff text-20px fw-500 custom-title-font"> {{ item.title }} </div> </div> </div> </div> </template> <style lang='less' scoped> </style>