mirror of
https://github.com/miggymofongo/asteroid.git
synced 2024-11-24 14:10:27 +00:00
67 lines
2.3 KiB
SCSS
67 lines
2.3 KiB
SCSS
|
// ================================================================================
|
||
|
// + Menu
|
||
|
// --------------------------------------------------------------------------------
|
||
|
|
||
|
|
||
|
div#bibi-menu {
|
||
|
height: $Menu_Height;
|
||
|
.bibi-icon { @include size($Menu-Icon_Size); }
|
||
|
html.appearance-vertical.slider-opened & { width: calc(100% - #{$Slider_Size}); }
|
||
|
html.appearance-vertical.slider-opened.panel-opened &,
|
||
|
html.appearance-vertical.slider-opened.subpanel-opened & { padding-right: $Slider_Size; }
|
||
|
}
|
||
|
html.book-full-height {
|
||
|
& div#bibi-menu { background-color: $Menu_BackgroundColor; }
|
||
|
& div#bibi-menu.hover,
|
||
|
&.panel-opened div#bibi-menu,
|
||
|
&.subpanel-opened div#bibi-menu { background-color: $Menu_BackgroundColor__Hover; }
|
||
|
&.menu-opened div#bibi-menu { background-color: $Menu_BackgroundColor__Active; box-shadow: $Menu_BoxShadow__Active; }
|
||
|
}
|
||
|
html:not(.book-full-height) {
|
||
|
& div#bibi-menu { background-color: $Menu_BackgroundColor__NotBFH; }
|
||
|
& div#bibi-menu.hover,
|
||
|
&.panel-opened div#bibi-menu,
|
||
|
&.subpanel-opened div#bibi-menu { background-color: $Menu_BackgroundColor__NotBFH__Hover; }
|
||
|
&.menu-opened div#bibi-menu { background-color: $Menu_BackgroundColor__NotBFH__Active; box-shadow: $Menu_BoxShadow__NotBFH__Active; }
|
||
|
}
|
||
|
|
||
|
|
||
|
// - Menu-L & Menu-R
|
||
|
// --------------------------------------------------------------------------------
|
||
|
|
||
|
div#bibi-menu-l,
|
||
|
div#bibi-menu-r {
|
||
|
ul {
|
||
|
padding: $Menu-ButtonGroup_Padding;
|
||
|
height: $Menu-Icon_Size;
|
||
|
&:before {
|
||
|
width: $Menu-ButtonGroup-Separator_Width;
|
||
|
background: $Menu-ButtonGroup-Separator_Color;
|
||
|
top: $Menu-ButtonGroup_Padding;
|
||
|
height: $Menu-Icon_Size;
|
||
|
}
|
||
|
li {
|
||
|
@include size($Menu-Icon_Size);
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
div#bibi-menu-l {
|
||
|
ul {
|
||
|
&:first-child { padding-left: $Menu-ButtonGroup_Padding; }
|
||
|
&:not(:first-child) { padding-left: $Menu-ButtonGroup_Padding$Menu-ButtonGroup_Padding + $Menu-ButtonGroup-Separator_Width; }
|
||
|
li {
|
||
|
&:not(:first-child) { margin-left: $Menu-ButtonGroup-Button_Margin; }
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
div#bibi-menu-r {
|
||
|
ul {
|
||
|
&:first-child { padding-right: $Menu-ButtonGroup_Padding; }
|
||
|
&:not(:first-child) { padding-right: $Menu-ButtonGroup_Padding + $Menu-ButtonGroup-Separator_Width; }
|
||
|
li {
|
||
|
&:not(:first-child) { margin-right: $Menu-ButtonGroup-Button_Margin; }
|
||
|
}
|
||
|
}
|
||
|
}
|