scss: make nav selected vars works (#88323)
gitea/publik-base-theme/pipeline/head This commit looks good Details

This commit is contained in:
Thomas Jund 2024-03-19 10:10:51 +01:00
parent aa1280d1c9
commit af869598d7
2 changed files with 18 additions and 18 deletions

View File

@ -12,8 +12,8 @@ $nav-submenu-background: #eee;
$nav-submenu-color: #333;
$nav-color: $font-color;
$nav-active-color: $primary-color;
$nav-item-selected-color: white;
$nav-item-hover-color: white;
$nav-mobile-menu-item-hover-color: white;
$nav-mobile-menu-item-hover-background: $nav-active-color;
$nav-item-selected-mode: bottom-border;
$nav-text-transform: uppercase;
$border-radius: 0px;

View File

@ -24,10 +24,17 @@ $nav-mobile-mode: hamburger !default; // or bottom-bar
$nav-mobile-limit: $mobile-limit !default;
$nav-item-selected-mode: background !default; // or bottom-border
$nav-item-selected-border: 2px solid $nav-active-color !default;
$nav-item-selected-background: $nav-active-color !default;
$nav-item-selected-color: $nav-menu-color !default;
$nav-item-selected-border: null !default;
$nav-item-selected-background: null !default;
$nav-item-selected-color: null !default;
@if ($nav-item-selected-mode == background) {
$nav-item-selected-background: $nav-active-color !default;
$nav-item-selected-color: $nav-menu-color !default;
}
@if ($nav-item-selected-mode == bottom-border) {
$nav-item-selected-border: 2px solid $nav-active-color !default;
$nav-item-selected-color: $nav-color !default;
}
$nav-item-hover-border: $nav-item-selected-border !default;
$nav-item-hover-background: $nav-item-selected-background !default;
$nav-item-hover-color: $nav-item-selected-color !default;
@ -111,23 +118,16 @@ div.gru-nav > ul > li a {
}
div.gru-nav li > a {
@if $nav-item-selected-mode == bottom-border {
border-bottom: $nav-item-selected-border;
border-bottom-color: transparent;
}
border-bottom: $nav-item-selected-border;
border-bottom-color: transparent;
}
div.gru-nav li.selected > a,
div.gru-nav li:focus-within > a,
div.gru-nav li:hover > a {
@if $nav-item-selected-mode == background {
background-color: $nav-item-hover-background;
color: $nav-item-hover-color;
}
@if $nav-item-selected-mode == bottom-border {
border-bottom: $nav-item-hover-border;
color: $nav-color;
}
color: $nav-item-hover-color;
background-color: $nav-item-hover-background;
border-bottom: $nav-item-hover-border;
}
div.gru-nav > ul ul {