| @@ -1,5 +1,5 @@ | ||
| 1 | -:where(.elementor-lightbox) { | |
| 1 | +.elementor-lightbox { | |
| 2 | 2 | --lightbox-ui-color: rgba(238, 238, 238, 0.9); |
| 3 | 3 | --lightbox-ui-color-hover: #fff; |
| 4 | 4 | --lightbox-text-color: var(--lightbox-ui-color); |
| 5 | 5 | --lightbox-header-icons-size: 20px; |
| @@ -4,9 +4,8 @@ | ||
| 4 | 4 | --lightbox-text-color: var(--lightbox-ui-color); |
| 5 | 5 | --lightbox-header-icons-size: 20px; |
| 6 | 6 | --lightbox-navigation-icons-size: 25px; |
| 7 | 7 | } |
| 8 | - | |
| 9 | 8 | .elementor-lightbox:not(.elementor-popup-modal) .dialog-header, |
| 10 | 9 | .elementor-lightbox:not(.elementor-popup-modal) .dialog-message { |
| 11 | 10 | text-align: center; |
| 12 | 11 | } |
| @@ -117,8 +116,27 @@ | ||
| 117 | 116 | .elementor-lightbox .elementor-video-container .elementor-video-portrait iframe, |
| 118 | 117 | .elementor-lightbox .elementor-video-container .elementor-video-portrait video { |
| 119 | 118 | aspect-ratio: var(--video-aspect-ratio, 1.77777); |
| 120 | 119 | } |
| 120 | +@supports not (aspect-ratio: 1/1) { | |
| 121 | + .elementor-lightbox .elementor-video-container .elementor-video-square, | |
| 122 | + .elementor-lightbox .elementor-video-container .elementor-video-landscape, | |
| 123 | + .elementor-lightbox .elementor-video-container .elementor-video-portrait { | |
| 124 | + position: relative; | |
| 125 | + overflow: hidden; | |
| 126 | + height: 0; | |
| 127 | + padding-bottom: calc(100% / var(--video-aspect-ratio, 1.77777)); | |
| 128 | + } | |
| 129 | + .elementor-lightbox .elementor-video-container .elementor-video-square iframe, | |
| 130 | + .elementor-lightbox .elementor-video-container .elementor-video-square video, | |
| 131 | + .elementor-lightbox .elementor-video-container .elementor-video-landscape iframe, | |
| 132 | + .elementor-lightbox .elementor-video-container .elementor-video-landscape video, | |
| 133 | + .elementor-lightbox .elementor-video-container .elementor-video-portrait iframe, | |
| 134 | + .elementor-lightbox .elementor-video-container .elementor-video-portrait video { | |
| 135 | + position: absolute; | |
| 136 | + inset: 0; | |
| 137 | + } | |
| 138 | +} | |
| 121 | 139 | .elementor-lightbox .elementor-video-container .elementor-video-square iframe, |
| 122 | 140 | .elementor-lightbox .elementor-video-container .elementor-video-square video { |
| 123 | 141 | width: min(90vh, 90vw); |
| 124 | 142 | height: min(90vh, 90vw); |
| @@ -161,9 +179,9 @@ | ||
| 161 | 179 | right: 0; |
| 162 | 180 | } |
| 163 | 181 | .elementor-lightbox .swiper .swiper-pagination-fraction { |
| 164 | 182 | width: max-content; |
| 165 | - color: currentColor; | |
| 183 | + color: #ffffff; | |
| 166 | 184 | } |
| 167 | 185 | .elementor-lightbox .elementor-swiper-button:focus { |
| 168 | 186 | outline-width: 1px; |
| 169 | 187 | } |
| @@ -174,49 +192,17 @@ | ||
| 174 | 192 | width: 15%; |
| 175 | 193 | justify-content: center; |
| 176 | 194 | font-size: var(--lightbox-navigation-icons-size); |
| 177 | 195 | } |
| 178 | -@media (max-width: 1024px) { | |
| 179 | - .elementor-lightbox .elementor-swiper-button-prev:active, .elementor-lightbox .elementor-swiper-button-next:active { | |
| 180 | - -webkit-tap-highlight-color: transparent; /* fallback for some Androids */ | |
| 181 | - -webkit-tap-highlight-color: rgba(0, 0, 0, 0); | |
| 182 | - } | |
| 183 | - .elementor-lightbox .elementor-swiper-button-prev svg, | |
| 184 | - .elementor-lightbox .elementor-swiper-button-prev i, .elementor-lightbox .elementor-swiper-button-next svg, | |
| 185 | - .elementor-lightbox .elementor-swiper-button-next i { | |
| 186 | - cursor: pointer; | |
| 187 | - } | |
| 188 | - .elementor-lightbox .elementor-swiper-button-prev svg:active, | |
| 189 | - .elementor-lightbox .elementor-swiper-button-prev i:active, .elementor-lightbox .elementor-swiper-button-next svg:active, | |
| 190 | - .elementor-lightbox .elementor-swiper-button-next i:active { | |
| 191 | - outline: none; | |
| 192 | - background-color: rgba(0, 0, 0, 0.5); | |
| 193 | - } | |
| 194 | -} | |
| 195 | 196 | @media (max-width: 767px) { |
| 196 | 197 | .elementor-lightbox .elementor-swiper-button:focus { |
| 197 | 198 | outline: none; |
| 198 | 199 | } |
| 199 | - .elementor-lightbox .elementor-swiper-button-prev:active, .elementor-lightbox .elementor-swiper-button-next:active { | |
| 200 | - -webkit-tap-highlight-color: transparent; /* fallback for some Androids */ | |
| 201 | - -webkit-tap-highlight-color: rgba(0, 0, 0, 0); | |
| 202 | - } | |
| 203 | 200 | .elementor-lightbox .elementor-swiper-button-prev, .elementor-lightbox .elementor-swiper-button-next { |
| 204 | 201 | width: 20%; |
| 205 | 202 | } |
| 206 | 203 | .elementor-lightbox .elementor-swiper-button-prev i, .elementor-lightbox .elementor-swiper-button-next i { |
| 207 | 204 | padding: 10px; |
| 208 | - background-color: rgba(0, 0, 0, 0.5); | |
| 209 | - } | |
| 210 | - .elementor-lightbox .elementor-swiper-button-prev svg, | |
| 211 | - .elementor-lightbox .elementor-swiper-button-prev i, .elementor-lightbox .elementor-swiper-button-next svg, | |
| 212 | - .elementor-lightbox .elementor-swiper-button-next i { | |
| 213 | - cursor: pointer; | |
| 214 | - } | |
| 215 | - .elementor-lightbox .elementor-swiper-button-prev svg:active, | |
| 216 | - .elementor-lightbox .elementor-swiper-button-prev i:active, .elementor-lightbox .elementor-swiper-button-next svg:active, | |
| 217 | - .elementor-lightbox .elementor-swiper-button-next i:active { | |
| 218 | - outline: none; | |
| 219 | 205 | background-color: rgba(0, 0, 0, 0.5); |
| 220 | 206 | } |
| 221 | 207 | .elementor-lightbox .elementor-swiper-button-prev { |
| 222 | 208 | left: 0; |
