asteroid/bibi/resources/styles/_#globals.scss

126 lines
5.3 KiB
SCSS
Raw Normal View History

2023-12-28 06:39:56 +00:00
// ================================================================================
// + MixIns
// --------------------------------------------------------------------------------
@mixin offset($T: auto, $R: $T, $B: $T, $L: $R) { top: $T; right: $R; bottom: $B; left: $L; } @mixin trbl($T: auto, $R: $T, $B: $T, $L: $R) { @include offset($T, $R, $B, $L); }
@mixin offset-v($T: auto, $B: $T) { top: $T; bottom: $B; } @mixin offset-tb($T: auto, $B: $T) { @include offset-v($T, $B); } @mixin tb($T: auto, $B: $T) { @include offset-v($T, $B); }
@mixin offset-h($L: auto, $R: $L) { left: $L; right: $R; } @mixin offset-lr($L: auto, $R: $L) { @include offset-h($L, $R); } @mixin lr($L: auto, $R: $L) { @include offset-h($L, $R); }
@mixin margin-v($T: 0, $B: $T) { margin-top: $T; margin-bottom: $B; } @mixin margin-tb($T: 0, $B: $T) { @include margin-v($T, $B); }
@mixin margin-h($L: 0, $R: $L) { margin-left: $L; margin-right: $R; } @mixin margin-lr($L: 0, $R: $L) { @include margin-h($L, $R); }
@mixin padding-v($T, $B: $T) { padding-top: $T; padding-bottom: $B; } @mixin padding-tb($T, $B: $T) { @include padding-v($T, $B); }
@mixin padding-h($L, $R: $L) { padding-left: $L; padding-right: $R; } @mixin padding-lr($L, $R: $L) { @include padding-h($L, $R); }
@mixin size($W, $H: $W) { width: $W; height: $H; } @mixin wh($W, $H: $W) { @include size($W, $H); } @mixin hw($H, $W: $H) { @include size($W, $H); }
@mixin max-size($W, $H: $W) { max-width: $W; max-height: $H; } @mixin max-wh($W, $H: $W) { @include max-size($W, $H); } @mixin max-hw($H, $W: $H) { @include max-size($W, $H); }
@mixin min-size($W, $H: $W) { min-width: $W; min-height: $H; } @mixin min-wh($W, $H: $W) { @include min-size($W, $H); } @mixin min-hw($H, $W: $H) { @include min-size($W, $H); }
@mixin min($Min) { @media screen and (min-width: #{$Min}) { @content; } }
@mixin max($Max) { @media screen and (max-width: #{$Max}) { @content; } }
@mixin min-max($Min, $Max) { @media screen and (min-width: #{$Min}) and (max-width: #{$Max}) { @content; } }
@mixin max-min($Max, $Min) { @include min-max($Min, $Max) { @content; } }
@mixin keyframes($N) { @-webkit-keyframes #{$N} { @content; } @-epub-keyframes #{$N} { @content; } @-moz-keyframes #{$N} { @content; } @-ms-keyframes #{$N} { @content; } @keyframes #{$N} { @content; } }
@mixin text-combine-upright_all() { -webkit-text-combine: horizontal; text-combine: horizontal; -ms-text-combine-horizontal: all; text-combine-horizontal: all; text-combine-upright: all; }
@mixin prefix($P, $V) { -webkit-#{$P}: $V; -epub-#{$P}: $V; -moz-#{$P}: $V; -ms-#{$P}: $V; @content; #{$P}: $V; }
@mixin writing-mode($V, $D: ltr) {
@include prefix(writing-mode, $V) {
$V2: null;
@if $V == vertical-lr { $V2: tb-lr; }
@else if $V == vertical-rl { $V2: tb-rl; }
@else if $D == rtl { $V2: rl-tb; }
@else { $V2: lr-tb; }
@if $V2 != null { -ms-writing-mode: $V2; }
}
direction: $D;
}
@mixin NonVisual() {
display: block !important;
position: absolute !important;
overflow: hidden !important;
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
left: 0 !important;
top: 0 !important;
width: 0 !important;
height: 0 !important;
background: transparent !important;
}
// ================================================================================
// + Temporary
// --------------------------------------------------------------------------------
// - Scrollbars
// --------------------------------------------------------------------------------
$TEMPORARY__Scrollbar-Track_Size: 15px;
$TEMPORARY__Scrollbar-Thumb_Size: 8px;
// ================================================================================
// + Invariables
// --------------------------------------------------------------------------------
// - Z-Indexes
// --------------------------------------------------------------------------------
$INVARIABLE__Main_ZIndex: 1;
$INVARIABLE__Main-Book_ZIndex: 1;
$INVARIABLE__Scrollbar_ZIndex: $INVARIABLE__Main_ZIndex + 1;
$INVARIABLE__Sub_ZIndex: 10;
$INVARIABLE__Veil_ZIndex: 100;
$INVARIABLE__Veil-Cover_ZIndex: 1;
$INVARIABLE__Veil-Play_ZIndex: 10;
$INVARIABLE__Veil-ByeBye_ZIndex: 100;
$INVARIABLE__Catcher_ZIndex: $INVARIABLE__Veil_ZIndex + 1;
$INVARIABLE__Panel_ZIndex: 1000;
$INVARIABLE__Slider_ZIndex: 10000;
$INVARIABLE__Nombre_ZIndex: $INVARIABLE__Slider_ZIndex + 1;
$INVARIABLE__Menu_ZIndex: 100000;
$INVARIABLE__Arrow_ZIndex: $INVARIABLE__Menu_ZIndex + 1;
$INVARIABLE__Subpanel_ZIndex: $INVARIABLE__Menu_ZIndex + 10;
$INVARIABLE__PoweredBy_ZIndex: 1000000;
$INVARIABLE__Help_ZIndex: 10000000;
$INVARIABLE__Notifier_ZIndex: 100000000;
$INVARIABLE__Spinner_ZIndex: 99999999999;
// - MixIns
// --------------------------------------------------------------------------------
@mixin GLOBAL__FontIcon_BaseStyles($SCOPED__FamilyName, $SCOPED__FontSize: 100%, $SCOPED__LineHeight: 1) {
font: #{$SCOPED__FontSize} / #{$SCOPED__LineHeight} $SCOPED__FamilyName;
font-feature-settings: "kern", "liga", "clig", "calt"; -ms-font-feature-settings: "kern", "liga", "clig", "calt"; text-transform: none;
-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizelegibility;
speak: none; direction: ltr; letter-spacing: 0; white-space: nowrap; word-wrap: normal; overflow-wrap: normal;
}