src/wolnelektury/static/2022/more.scss

   1 .is-open {
   2     height: 100%;
   3     overflow-y: hidden;
   4 }
   5
   6 .l-change-pop {
   7     margin-top: 18px;
   8 }
   9 .is-open .l-change-pop {
  10     height: auto;
  11     margin-top: 18px;
  12     padding: 10px 50px;
  13 }
  14
  15 .l-navigation {
  16     //opacity: .5;
  17 }
  18
  19 .l-navigation__menu {
  20     overflow-y: scroll;
  21 }
  22 .l-navigation__menu__book__info {
  23     img {
  24         width: 42px;
  25         height: 60px;
  26     }
  27 }
  28 .l-navigation__login {
  29     color: #74BDC2;
  30     margin-right: 20px;
  31
  32     a {
  33         color: white;
  34     }
  35 }
  36 .l-navigation__actions {
  37     .user {
  38         margin-right: 25px;
  39     }
  40 }
  41
  42
  43 .l-books {
  44     margin-right: -17px;
  45 }
  46 .l-books__grid {
  47     margin-right: -17px;
  48 }
  49
  50 .l-books__item {
  51     width: 212px;
  52
  53     margin-right: 17px !important; // reverse the 5n+5 rule.
  54
  55     transition: opacity .1s, all cubic-bezier(0.25, 1, 0.5, 1) 350ms;
  56 }
  57
  58
  59 .by-popularity {
  60     .l-books__item {
  61         order: attr(data-pop);
  62     }
  63 }
  64
  65
  66
  67 .toggle-input {
  68     left: calc(50% - 77px/2);
  69     opacity: 0;
  70     position: absolute;
  71     //top: 0;
  72     height: 26px;
  73     width: 77px;
  74     z-index: 2;
  75
  76     &:checked {
  77         z-index: 0;
  78     }
  79 }
  80
  81
  82 .l-checkout__payments {
  83     display: none;
  84 }
  85 .toggle-input{
  86     &#switch-once:checked {
  87         ~.l-switch__wrapper {
  88             label {
  89                 &:nth-of-type(1) { color: #003C3C; }
  90                 &:nth-of-type(2) { color: #74BDC2; }
  91             }
  92             .toggle {
  93                 left: 5px;
  94             }
  95         }
  96         ~.payments-once {
  97             display: flex;
  98         }
  99     }
 100     &#switch-monthly:checked {
 101         ~.l-switch__wrapper {
 102             label {
 103                 &:nth-of-type(1) { color: #74BDC2; }
 104                 &:nth-of-type(2) { color: #003C3C; }
 105             }
 106             .toggle {
 107                 left: 39px;
 108             }
 109         }
 110         ~.payments-recurring {
 111             display: flex;
 112         }
 113     }
 114 }
 115
 116
 117
 118 .l-checkout__form__row {
 119     .iframe {
 120         margin-bottom: 16px;
 121     }
 122 }
 123
 124
 125
 126 .l-books__item__content {
 127     width: 100%;
 128
 129     .fragment-text {
 130         max-width: 390px;
 131         margin-top: 20px;
 132         font-weight: 400;
 133         font-size: 18px;
 134         font-size: 1.125rem;
 135         line-height: 150%;
 136         color: #474747;
 137
 138         h1, h2, h3, h4 {
 139             font-size: 1em;
 140         }
 141     }
 142 }