src/wolnelektury/static/2022/styles/vendors/slick-theme.scss

   1 /* Slider */
   2 .slick-loading .slick-list
   3 {
   4     background: #fff url('./ajax-loader.gif') center center no-repeat;
   5 }
   6
   7 /* Icons */
   8 @font-face
   9 {
  10     font-family: 'slick';
  11     font-weight: normal;
  12     font-style: normal;
  13
  14     src: url('./fonts/slick.eot');
  15     src: url('./fonts/slick.eot?#iefix') format('embedded-opentype'), url('./fonts/slick.woff') format('woff'), url('./fonts/slick.ttf') format('truetype'), url('./fonts/slick.svg#slick') format('svg');
  16 }
  17 /* Arrows */
  18 .slick-prev,
  19 .slick-next
  20 {
  21     font-size: 0;
  22     line-height: 0;
  23
  24     position: absolute;
  25     top: 50%;
  26
  27     display: block;
  28
  29   width: 16px;
  30   height: 28px;
  31     padding: 0;
  32     -webkit-transform: translate(0, -50%);
  33     -ms-transform: translate(0, -50%);
  34     transform: translate(0, -50%);
  35
  36     cursor: pointer;
  37
  38     color: transparent;
  39     border: none;
  40     outline: none;
  41     background: transparent;
  42 }
  43 .slick-prev:hover,
  44 .slick-prev:focus,
  45 .slick-next:hover,
  46 .slick-next:focus
  47 {
  48     color: transparent;
  49     outline: none;
  50     background: transparent;
  51 }
  52 .slick-prev:hover:before,
  53 .slick-prev:focus:before,
  54 .slick-next:hover:before,
  55 .slick-next:focus:before
  56 {
  57     opacity: 1;
  58 }
  59 .slick-prev.slick-disabled:before,
  60 .slick-next.slick-disabled:before
  61 {
  62     opacity: .25;
  63 }
  64
  65 .slick-prev:before,
  66 .slick-next:before
  67 {
  68     font-family: 'slick';
  69     font-size: 20px;
  70     line-height: 1;
  71
  72     opacity: 1;
  73     color: white;
  74
  75     -webkit-font-smoothing: antialiased;
  76     -moz-osx-font-smoothing: grayscale;
  77
  78   width: 16px;
  79   height: 28px;
  80 }
  81
  82 .slick-prev
  83 {
  84     left: -25px;
  85 }
  86 [dir='rtl'] .slick-prev
  87 {
  88     right: -25px;
  89     left: auto;
  90 }
  91 .slick-prev:before
  92 {
  93   content: "";
  94   display: block;
  95     background: url(../images/arrow-left.png) center no-repeat;
  96 }
  97 [dir='rtl'] .slick-prev:before
  98 {
  99     content: '→';
 100 }
 101
 102 .slick-next
 103 {
 104     right: -25px;
 105 }
 106 [dir='rtl'] .slick-next
 107 {
 108     right: auto;
 109     left: -25px;
 110 }
 111 .slick-next:before
 112 {
 113   content: "";
 114   display: block;
 115   background: url(../images/arrow-right.png) center no-repeat;
 116 }
 117 [dir='rtl'] .slick-next:before
 118 {
 119     content: '←';
 120 }
 121
 122 /* Dots */
 123 .slick-dotted.slick-slider
 124 {
 125     margin-bottom: 30px;
 126 }
 127
 128 .slick-dots
 129 {
 130   position: absolute;
 131   bottom: -45px;
 132   display: block;
 133   width: 100%;
 134   padding: 0;
 135   margin: 0;
 136   list-style: none;
 137   text-align: center;
 138 }
 139 .slick-dots li
 140 {
 141     position: relative;
 142
 143     display: inline-block;
 144
 145     width: 10px;
 146     height: 10px;
 147     margin: 0 5px;
 148     padding: 0;
 149
 150     cursor: pointer;
 151 }
 152 .slick-dots li button
 153 {
 154     font-size: 0;
 155     line-height: 0;
 156
 157     display: block;
 158
 159     width: 10px;
 160     height: 10px;
 161     padding: 5px;
 162
 163     cursor: pointer;
 164
 165     color: transparent;
 166     border: 0;
 167     outline: none;
 168     background: transparent;
 169 }
 170 .slick-dots li button:hover,
 171 .slick-dots li button:focus
 172 {
 173     outline: none;
 174 }
 175 .slick-dots li button:hover:before,
 176 .slick-dots li button:focus:before
 177 {
 178     opacity: 1;
 179 }
 180 .slick-dots li button:before
 181 {
 182     font-size: 0;
 183     line-height: 20px;
 184
 185     position: absolute;
 186     top: 0;
 187     left: 0;
 188
 189     width: 10px;
 190     height: 10px;
 191   border-radius: 50%;
 192   background-color: white;
 193
 194     content: '';
 195     text-align: center;
 196
 197     opacity: 1;
 198     color: black;
 199
 200     -webkit-font-smoothing: antialiased;
 201     -moz-osx-font-smoothing: grayscale;
 202 }
 203 .slick-dots li.slick-active button:before
 204 {
 205     opacity: 1;
 206   background-color: #007880;
 207 }