MaDgIK
/
openaire-theme
13
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Add style on nav for subnav primary and default

This commit is contained in:
Konstantinos Triantafyllou 2022-11-28 16:14:26 +02:00
parent a9acdff7b3
commit aebfaedeab
1 changed files with 43 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
less/nav.less
View File

@ -1,26 +1,58 @@
@nav-parent-icon-width: @global-line-height; @nav-parent-icon-width: @global-line-height;
@nav-default-item-color: @global-color; @nav-default-item-color: @global-color;
@nav-default-item-hover-color: @global-link-hover-color; @nav-default-item-hover-color: @global-link-hover-color;
@nav-default-item-active-font-weight: 600; @nav-default-item-active-font-weight: 600;
@nav-default-header-color: @global-secondary-background;
@nav-item-padding-horizontal: 30px;
@nav-sublist-padding-vertical: 10px;
@nav-sublist-padding-left: 45px;
@nav-default-sublist-item-color: @nav-default-item-color; @nav-default-sublist-item-color: @nav-default-item-color;
@nav-default-sublist-item-hover-color: @nav-default-item-hover-color; @nav-default-sublist-item-hover-color: @nav-default-item-hover-color;
@nav-default-sublist-item-active-font-weight: @nav-default-item-active-font-weight; @nav-default-sublist-item-active-font-weight: @nav-default-item-active-font-weight;
@nav-header-color: @global-emphasis-color; @nav-primary-item-font-weight: 600;
@nav-primary-item-color: @global-color;
@nav-primary-item-hover-color: @global-secondary-background;
@nav-primary-item-active-color: @global-secondary-background;
@nav-primary-header-color: @global-secondary-background;
@nav-primary-sublist-item-color: @nav-primary-item-color;
@nav-primary-sublist-item-hover-color: @nav-primary-item-hover-color;
@nav-primary-sublist-item-active-font-weight: @nav-primary-item-font-weight;
@nav-item-padding-horizontal: 30px;
@nav-sublist-padding-vertical: 10px;
@nav-sublist-padding-left: @nav-item-padding-horizontal + 20px;
@nav-sublist-border-width: 2px;
@nav-sublist-border-color: fade(@global-secondary-background, 20%);
@nav-sublist-border-radius: 40px;
@nav-header-padding-horizontal: 0;
@nav-header-color: @secondary-color;
.hook-nav-default-item-active() { .hook-nav-default-item-active() {
font-weight: @nav-default-item-active-font-weight; font-weight: @nav-default-item-active-font-weight;
} }
.hook-nav-primary-item() {
font-weight: @nav-primary-item-font-weight;
}
.hook-nav-header() { .hook-nav-header() {
color: @nav-header-color; color: @nav-header-color;
} }
.hook-nav-sub() {
position: relative;
&:before {
content: "";
left: @nav-sublist-padding-left - 15px;
top: @nav-sublist-padding-vertical;
position: absolute;
height: calc(100% - 2*@nav-sublist-padding-vertical);
border-left: @nav-sublist-border-width solid @nav-sublist-border-color;
border-radius: @nav-sublist-border-radius;
}
}
.hook-nav-parent-icon() { .hook-nav-parent-icon() {
background-image: none !important; background-image: none !important;
font-family: "Material Icons"; font-family: "Material Icons";
@ -34,7 +66,11 @@
.hook-nav-misc() { .hook-nav-misc() {
.uk-nav-default .uk-nav-sub li.uk-active > a { .uk-nav-default .uk-nav-sub li.uk-active > a {
font-weight: @nav-default-item-active-font-weight; font-weight: @nav-default-sublist-item-active-font-weight;
}
.uk-nav-primary .uk-nav-sub li.uk-active > a {
font-weight: @nav-primary-sublist-item-active-font-weight;
} }
.uk-nav-parent-icon > .uk-parent.uk-open > a::after { .uk-nav-parent-icon > .uk-parent.uk-open > a::after {