Mirrors/tabler
1
0
Fork 0
mirror of https://github.com/tabler/tabler.git synced 2025-12-21 17:34:25 +04:00
Code Issues Projects Releases Wiki Activity

Update _navbar.scss with disabled dropdown menu items colour (#1797)

Browse Source 
* Update _navbar.scss

* code style fixes

* Create mighty-mirrors-drum.md

---------

Co-authored-by: codecalm <codecalm@gmail.com>
Co-authored-by: Paweł Kuna <1282324+codecalm@users.noreply.github.com>
This commit is contained in:
KavyaKadi3
2024-01-01 17:01:05 -05:00
committed by GitHub
parent 02d6287f6b
commit cb4a6813a0
2 changed files with 27 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
.changeset/mighty-mirrors-drum.md Normal file
View File

@@ -0,0 +1,5 @@
---
"@tabler/core": patch
---
Update `_navbar.scss` with disabled dropdown menu items color

35
src/scss/layout/_navbar.scss
View File

@@ -1,4 +1,3 @@
@mixin navbar-vertical-nav { @mixin navbar-vertical-nav {
.navbar-collapse { .navbar-collapse {
flex-direction: column; flex-direction: column;
@@ -14,7 +13,7 @@
margin-right: 0; margin-right: 0;
.nav-link { .nav-link {
padding: .5rem calc(#{$container-padding-x} / 2); padding: 0.5rem calc(#{$container-padding-x} / 2);
justify-content: flex-start; justify-content: flex-start;
} }
} }
@@ -40,6 +39,12 @@
padding-left: add(calc(#{$container-padding-x} / 2), 1.75rem); padding-left: add(calc(#{$container-padding-x} / 2), 1.75rem);
color: inherit; color: inherit;
&.disabled {
color: var(--#{$prefix}gray-300);
pointer-events: none;
background-color: transparent;
}
&.active, &.active,
&:active { &:active {
background: var(--#{$prefix}navbar-active-bg); background: var(--#{$prefix}navbar-active-bg);
@@ -110,8 +115,8 @@ Navbar
.badge { .badge {
position: absolute; position: absolute;
top: .375rem; top: 0.375rem;
right: .375rem; right: 0.375rem;
transform: translate(50%, -50%); transform: translate(50%, -50%);
} }
} }
@@ -147,7 +152,7 @@ Navbar
position: absolute; position: absolute;
left: 0; left: 0;
right: 0; right: 0;
bottom: -.25rem; bottom: -0.25rem;
border: 0 var(--#{$prefix}border-style) var(--#{$prefix}navbar-active-border-color); border: 0 var(--#{$prefix}border-style) var(--#{$prefix}navbar-active-border-color);
border-bottom-width: 2px; border-bottom-width: 2px;
} }
@@ -215,7 +220,12 @@ Navbar toggler
width: 1.25em; width: 1.25em;
background: currentColor; background: currentColor;
border-radius: 10px; border-radius: 10px;
@include transition(top $navbar-toggler-animation-time $navbar-toggler-animation-time, bottom $navbar-toggler-animation-time $navbar-toggler-animation-time, transform $navbar-toggler-animation-time, opacity 0s $navbar-toggler-animation-time); @include transition(
top $navbar-toggler-animation-time $navbar-toggler-animation-time,
bottom $navbar-toggler-animation-time $navbar-toggler-animation-time,
transform $navbar-toggler-animation-time,
opacity 0s $navbar-toggler-animation-time
);
position: relative; position: relative;
&:before, &:before,
@@ -232,11 +242,11 @@ Navbar toggler
} }
&:before { &:before {
top: -.45em; top: -0.45em;
} }
&:after { &:after {
bottom: -.45em; bottom: -0.45em;
} }
.navbar-toggler[aria-expanded="true"] & { .navbar-toggler[aria-expanded="true"] & {
@@ -316,7 +326,7 @@ Navbar vertical
} }
.navbar-brand { .navbar-brand {
padding: (($navbar-height - $navbar-brand-image-height) * .5) 0; padding: (($navbar-height - $navbar-brand-image-height) * 0.5) 0;
justify-content: center; justify-content: center;
} }
@@ -330,8 +340,8 @@ Navbar vertical
min-height: auto; min-height: auto;
.nav-link { .nav-link {
padding-top: .5rem; padding-top: 0.5rem;
padding-bottom: .5rem; padding-bottom: 0.5rem;
} }
} }
@@ -365,7 +375,6 @@ Navbar vertical
} }
} }
.navbar-overlap { .navbar-overlap {
&:after { &:after {
content: ""; content: "";
@@ -378,4 +387,4 @@ Navbar vertical
z-index: -1; z-index: -1;
box-shadow: inherit; box-shadow: inherit;
} }
} }