defuj/apkt-eis
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update font size and line height in aside menu

Browse Source
This commit is contained in:
Dede Fuji Abdul 2024-03-04 21:16:50 +07:00
parent 364cc9f3fb
commit 297288e9ff
3 changed files with 38 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
src/assets/css/style.css
View File

@ -861,7 +861,14 @@ body {
/* Aside */
.aside-text {
font-size: 0.75rem;
line-height: 1rem;
}
.aside-single-item-active {
font-size: 0.75rem;
line-height: 1rem;
display: flex;
width: 100%;
align-items: center;
@ -870,8 +877,6 @@ body {
padding-bottom: 0.5rem;
padding-left: 0.5rem;
padding-right: 1rem;
font-size: 0.75rem;
line-height: 1rem;
--tw-bg-opacity: 1;
background-color: rgb(3 91 113 / var(--tw-bg-opacity));
font-weight: 700;
@ -880,6 +885,8 @@ body {
}
.aside-single-item-inactive {
font-size: 0.75rem;
line-height: 1rem;
display: flex;
width: 100%;
align-items: center;
@ -888,8 +895,6 @@ body {
padding-bottom: 0.5rem;
padding-left: 0.5rem;
padding-right: 1rem;
font-size: 0.75rem;
line-height: 1rem;
font-weight: 600;
--tw-text-opacity: 1;
color: rgb(75 85 99 / var(--tw-text-opacity));
@ -3259,6 +3264,11 @@ body {
font-family: Plus Jakarta Sans, sans-serif;
}
.\!text-xs {
font-size: 0.75rem !important;
line-height: 1rem !important;
}
.text-2xl {
font-size: 1.5rem;
line-height: 2rem;
@ -5881,10 +5891,6 @@ body {
margin-left: 1.5rem;
}
.md\:mr-3 {
margin-right: 0.75rem;
}
.md\:mr-6 {
margin-right: 1.5rem;
}
@ -5917,11 +5923,6 @@ body {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.md\:rounded-t-3xl {
border-top-left-radius: 1.5rem;
border-top-right-radius: 1.5rem;
}
.md\:bg-primary-500 {
--tw-bg-opacity: 1;
background-color: rgb(3 91 113 / var(--tw-bg-opacity));
@ -5931,11 +5932,6 @@ body {
padding: 5rem;
}
.md\:px-6 {
padding-left: 1.5rem;
padding-right: 1.5rem;
}
.md\:py-0 {
padding-top: 0px;
padding-bottom: 0px;
@ -5949,6 +5945,11 @@ body {
font-size: 1.5rem;
line-height: 2rem;
}
.md\:text-xl {
font-size: 1.25rem;
line-height: 1.75rem;
}
}
@media (min-width: 1024px) {
@ -5978,6 +5979,10 @@ body {
margin-right: 0.25rem;
}
.lg\:mr-3 {
margin-right: 0.75rem;
}
.lg\:mt-12 {
margin-top: 3rem;
}
@ -6040,6 +6045,11 @@ body {
margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
}
.lg\:rounded-t-3xl {
border-top-left-radius: 1.5rem;
border-top-right-radius: 1.5rem;
}
.lg\:border-b-0 {
border-bottom-width: 0px;
}
@ -6048,6 +6058,11 @@ body {
border-right-width: 1px;
}
.lg\:px-6 {
padding-left: 1.5rem;
padding-right: 1.5rem;
}
.lg\:px-8 {
padding-left: 2rem;
padding-right: 2rem;

5
src/assets/css/tailwind.css
View File

@ -26,8 +26,11 @@
@apply flex-shrink-0 block px-4 py-2 border-b bg-primary-500 border-gray-50;
}
/* Aside */
.aside-text{
@apply text-xs;
}
.aside-single-item {
@apply w-full flex items-center pl-2 pr-4 py-2 text-xs rounded-xl;
@apply aside-text w-full flex items-center pl-2 pr-4 py-2 rounded-xl;
}
.aside-single-item-active {
@apply aside-single-item bg-primary-500 text-white font-bold;

2
src/components/Navigation/Aside/AsideMenuMultiple.vue
View File

@ -43,7 +43,7 @@ const isMenuSelected = computed(() => {
:class="[(isMenuSelected || item.expanded || isChildren || selected) ? ' fill-primary-500' : 'text-aside group-hover:fill-primary-500', 'mr-2 flex-shrink-0 h-6 w-6']"
aria-hidden="true" />
<span
:class="[(isMenuSelected || item.expanded || selected) ? 'text-primary-500' : 'group-hover:text-primary-500', 'flex-1']">
:class="[(isMenuSelected || item.expanded || selected) ? 'text-primary-500' : 'group-hover:text-primary-500', 'flex-1 aside-text']">
{{ item.name }}
</span>