src/wolnelektury/static/2022/styles/base/_icons.scss

   1 /* ------------------------------
   2     Base: Icons
   3 ------------------------------ */
   4
   5 $icomoon-font-family: "wl" !default;
   6 $icomoon-font-path:   "../fonts" !default;
   7
   8 $icon-liked: "\e900";
   9 $icon-arrow-right: "\e901";
  10 $icon-arrow-up: "\e902";
  11 $icon-audio: "\e903";
  12 $icon-book: "\e904";
  13 $icon-eye: "\e905";
  14 $icon-play: "\e906";
  15 $icon-quote: "\e907";
  16 $icon-search: "\e908";
  17 $icon-acc-1: "\e909";
  18 $icon-acc-2: "\e90a";
  19 $icon-acc-3: "\e90b";
  20 $icon-all: "\e90c";
  21 $icon-arrow-down: "\e90d";
  22
  23 @font-face {
  24   font-family: '#{$icomoon-font-family}';
  25   src:
  26     url('#{$icomoon-font-path}/#{$icomoon-font-family}.ttf?79zz52') format('truetype'),
  27     url('#{$icomoon-font-path}/#{$icomoon-font-family}.woff?79zz52') format('woff'),
  28     url('#{$icomoon-font-path}/#{$icomoon-font-family}.svg?79zz52##{$icomoon-font-family}') format('svg');
  29   font-weight: normal;
  30   font-style: normal;
  31   font-display: block;
  32 }
  33
  34 [class^="icon-"], [class*=" icon-"] {
  35   /* use !important to prevent issues with browser extensions that change fonts */
  36   font-family: '#{$icomoon-font-family}' !important;
  37   speak: never;
  38   font-style: normal;
  39   font-weight: normal;
  40   font-variant: normal;
  41   text-transform: none;
  42   line-height: 1;
  43
  44   /* Better Font Rendering =========== */
  45   -webkit-font-smoothing: antialiased;
  46   -moz-osx-font-smoothing: grayscale;
  47 }
  48
  49 .icon-liked {
  50   &:before {
  51     content: $icon-liked;
  52   }
  53 }
  54 .icon-arrow-right {
  55   &:before {
  56     content: $icon-arrow-right;
  57   }
  58 }
  59 .icon-arrow-up {
  60   &:before {
  61     content: $icon-arrow-up;
  62   }
  63 }
  64 .icon-audio {
  65   &:before {
  66     content: $icon-audio;
  67   }
  68 }
  69 .icon-book {
  70   &:before {
  71     content: $icon-book;
  72   }
  73 }
  74 .icon-eye {
  75   &:before {
  76     content: $icon-eye;
  77   }
  78 }
  79 .icon-play {
  80   &:before {
  81     content: $icon-play;
  82   }
  83 }
  84 .icon-quote {
  85   &:before {
  86     content: $icon-quote;
  87   }
  88 }
  89 .icon-search {
  90   &:before {
  91     content: $icon-search;
  92   }
  93 }
  94 .icon-acc-1 {
  95   &:before {
  96     content: $icon-acc-1;
  97   }
  98 }
  99 .icon-acc-2 {
 100   &:before {
 101     content: $icon-acc-2;
 102   }
 103 }
 104 .icon-acc-3 {
 105   &:before {
 106     content: $icon-acc-3;
 107   }
 108 }
 109 .icon-all {
 110   &:before {
 111     content: $icon-all;
 112   }
 113 }
 114 .icon-arrow-down {
 115   &:before {
 116     content: $icon-arrow-down;
 117   }
 118 }