// -------------------------------------------------- // Variables used throughout the theme // -------------------------------------------------- // Layout dimensions // -------------------------------------------------- $small-width: 800px !default; $medium-width: 995px !default; $large-width: 1110px !default; // Brand color variables // -------------------------------------------------- $google: #5b76f7 !default; $facebook: #3b5998 !default; $cas: #70BA61 !default; $twitter: #00bced !default; $yahoo: #810293 !default; $github: #6d6d6d !default; // Fonts // -------------------------------------------------- $base-font-size: 14px !default; $base-line-height: 19px !default; $base-font-family: Helvetica, Arial, sans-serif !default; /* These files don't actually exist. They're injected by DiscourseSassImporter. */ @import "theme_variables"; @import "plugins_variables"; @import "common/foundation/math"; // Color Utilities // w3c definition of color brightness @function brightness($color) { @return ((red($color) * .299) + (green($color) * .587) + (blue($color) * .114)); } // Replaces dark-light-diff($primary, $secondary, 50%, -50%) // Uses an approximation of sRGB blending, GAMMA=2 instead of GAMMA=2.2 @function choose-grey($percent) { $ratio: ($percent / 100%); $iratio: 1 - $ratio; $pr2: red($primary) * red($primary); $pg2: green($primary) * green($primary); $pb2: blue($primary) * blue($primary); $sr2: red($secondary) * red($secondary); $sg2: green($secondary) * green($secondary); $sb2: blue($secondary) * blue($secondary); $rr2: $pr2 * $ratio + $sr2 * $iratio; $rg2: $pg2 * $ratio + $sg2 * $iratio; $rb2: $pb2 * $ratio + $sb2 * $iratio; $rr: sqrt($rr2); $rg: sqrt($rg2); $rb: sqrt($rb2); @return rgb($rr, $rg, $rb); } @function dark-light-diff($adjusted-color, $comparison-color, $lightness, $darkness) { @if brightness($adjusted-color) < brightness($comparison-color) { @return scale-color($adjusted-color, $lightness: $lightness); } @else { @return scale-color($adjusted-color, $lightness: $darkness); } } @function dark-light-choose($light-theme-result, $dark-theme-result) { @if brightness($primary) < brightness($secondary) { @return $light-theme-result; } @else { @return $dark-theme-result; } }