asteroid/bibi/wardrobe/_dress-patterns/_arrows.scss

55 lines
1.6 KiB
SCSS
Raw Normal View History

2023-12-28 06:39:56 +00:00
// ================================================================================
// + Arrows
// --------------------------------------------------------------------------------
div.bibi-arrow {
//// Layout
& {
&:before { @include Arrow-Icon(); }
}
html.appearance-horizontal & {
&:after { width: $Arrow-Bar_Width; } // ←→
}
html.appearance-horizontal.book-full-height.slider-opened &,
html.appearance-horizontal:not(.book-full-height) & {
top: $Menu_Height;
}
html.appearance-horizontal:not(.book-full-height):not(.slider-opened) & {
height: calc(100vh - #{$Menu_Height}); // TO BE OVERWRITTEN
}
html.appearance-horizontal.book-full-height.slider-opened &,
html.appearance-horizontal:not(.book-full-height).slider-opened & {
height: calc(100vh - #{$Menu_Height + $Slider_Size});
}
html.appearance-vertical & {
&:after { height: $Arrow-Bar_Width; } // ↑↓
}
html.appearance-vertical.slider-opened & {
width: calc(100vw - #{$Slider_Size});
}
}
html.appearance-ttb.book-full-height.slider-opened div#bibi-arrow-back,
html.appearance-ttb:not(.book-full-height) div#bibi-arrow-back {
& {
&:before { margin-top: $Menu_Height; }
}
}
html.appearance-ltr div#bibi-arrow-back,
html.appearance-rtl div#bibi-arrow-forward {
&:before { @include Arrow-Icon-L(); }; // ←
}
html.appearance-ltr div#bibi-arrow-forward,
html.appearance-rtl div#bibi-arrow-back {
&:before { @include Arrow-Icon-R(); }; // →
}
html.appearance-ttb div#bibi-arrow-back {
&:before { @include Arrow-Icon-T(); }; // ↑
}
html.appearance-ttb div#bibi-arrow-forward {
&:before { @include Arrow-Icon-B(); }; // ↓
}