1
0
www.mikescher.com/www/data/css/styles_config.scss

93 lines
2.4 KiB
SCSS
Raw Normal View History

2018-01-20 03:05:15 +01:00
$COL_BACKGROUND: #EEE;
$COL_BACKGROUND_2: #E0E0E0;
$COL_BACKGROUND_3: #F8F8F8;
$COL_TEXT_NORMAL: #CCC;
$COL_TEXT_DARK_DARKER: #222;
$COL_TEXT_DARK: #333;
$COL_TEXT_DARK_LIGHTER: #555;
$COL_TRANSPARENT: #FFFFFF00;
$COL_COMPLEXHOVER_BG: white;
$COL_COMPLEXHOVER_FG: black;
$COL_COMPLEXHOVER_BRD: black;
2018-01-20 03:05:15 +01:00
$COL_GITHUB: #4078C0;
$COL_HIGHLIGHT_RED: #442222;
2018-01-27 14:21:34 +01:00
$COL_HIGHLIGHT_BLUE: #222244;
2017-12-29 00:40:57 +01:00
2018-12-22 21:46:30 +01:00
$FONT_HEADER: Lato, "Helvetica Neue", Helvetica, Arial, sans-serif;
$FONT_CODE: Consolas, Monaco, "Courier New", Menlo, monospace;
$FONT_DEFAULT: 'Times New Roman', serif;
2018-01-20 14:41:21 +01:00
// [0] ResponsiveDesign Minimal Mobile
// content_width = auto
// header = vertical
$RD_0_MINIMOBILE_MIN: 0px; /* 400px */
$RD_0_MINIMOBILE_MAX: 767px;
// [1] ResponsiveDesign Normal Mobile
// content_width = auto
// header = vertical
$RD_1_NORMMOBILE_MIN: 768px;
$RD_1_NORMMOBILE_MAX: 850px;
// [2] ResponsiveDesign Small Desktop
// content_width = auto
// header = vertical
$RD_2_SMALLDESKTOP_MIN: 851px;
$RD_2_SMALLDESKTOP_MAX: 991px;
// [3] ResponsiveDesign Medium Desktop
// content_width = auto
// header = vertical
$RD_3_MEDDESKTOP_MIN: 992px;
$RD_3_MEDDESKTOP_MAX: 1199px;
// [4] ResponsiveDesign Large Desktop
// content_width = auto
// header = vertical
$RD_4_LARGEDESKTOP_MIN: 1200px;
$RD_4_LARGEDESKTOP_MAX: 99999px;
@function rdmedia_expr($min, $max) {
$w1: "";
$w2: "";
@if ($min == 0) { $w1: $RD_0_MINIMOBILE_MIN; }
@if ($min == 1) { $w1: $RD_1_NORMMOBILE_MIN; }
@if ($min == 2) { $w1: $RD_2_SMALLDESKTOP_MIN; }
@if ($min == 3) { $w1: $RD_3_MEDDESKTOP_MIN; }
@if ($min == 4) { $w1: $RD_4_LARGEDESKTOP_MIN; }
@if ($max == 0) { $w2: $RD_0_MINIMOBILE_MAX; }
@if ($max == 1) { $w2: $RD_1_NORMMOBILE_MAX; }
@if ($max == 2) { $w2: $RD_2_SMALLDESKTOP_MAX; }
@if ($max == 3) { $w2: $RD_3_MEDDESKTOP_MAX; }
@if ($max == 4) { $w2: $RD_4_LARGEDESKTOP_MAX; }
@if (($min == 0) and ($max == 4)) { @return "(all)"; }
@if ($min == 0 ) { @return "(max-width:"+$w2+")"; }
@if ($max == 4 ) { @return "(min-width:"+$w1+")"; }
@return "(min-width:"+$w1+") and (max-width:"+$w2+")";
}
@mixin rdmedia_range($min, $max) {
@media #{rdmedia_expr($min, $max)}
{
@content;
}
}
@mixin rdmedia($lvl) {
@media #{rdmedia_expr($lvl, $lvl)}
{
@content;
}
}