style-rtl.css (10104B)
1 /** 2 * Colors 3 */ 4 /** 5 * Breakpoints & Media Queries 6 */ 7 /** 8 * SCSS Variables. 9 * 10 * Please use variables from this sheet to ensure consistency across the UI. 11 * Don't add to this sheet unless you're pretty sure the value will be reused in many places. 12 * For example, don't add rules to this sheet that affect block visuals. It's purely for UI. 13 */ 14 /** 15 * Colors 16 */ 17 /** 18 * Fonts & basic variables. 19 */ 20 /** 21 * Grid System. 22 * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/ 23 */ 24 /** 25 * Dimensions. 26 */ 27 /** 28 * Shadows. 29 */ 30 /** 31 * Editor widths. 32 */ 33 /** 34 * Block & Editor UI. 35 */ 36 /** 37 * Block paddings. 38 */ 39 /** 40 * React Native specific. 41 * These variables do not appear to be used anywhere else. 42 */ 43 /** 44 * Breakpoint mixins 45 */ 46 /** 47 * Long content fade mixin 48 * 49 * Creates a fading overlay to signify that the content is longer 50 * than the space allows. 51 */ 52 /** 53 * Focus styles. 54 */ 55 /** 56 * Applies editor left position to the selector passed as argument 57 */ 58 /** 59 * Styles that are reused verbatim in a few places 60 */ 61 /** 62 * Allows users to opt-out of animations via OS-level preferences. 63 */ 64 /** 65 * Reset default styles for JavaScript UI based pages. 66 * This is a WP-admin agnostic reset 67 */ 68 /** 69 * Reset the WP Admin page styles for Gutenberg-like pages. 70 */ 71 .wp-block-gallery, 72 .blocks-gallery-grid { 73 display: flex; 74 flex-wrap: wrap; 75 list-style-type: none; 76 padding: 0; 77 margin: 0; 78 } 79 .wp-block-gallery .blocks-gallery-image, 80 .wp-block-gallery .blocks-gallery-item, 81 .blocks-gallery-grid .blocks-gallery-image, 82 .blocks-gallery-grid .blocks-gallery-item { 83 margin: 0 0 1em 1em; 84 display: flex; 85 flex-grow: 1; 86 flex-direction: column; 87 justify-content: center; 88 position: relative; 89 align-self: flex-start; 90 width: calc(50% - 1em); 91 } 92 .wp-block-gallery .blocks-gallery-image:nth-of-type(even), 93 .wp-block-gallery .blocks-gallery-item:nth-of-type(even), 94 .blocks-gallery-grid .blocks-gallery-image:nth-of-type(even), 95 .blocks-gallery-grid .blocks-gallery-item:nth-of-type(even) { 96 margin-left: 0; 97 } 98 .wp-block-gallery .blocks-gallery-image figure, 99 .wp-block-gallery .blocks-gallery-item figure, 100 .blocks-gallery-grid .blocks-gallery-image figure, 101 .blocks-gallery-grid .blocks-gallery-item figure { 102 margin: 0; 103 height: 100%; 104 } 105 @supports (position: sticky) { 106 .wp-block-gallery .blocks-gallery-image figure, 107 .wp-block-gallery .blocks-gallery-item figure, 108 .blocks-gallery-grid .blocks-gallery-image figure, 109 .blocks-gallery-grid .blocks-gallery-item figure { 110 display: flex; 111 align-items: flex-end; 112 justify-content: flex-start; 113 } 114 } 115 .wp-block-gallery .blocks-gallery-image img, 116 .wp-block-gallery .blocks-gallery-item img, 117 .blocks-gallery-grid .blocks-gallery-image img, 118 .blocks-gallery-grid .blocks-gallery-item img { 119 display: block; 120 max-width: 100%; 121 height: auto; 122 width: 100%; 123 } 124 @supports (position: sticky) { 125 .wp-block-gallery .blocks-gallery-image img, 126 .wp-block-gallery .blocks-gallery-item img, 127 .blocks-gallery-grid .blocks-gallery-image img, 128 .blocks-gallery-grid .blocks-gallery-item img { 129 width: auto; 130 } 131 } 132 .wp-block-gallery .blocks-gallery-image figcaption, 133 .wp-block-gallery .blocks-gallery-item figcaption, 134 .blocks-gallery-grid .blocks-gallery-image figcaption, 135 .blocks-gallery-grid .blocks-gallery-item figcaption { 136 position: absolute; 137 bottom: 0; 138 width: 100%; 139 max-height: 100%; 140 overflow: auto; 141 padding: 3em 0.77em 0.7em; 142 color: #fff; 143 text-align: center; 144 font-size: 0.8em; 145 background: linear-gradient(0deg, rgba(0, 0, 0, 0.7) 0, rgba(0, 0, 0, 0.3) 70%, transparent); 146 box-sizing: border-box; 147 margin: 0; 148 } 149 .wp-block-gallery .blocks-gallery-image figcaption img, 150 .wp-block-gallery .blocks-gallery-item figcaption img, 151 .blocks-gallery-grid .blocks-gallery-image figcaption img, 152 .blocks-gallery-grid .blocks-gallery-item figcaption img { 153 display: inline; 154 } 155 .wp-block-gallery figcaption, 156 .blocks-gallery-grid figcaption { 157 flex-grow: 1; 158 } 159 .wp-block-gallery.is-cropped .blocks-gallery-image, .wp-block-gallery.is-cropped .blocks-gallery-item, 160 .blocks-gallery-grid.is-cropped .blocks-gallery-image, 161 .blocks-gallery-grid.is-cropped .blocks-gallery-item { 162 align-self: inherit; 163 } 164 .wp-block-gallery.is-cropped .blocks-gallery-image a, 165 .wp-block-gallery.is-cropped .blocks-gallery-image img, .wp-block-gallery.is-cropped .blocks-gallery-item a, 166 .wp-block-gallery.is-cropped .blocks-gallery-item img, 167 .blocks-gallery-grid.is-cropped .blocks-gallery-image a, 168 .blocks-gallery-grid.is-cropped .blocks-gallery-image img, 169 .blocks-gallery-grid.is-cropped .blocks-gallery-item a, 170 .blocks-gallery-grid.is-cropped .blocks-gallery-item img { 171 width: 100%; 172 } 173 @supports (position: sticky) { 174 .wp-block-gallery.is-cropped .blocks-gallery-image a, 175 .wp-block-gallery.is-cropped .blocks-gallery-image img, .wp-block-gallery.is-cropped .blocks-gallery-item a, 176 .wp-block-gallery.is-cropped .blocks-gallery-item img, 177 .blocks-gallery-grid.is-cropped .blocks-gallery-image a, 178 .blocks-gallery-grid.is-cropped .blocks-gallery-image img, 179 .blocks-gallery-grid.is-cropped .blocks-gallery-item a, 180 .blocks-gallery-grid.is-cropped .blocks-gallery-item img { 181 height: 100%; 182 flex: 1; 183 -o-object-fit: cover; 184 object-fit: cover; 185 } 186 } 187 .wp-block-gallery.columns-1 .blocks-gallery-image, .wp-block-gallery.columns-1 .blocks-gallery-item, 188 .blocks-gallery-grid.columns-1 .blocks-gallery-image, 189 .blocks-gallery-grid.columns-1 .blocks-gallery-item { 190 width: 100%; 191 margin-left: 0; 192 } 193 @media (min-width: 600px) { 194 .wp-block-gallery.columns-3 .blocks-gallery-image, .wp-block-gallery.columns-3 .blocks-gallery-item, 195 .blocks-gallery-grid.columns-3 .blocks-gallery-image, 196 .blocks-gallery-grid.columns-3 .blocks-gallery-item { 197 width: calc(33.3333333333% - 0.6666666667em); 198 margin-left: 1em; 199 } 200 .wp-block-gallery.columns-4 .blocks-gallery-image, .wp-block-gallery.columns-4 .blocks-gallery-item, 201 .blocks-gallery-grid.columns-4 .blocks-gallery-image, 202 .blocks-gallery-grid.columns-4 .blocks-gallery-item { 203 width: calc(25% - 0.75em); 204 margin-left: 1em; 205 } 206 .wp-block-gallery.columns-5 .blocks-gallery-image, .wp-block-gallery.columns-5 .blocks-gallery-item, 207 .blocks-gallery-grid.columns-5 .blocks-gallery-image, 208 .blocks-gallery-grid.columns-5 .blocks-gallery-item { 209 width: calc(20% - 0.8em); 210 margin-left: 1em; 211 } 212 .wp-block-gallery.columns-6 .blocks-gallery-image, .wp-block-gallery.columns-6 .blocks-gallery-item, 213 .blocks-gallery-grid.columns-6 .blocks-gallery-image, 214 .blocks-gallery-grid.columns-6 .blocks-gallery-item { 215 width: calc(16.6666666667% - 0.8333333333em); 216 margin-left: 1em; 217 } 218 .wp-block-gallery.columns-7 .blocks-gallery-image, .wp-block-gallery.columns-7 .blocks-gallery-item, 219 .blocks-gallery-grid.columns-7 .blocks-gallery-image, 220 .blocks-gallery-grid.columns-7 .blocks-gallery-item { 221 width: calc(14.2857142857% - 0.8571428571em); 222 margin-left: 1em; 223 } 224 .wp-block-gallery.columns-8 .blocks-gallery-image, .wp-block-gallery.columns-8 .blocks-gallery-item, 225 .blocks-gallery-grid.columns-8 .blocks-gallery-image, 226 .blocks-gallery-grid.columns-8 .blocks-gallery-item { 227 width: calc(12.5% - 0.875em); 228 margin-left: 1em; 229 } 230 .wp-block-gallery.columns-1 .blocks-gallery-image:nth-of-type(1n), .wp-block-gallery.columns-1 .blocks-gallery-item:nth-of-type(1n), 231 .blocks-gallery-grid.columns-1 .blocks-gallery-image:nth-of-type(1n), 232 .blocks-gallery-grid.columns-1 .blocks-gallery-item:nth-of-type(1n) { 233 margin-left: 0; 234 } 235 .wp-block-gallery.columns-2 .blocks-gallery-image:nth-of-type(2n), .wp-block-gallery.columns-2 .blocks-gallery-item:nth-of-type(2n), 236 .blocks-gallery-grid.columns-2 .blocks-gallery-image:nth-of-type(2n), 237 .blocks-gallery-grid.columns-2 .blocks-gallery-item:nth-of-type(2n) { 238 margin-left: 0; 239 } 240 .wp-block-gallery.columns-3 .blocks-gallery-image:nth-of-type(3n), .wp-block-gallery.columns-3 .blocks-gallery-item:nth-of-type(3n), 241 .blocks-gallery-grid.columns-3 .blocks-gallery-image:nth-of-type(3n), 242 .blocks-gallery-grid.columns-3 .blocks-gallery-item:nth-of-type(3n) { 243 margin-left: 0; 244 } 245 .wp-block-gallery.columns-4 .blocks-gallery-image:nth-of-type(4n), .wp-block-gallery.columns-4 .blocks-gallery-item:nth-of-type(4n), 246 .blocks-gallery-grid.columns-4 .blocks-gallery-image:nth-of-type(4n), 247 .blocks-gallery-grid.columns-4 .blocks-gallery-item:nth-of-type(4n) { 248 margin-left: 0; 249 } 250 .wp-block-gallery.columns-5 .blocks-gallery-image:nth-of-type(5n), .wp-block-gallery.columns-5 .blocks-gallery-item:nth-of-type(5n), 251 .blocks-gallery-grid.columns-5 .blocks-gallery-image:nth-of-type(5n), 252 .blocks-gallery-grid.columns-5 .blocks-gallery-item:nth-of-type(5n) { 253 margin-left: 0; 254 } 255 .wp-block-gallery.columns-6 .blocks-gallery-image:nth-of-type(6n), .wp-block-gallery.columns-6 .blocks-gallery-item:nth-of-type(6n), 256 .blocks-gallery-grid.columns-6 .blocks-gallery-image:nth-of-type(6n), 257 .blocks-gallery-grid.columns-6 .blocks-gallery-item:nth-of-type(6n) { 258 margin-left: 0; 259 } 260 .wp-block-gallery.columns-7 .blocks-gallery-image:nth-of-type(7n), .wp-block-gallery.columns-7 .blocks-gallery-item:nth-of-type(7n), 261 .blocks-gallery-grid.columns-7 .blocks-gallery-image:nth-of-type(7n), 262 .blocks-gallery-grid.columns-7 .blocks-gallery-item:nth-of-type(7n) { 263 margin-left: 0; 264 } 265 .wp-block-gallery.columns-8 .blocks-gallery-image:nth-of-type(8n), .wp-block-gallery.columns-8 .blocks-gallery-item:nth-of-type(8n), 266 .blocks-gallery-grid.columns-8 .blocks-gallery-image:nth-of-type(8n), 267 .blocks-gallery-grid.columns-8 .blocks-gallery-item:nth-of-type(8n) { 268 margin-left: 0; 269 } 270 } 271 .wp-block-gallery .blocks-gallery-image:last-child, 272 .wp-block-gallery .blocks-gallery-item:last-child, 273 .blocks-gallery-grid .blocks-gallery-image:last-child, 274 .blocks-gallery-grid .blocks-gallery-item:last-child { 275 margin-left: 0; 276 } 277 .wp-block-gallery.alignleft, .wp-block-gallery.alignright, 278 .blocks-gallery-grid.alignleft, 279 .blocks-gallery-grid.alignright { 280 max-width: 420px; 281 width: 100%; 282 } 283 .wp-block-gallery.aligncenter .blocks-gallery-item figure, 284 .blocks-gallery-grid.aligncenter .blocks-gallery-item figure { 285 justify-content: center; 286 }