mohadese namavar
44 lines
1.0 KiB
Vue
44 lines
1.0 KiB
Vue
<template>
|
|
<ul>
|
|
<li v-for="({ label, link }, i) in items" :key="i">
|
|
<router-link :to="link">
|
|
<span>{{ label }}</span>
|
|
</router-link>
|
|
</li>
|
|
</ul>
|
|
</template>
|
|
|
|
<script setup>
|
|
const items = reactive([
|
|
{ link: '/panel/seller/store', label: 'فروشگاه', icon: 'isax isax-shop' },
|
|
{ link: '/panel/seller/products', label: 'همه کالاها', icon: 'isax isax-bag' },
|
|
{ link: '/panel/seller/new-product', label: 'معرفی کالا', icon: 'isax isax-bag-cross' },
|
|
{ link: '/panel/seller/orders', label: 'سفارشات', icon: 'isax isax-bag-tick-2' },
|
|
])
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.header-mobile>ul {
|
|
@apply w-full h-8 flex gap-6 px-6;
|
|
|
|
li {
|
|
@apply translate-y-px;
|
|
|
|
a {
|
|
|
|
@apply h-full w-max text-[#333333] text-xs font-vazir;
|
|
|
|
&.router-link-active {
|
|
@apply text-[#47B556] font-bold;
|
|
}
|
|
}
|
|
|
|
&:has(.router-link-active) {
|
|
@apply border-b-2 border-[#47B556];
|
|
}
|
|
}
|
|
|
|
|
|
|
|
}
|
|
</style> |