jaro/ikea
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

restyling dashboard layout

Browse Source
This commit is contained in:
Geriano
2022-09-08 15:09:50 +07:00
parent 364af7a558
commit 5fd44b83a6
9 changed files with 106 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
resources/js/Components/DashboardLayout/Sidebar/Link.vue
View File

@@ -6,6 +6,7 @@ import axios from 'axios'
const { menu } = defineProps({
menu: Object,
open: Boolean,
padding: Number,
})
@@ -52,15 +53,16 @@ onUpdated(fetch)
<Link
:href="link"
:class="`${themes().get('sidebar', 'bg-slate-700 text-gray-200')} ${active && 'bg-slate-800'} pl-${padding !== 0 && padding}`"
:title="menu.name"
class="w-full px-4 py-3"
>
<div class="flex items-center justify-between">
<div class="flex items-center" :class="{ 'justify-between': open, 'justify-center': !open }">
<div class="flex items-center space-x-2">
<Icon :name="menu.icon" />
<p class="uppercase font-semibold">{{ __(menu.name) }}</p>
<p v-if="open" class="uppercase font-semibold">{{ __(menu.name) }}</p>
</div>
<div v-if="menu.counter_handler && counter !== null" ref="element" class="flex-none flex items-center justify-center min-w-[1.5rem] min-h-[1.5rem] rounded-full bg-red-500 text-white text-xs p-1 transition-all">
<div v-if="open && menu.counter_handler && counter !== null" ref="element" class="flex-none flex items-center justify-center min-w-[1.5rem] min-h-[1.5rem] rounded-full bg-red-500 text-white text-xs p-1 transition-all">
<p>{{ counter }}</p>
</div>
</div>