| @@ -67,8 +67,14 @@ | ||
| 67 | 67 | /** |
| 68 | 68 | * Focus styles. |
| 69 | 69 | */ |
| 70 | 70 | /** |
| 71 | + * Standard focus rings for the WordPress Design System. | |
| 72 | + * | |
| 73 | + * Apply `outset-ring__focus` inside the relevant pseudo-class at the call site, | |
| 74 | + * e.g. `&:focus { @include outset-ring__focus(); }`. | |
| 75 | + */ | |
| 76 | +/** | |
| 71 | 77 | * Applies editor left position to the selector passed as argument |
| 72 | 78 | */ |
| 73 | 79 | /** |
| 74 | 80 | * Styles that are reused verbatim in a few places |
| @@ -89,8 +95,9 @@ | ||
| 89 | 95 | */ |
| 90 | 96 | .wp-block-image > a, |
| 91 | 97 | .wp-block-image > figure > a { |
| 92 | 98 | display: inline-block; |
| 99 | + color: inherit; | |
| 93 | 100 | } |
| 94 | 101 | .wp-block-image img { |
| 95 | 102 | height: auto; |
| 96 | 103 | max-width: 100%; |
| @@ -165,20 +172,15 @@ | ||
| 165 | 172 | } |
| 166 | 173 | .wp-block-image.is-style-circle-mask img { |
| 167 | 174 | border-radius: 9999px; |
| 168 | 175 | } |
| 169 | -@supports ((-webkit-mask-image: none) or (mask-image: none)) or (-webkit-mask-image: none) { | |
| 176 | +@supports (mask-image: none) or (-webkit-mask-image: none) { | |
| 170 | 177 | .wp-block-image.is-style-circle-mask img { |
| 171 | - /* stylelint-disable-next-line function-url-quotes -- We need quotes for the data URL to use the SVG inline. */ | |
| 172 | - -webkit-mask-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><circle cx="50" cy="50" r="50"/></svg>'); | |
| 173 | - mask-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><circle cx="50" cy="50" r="50"/></svg>'); | |
| 178 | + mask-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><circle cx="50" cy="50" r="50"/></svg>'); | |
| 174 | 179 | mask-mode: alpha; |
| 175 | - -webkit-mask-repeat: no-repeat; | |
| 176 | - mask-repeat: no-repeat; | |
| 177 | - -webkit-mask-size: contain; | |
| 178 | - mask-size: contain; | |
| 179 | - -webkit-mask-position: center; | |
| 180 | - mask-position: center; | |
| 180 | + mask-repeat: no-repeat; | |
| 181 | + mask-size: contain; | |
| 182 | + mask-position: center; | |
| 181 | 183 | border-radius: 0; |
| 182 | 184 | } |
| 183 | 185 | } |
| 184 | 186 | |
