mirror of
https://github.com/InvoiceShelf/InvoiceShelf.git
synced 2026-04-17 10:14:08 +00:00
UI: Facelift for v3
This commit is contained in:
@@ -74,9 +74,10 @@
|
||||
w-8
|
||||
h-8
|
||||
ml-2
|
||||
text-sm text-black
|
||||
bg-white
|
||||
rounded
|
||||
text-sm text-white
|
||||
bg-white/20
|
||||
rounded-lg
|
||||
hover:bg-white/30
|
||||
md:h-9 md:w-9
|
||||
"
|
||||
>
|
||||
@@ -143,7 +144,7 @@
|
||||
<template #activator>
|
||||
<img
|
||||
:src="previewAvatar"
|
||||
class="block w-8 h-8 rounded md:h-9 md:w-9 object-cover"
|
||||
class="block w-8 h-8 rounded-full ring-2 ring-white/30 md:h-9 md:w-9 object-cover"
|
||||
/>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -78,7 +78,7 @@
|
||||
>
|
||||
<div
|
||||
v-if="menu[0] && menu[0].group_label"
|
||||
class="px-4 pt-4 pb-1 text-xs font-semibold text-gray-400 uppercase tracking-wider border-t border-gray-200"
|
||||
class="px-4 mt-6 mb-2 text-xs font-semibold text-gray-400 uppercase tracking-wider"
|
||||
>
|
||||
{{ $t(menu[0].group_label) }}
|
||||
</div>
|
||||
@@ -88,9 +88,9 @@
|
||||
:to="item.link"
|
||||
:class="[
|
||||
hasActiveUrl(item.link)
|
||||
? 'text-primary-500 border-l-primary-500 bg-gray-100 '
|
||||
: 'text-black border-l-transparent',
|
||||
'cursor-pointer px-0 pl-4 py-3 flex items-center border-l-4 border-solid text-sm not-italic font-medium',
|
||||
? 'text-primary-600 bg-primary-50 font-semibold'
|
||||
: 'text-gray-600 hover:bg-gray-50',
|
||||
'cursor-pointer mx-3 px-3 py-2.5 flex items-center rounded-lg text-sm not-italic font-medium transition-colors',
|
||||
]"
|
||||
@click="globalStore.setSidebarVisibility(false)"
|
||||
>
|
||||
@@ -98,9 +98,9 @@
|
||||
:name="item.icon"
|
||||
:class="[
|
||||
hasActiveUrl(item.link)
|
||||
? 'text-primary-500 '
|
||||
? 'text-primary-500'
|
||||
: 'text-gray-400',
|
||||
'mr-4 shrink-0 h-5 w-5',
|
||||
'mr-3 shrink-0 h-5 w-5',
|
||||
]"
|
||||
@click="globalStore.setSidebarVisibility(false)"
|
||||
/>
|
||||
@@ -138,7 +138,7 @@
|
||||
>
|
||||
<div
|
||||
v-if="menu[0] && menu[0].group_label"
|
||||
class="px-6 pt-4 pb-1 text-xs font-semibold text-gray-400 uppercase tracking-wider border-t border-gray-200"
|
||||
class="px-6 mt-6 mb-2 text-xs font-semibold text-gray-400 uppercase tracking-wider"
|
||||
>
|
||||
{{ $t(menu[0].group_label) }}
|
||||
</div>
|
||||
@@ -148,18 +148,18 @@
|
||||
:to="item.link"
|
||||
:class="[
|
||||
hasActiveUrl(item.link)
|
||||
? 'text-primary-500 border-l-primary-500 bg-gray-100 '
|
||||
: 'text-black border-l-transparent',
|
||||
'cursor-pointer px-0 pl-6 hover:bg-gray-50 py-3 group flex items-center border-l-4 border-solid text-sm not-italic font-medium',
|
||||
? 'text-primary-600 bg-primary-50 font-semibold'
|
||||
: 'text-gray-600 hover:bg-gray-50',
|
||||
'cursor-pointer mx-3 px-3 py-2.5 group flex items-center rounded-lg text-sm not-italic font-medium transition-colors',
|
||||
]"
|
||||
>
|
||||
<BaseIcon
|
||||
:name="item.icon"
|
||||
:class="[
|
||||
hasActiveUrl(item.link)
|
||||
? 'text-primary-500 group-hover:text-primary-500 '
|
||||
: 'text-gray-400 group-hover:text-black',
|
||||
'mr-4 shrink-0 h-5 w-5 ',
|
||||
? 'text-primary-500'
|
||||
: 'text-gray-400 group-hover:text-gray-600',
|
||||
'mr-3 shrink-0 h-5 w-5',
|
||||
]"
|
||||
/>
|
||||
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
<div>
|
||||
<div
|
||||
v-if="dashboardStore.isDashboardDataLoaded"
|
||||
class="grid grid-cols-10 mt-8 bg-white rounded shadow"
|
||||
class="grid grid-cols-10 mt-8 bg-white rounded-xl shadow-sm border border-gray-100"
|
||||
>
|
||||
<!-- Chart -->
|
||||
<div
|
||||
|
||||
@@ -5,22 +5,24 @@
|
||||
relative
|
||||
flex
|
||||
justify-between
|
||||
p-3
|
||||
p-5
|
||||
bg-white
|
||||
rounded
|
||||
shadow
|
||||
hover:bg-gray-50
|
||||
xl:p-4
|
||||
rounded-xl
|
||||
shadow-sm
|
||||
border border-gray-100
|
||||
hover:shadow-md
|
||||
transition-shadow
|
||||
xl:p-6
|
||||
lg:col-span-2
|
||||
"
|
||||
:class="{ 'lg:!col-span-3': large }"
|
||||
:to="route"
|
||||
>
|
||||
<div>
|
||||
<span class="text-xl font-semibold leading-tight text-black xl:text-3xl">
|
||||
<span class="text-2xl font-bold leading-tight text-gray-900 xl:text-3xl">
|
||||
<slot />
|
||||
</span>
|
||||
<span class="block mt-1 text-sm leading-tight text-gray-500 xl:text-lg">
|
||||
<span class="block mt-1 text-sm font-medium leading-tight text-gray-500 xl:text-base">
|
||||
{{ label }}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
class="due-invoices"
|
||||
>
|
||||
<div class="relative z-10 flex items-center justify-between mb-3">
|
||||
<h6 class="mb-0 text-xl font-semibold leading-normal">
|
||||
<h6 class="mb-0 text-lg font-semibold leading-normal text-gray-900">
|
||||
{{ $t('dashboard.recent_invoices_card.title') }}
|
||||
</h6>
|
||||
|
||||
@@ -57,7 +57,7 @@
|
||||
class="recent-estimates"
|
||||
>
|
||||
<div class="relative z-10 flex items-center justify-between mb-3">
|
||||
<h6 class="mb-0 text-xl font-semibold leading-normal">
|
||||
<h6 class="mb-0 text-lg font-semibold leading-normal text-gray-900">
|
||||
{{ $t('dashboard.recent_estimate_card.title') }}
|
||||
</h6>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user