src/wolnelektury/static/scss/tools.scss

   1 $default-em-size: 16px;
   2
   3 @mixin size($name, $args) {
   4     $rems: snowflake;
   5     @each $val in $args {
   6         $remval: $val;
   7         @if type-of($val) == number {
   8             @if unit($val) == "px" {
   9                 $remval: $val / $default-em-size * 1rem;
  10             }
  11         }
  12         // Workaround for PySCSS issue with appending to empty lists.
  13         @if $rems == snowflake {
  14             $rems: $remval;
  15         }
  16         @else {
  17             $rems: append($rems, $remval);
  18         }
  19     }
  20     #{$name}: $args;
  21     #{$name}: $rems;
  22 }
  23
  24 @mixin min-screen($size) {
  25     @if unit($size) == "px" {
  26         $size: $size / $default-em-size * 1em;
  27     }
  28
  29     @media screen and (min-width: $size) {
  30         @content;
  31     }
  32 }
  33
  34
  35 @mixin vendors($name, $args) {
  36     @include size(-moz + $name, $args);
  37     @include size(-webkit + $name, $args);
  38     @include size(-moz + $name, $args);
  39 }
  40
  41 @mixin vendors($names, $args) {
  42     @each $name in $names {
  43         @include size($name, $args);
  44     }
  45 }
  46
  47 @mixin box-shadow($args) {
  48     @include vendors(
  49         -moz-box-shadow
  50         -webkit-box-shadow
  51         box-shadow,
  52             $args);
  53 }
  54
  55 @mixin mono {
  56     font-family: "Cousine";
  57 }
  58
  59 @mixin hidden-label {
  60     display: block;
  61     @include size(width, 1px);
  62     @include size(height, 1px);
  63     overflow: hidden;
  64 }
  65
  66 @mixin white-box {
  67     @include size(border, 1px solid #ddd);
  68     background: #fff;
  69     @include box-shadow(2px 2px 2px #ddd);
  70 }