editor-rtl.css (4011B)
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 figure.wp-block-image:not(.wp-block) { 72 margin: 0; 73 } 74 75 .wp-block-image { 76 position: relative; 77 } 78 .wp-block-image .is-applying img, .wp-block-image.is-transient img { 79 opacity: 0.3; 80 } 81 .wp-block-image figcaption img { 82 display: inline; 83 } 84 .wp-block-image .components-spinner { 85 position: absolute; 86 top: 50%; 87 right: 50%; 88 margin-top: -9px; 89 margin-right: -9px; 90 } 91 .wp-block-image:not(.is-style-rounded) > div { 92 border-radius: inherit; 93 } 94 95 .wp-block-image .components-resizable-box__container { 96 display: inline-block; 97 } 98 .wp-block-image .components-resizable-box__container img { 99 display: block; 100 width: inherit; 101 height: inherit; 102 } 103 104 .block-editor-block-list__block[data-type="core/image"] .block-editor-block-toolbar .block-editor-url-input__button-modal { 105 position: absolute; 106 right: 0; 107 left: 0; 108 margin: -1px 0; 109 } 110 @media (min-width: 600px) { 111 .block-editor-block-list__block[data-type="core/image"] .block-editor-block-toolbar .block-editor-url-input__button-modal { 112 margin: -1px; 113 } 114 } 115 116 [data-align=wide] > .wp-block-image img, 117 [data-align=full] > .wp-block-image img { 118 width: 100%; 119 } 120 121 .wp-block[data-align=left] > .wp-block-image, 122 .wp-block[data-align=center] > .wp-block-image, 123 .wp-block[data-align=right] > .wp-block-image { 124 display: table; 125 } 126 .wp-block[data-align=left] > .wp-block-image > figcaption, 127 .wp-block[data-align=center] > .wp-block-image > figcaption, 128 .wp-block[data-align=right] > .wp-block-image > figcaption { 129 display: table-caption; 130 caption-side: bottom; 131 } 132 133 .wp-block[data-align=left] > .wp-block-image { 134 margin-left: 1em; 135 margin-right: 0; 136 margin-top: 0.5em; 137 margin-bottom: 0.5em; 138 } 139 140 .wp-block[data-align=right] > .wp-block-image { 141 margin-right: 1em; 142 margin-left: 0; 143 margin-top: 0.5em; 144 margin-bottom: 0.5em; 145 } 146 147 .wp-block[data-align=center] > .wp-block-image { 148 margin-right: auto; 149 margin-left: auto; 150 text-align: center; 151 } 152 153 .wp-block-image__crop-area { 154 position: relative; 155 max-width: 100%; 156 width: 100%; 157 } 158 159 .wp-block-image__crop-icon { 160 padding: 0 8px; 161 min-width: 48px; 162 display: flex; 163 justify-content: center; 164 align-items: center; 165 } 166 .wp-block-image__crop-icon svg { 167 fill: currentColor; 168 } 169 170 .wp-block-image__zoom .components-popover__content { 171 overflow: visible; 172 min-width: 260px; 173 } 174 .wp-block-image__zoom .components-range-control { 175 flex: 1; 176 } 177 .wp-block-image__zoom .components-base-control__field { 178 display: flex; 179 margin-bottom: 0; 180 flex-direction: column; 181 align-items: flex-start; 182 } 183 184 .wp-block-image__aspect-ratio { 185 height: 46px; 186 margin-bottom: -8px; 187 display: flex; 188 align-items: center; 189 } 190 .wp-block-image__aspect-ratio .components-button { 191 width: 36px; 192 padding-right: 0; 193 padding-left: 0; 194 }