// ================================================================================ // + 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; }