thang/notes
1
0
Fork 0
mirror of https://github.com/thangisme/notes.git synced 2025-02-21 06:57:46 -05:00
Code Issues Projects Releases Wiki Activity

Display nav-list-expander on the right side

Browse Source 
(cherry picked from commit 2d6e97e0cbfb8bdcf87a2e5ad19bd59fc8f5405d)
This commit is contained in:
Silvio Giebl 2019-08-11 23:54:51 +02:00
parent e13a62b7b5
commit 52bcb26ddd
2 changed files with 33 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
_sass/navigation.scss
View File

@ -22,14 +22,25 @@
min-height: $nav-list-item-height-sm;
line-height: #{$nav-list-item-height-sm - 2 * $sp-1};
padding-top: $sp-1;
padding-right: $gutter-spacing-sm;
padding-bottom: $sp-1;
padding-left: $nav-list-item-height-sm;
@if $nav-list-expander-right {
padding-right: $nav-list-item-height-sm;
padding-left: $gutter-spacing-sm;
} @else {
padding-right: $gutter-spacing-sm;
padding-left: $nav-list-item-height-sm;
}
@include mq(md) {
min-height: $nav-list-item-height;
line-height: #{$nav-list-item-height - 2 * $sp-1};
padding-left: $nav-list-item-height;
@if $nav-list-expander-right {
padding-right: $nav-list-item-height;
padding-left: $gutter-spacing;
} @else {
padding-right: $gutter-spacing;
padding-left: $nav-list-item-height;
}
}
&.active {
@ -45,6 +56,9 @@
.nav-list-expander {
position: absolute;
@if $nav-list-expander-right {
right: 0;
}
width: $nav-list-item-height-sm;
height: $nav-list-item-height-sm;
padding-top: #{$nav-list-item-height-sm / 4};
@ -65,6 +79,12 @@
&:hover {
background-color: $feedback-color;
}
@if $nav-list-expander-right {
svg {
transform: rotate(90deg);
}
}
}
> .nav-list {
@ -78,12 +98,20 @@
.nav-list-link {
color: $nav-child-link-color;
}
.nav-list-expander {
fill: $nav-child-link-color;
}
}
}
&.active {
> .nav-list-expander svg {
transform: rotate(90deg);
@if $nav-list-expander-right {
transform: rotate(-90deg);
} @else {
transform: rotate(90deg);
}
}
> .nav-list {

1
_sass/support/_variables.scss
View File

@ -115,6 +115,7 @@ $nav-width: 264px !default;
$nav-width-md: 248px !default;
$nav-list-item-height: $sp-6 !default;
$nav-list-item-height-sm: $sp-8 !default;
$nav-list-expander-right: true;
$content-width: 800px !default;
$header-height: 60px !default;
$search-results-width: 500px !default;