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-lang: "\e900";
   9 $icon-tt: "\e901";
  10 $icon-yt: "\e902";
  11 $icon-ig: "\e903";
  12 $icon-fb: "\e904";
  13 $icon-filter: "\e905";
  14 $icon-like: "\e906";
  15 $icon-liked: "\e907";
  16 $icon-prev: "\e908";
  17 $icon-next: "\e909";
  18 $icon-audio: "\e90a";
  19 $icon-picture: "\e90b";
  20 $icon-book: "\e90c";
  21 $icon-book-alt: "\e90d";
  22 $icon-eye: "\e90e";
  23 $icon-play: "\e90f";
  24 $icon-pause: "\e910";
  25 $icon-volume: "\e911";
  26 $icon-mute: "\e912";
  27 $icon-quote: "\e913";
  28 $icon-search: "\e914";
  29 $icon-acc-1: "\e915";
  30 $icon-acc-2: "\e916";
  31 $icon-acc-3: "\e917";
  32 $icon-all: "\e918";
  33 $icon-arrow-left: "\e919";
  34 $icon-arrow-right: "\e91a";
  35 $icon-arrow-up: "\e91b";
  36 $icon-arrow-down: "\e91c";
  37 $icon-close: "\e91d";
  38
  39 @font-face {
  40   font-family: '#{$icomoon-font-family}';
  41   src:
  42     url('#{$icomoon-font-path}/#{$icomoon-font-family}.ttf?79zz52') format('truetype'),
  43     url('#{$icomoon-font-path}/#{$icomoon-font-family}.woff?79zz52') format('woff'),
  44     url('#{$icomoon-font-path}/#{$icomoon-font-family}.svg?79zz52##{$icomoon-font-family}') format('svg');
  45   font-weight: normal;
  46   font-style: normal;
  47   font-display: block;
  48 }
  49
  50 [class^="icon-"], [class*=" icon-"] {
  51   /* use !important to prevent issues with browser extensions that change fonts */
  52   font-family: '#{$icomoon-font-family}' !important;
  53   speak: never;
  54   font-style: normal;
  55   font-weight: normal;
  56   font-variant: normal;
  57   text-transform: none;
  58   line-height: 1;
  59
  60   /* Better Font Rendering =========== */
  61   -webkit-font-smoothing: antialiased;
  62   -moz-osx-font-smoothing: grayscale;
  63 }
  64
  65 .icon-lang {
  66   &:before {
  67     content: $icon-lang;
  68   }
  69 }
  70 .icon-tt {
  71   &:before {
  72     content: $icon-tt;
  73   }
  74 }
  75 .icon-yt {
  76   &:before {
  77     content: $icon-yt;
  78   }
  79 }
  80 .icon-ig {
  81   &:before {
  82     content: $icon-ig;
  83   }
  84 }
  85 .icon-fb {
  86   &:before {
  87     content: $icon-fb;
  88   }
  89 }
  90 .icon-filter {
  91   &:before {
  92     content: $icon-filter;
  93   }
  94 }
  95 .icon-like {
  96   &:before {
  97     content: $icon-like;
  98   }
  99 }
 100 .icon-liked {
 101   &:before {
 102     content: $icon-liked;
 103   }
 104 }
 105 .icon-prev {
 106   &:before {
 107     content: $icon-prev;
 108   }
 109 }
 110 .icon-next {
 111   &:before {
 112     content: $icon-next;
 113   }
 114 }
 115 .icon-audio {
 116   &:before {
 117     content: $icon-audio;
 118   }
 119 }
 120 .icon-picture {
 121   &:before {
 122     content: $icon-picture;
 123   }
 124 }
 125 .icon-book {
 126   &:before {
 127     content: $icon-book;
 128   }
 129 }
 130 .icon-book-alt {
 131   &:before {
 132     content: $icon-book-alt;
 133   }
 134 }
 135 .icon-eye {
 136   &:before {
 137     content: $icon-eye;
 138   }
 139 }
 140 .icon-play {
 141   &:before {
 142     content: $icon-play;
 143   }
 144 }
 145 .icon-pause {
 146   &:before {
 147     content: $icon-pause;
 148   }
 149 }
 150 .icon-volume {
 151   &:before {
 152     content: $icon-volume;
 153   }
 154 }
 155 .icon-mute {
 156   &:before {
 157     content: $icon-mute;
 158   }
 159 }
 160 .icon-quote {
 161   &:before {
 162     content: $icon-quote;
 163   }
 164 }
 165 .icon-search {
 166   &:before {
 167     content: $icon-search;
 168   }
 169 }
 170 .icon-acc-1 {
 171   &:before {
 172     content: $icon-acc-1;
 173   }
 174 }
 175 .icon-acc-2 {
 176   &:before {
 177     content: $icon-acc-2;
 178   }
 179 }
 180 .icon-acc-3 {
 181   &:before {
 182     content: $icon-acc-3;
 183   }
 184 }
 185 .icon-all {
 186   &:before {
 187     content: $icon-all;
 188   }
 189 }
 190 .icon-arrow-left {
 191   &:before {
 192     content: $icon-arrow-left;
 193   }
 194 }
 195 .icon-arrow-right {
 196   &:before {
 197     content: $icon-arrow-right;
 198   }
 199 }
 200 .icon-arrow-up {
 201   &:before {
 202     content: $icon-arrow-up;
 203   }
 204 }
 205 .icon-arrow-down {
 206   &:before {
 207     content: $icon-arrow-down;
 208   }
 209 }
 210 .icon-close {
 211   &:before {
 212     content: $icon-close;
 213   }
 214 }