| @@ -67,14 +67,8 @@ | ||
| 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 | -/** | |
| 77 | 71 | * Applies editor left position to the selector passed as argument |
| 78 | 72 | */ |
| 79 | 73 | /** |
| 80 | 74 | * Styles that are reused verbatim in a few places |
| @@ -105,9 +99,8 @@ | ||
| 105 | 99 | |
| 106 | 100 | .media-author-field__avatar img { |
| 107 | 101 | width: 16px; |
| 108 | 102 | height: 16px; |
| 109 | - -o-object-fit: cover; | |
| 110 | 103 | object-fit: cover; |
| 111 | 104 | opacity: 1; |
| 112 | 105 | border-radius: 100%; |
| 113 | 106 | } |
| @@ -141,19 +134,8 @@ | ||
| 141 | 134 | text-overflow: ellipsis; |
| 142 | 135 | overflow: hidden; |
| 143 | 136 | } |
| 144 | 137 | |
| 145 | -.dataviews-view-table .dataviews-media-field__filename, | |
| 146 | -.dataviews-view-grid .dataviews-media-field__filename, | |
| 147 | -.dataviews-view-list .dataviews-media-field__filename { | |
| 148 | - display: inline-block; | |
| 149 | - max-inline-size: 15ch; | |
| 150 | - overflow: hidden; | |
| 151 | - text-overflow: ellipsis; | |
| 152 | - white-space: nowrap; | |
| 153 | - vertical-align: top; | |
| 154 | -} | |
| 155 | - | |
| 156 | 138 | .dataviews-media-field__media-thumbnail { |
| 157 | 139 | display: flex; |
| 158 | 140 | align-items: center; |
| 159 | 141 | position: relative; |
| @@ -176,9 +158,8 @@ | ||
| 176 | 158 | .dataviews-media-field__media-thumbnail--image { |
| 177 | 159 | display: block; |
| 178 | 160 | width: 100%; |
| 179 | 161 | height: 100%; |
| 180 | - -o-object-fit: cover; | |
| 181 | 162 | object-fit: cover; |
| 182 | 163 | } |
| 183 | 164 | |
| 184 | 165 | .dataviews-media-field__media-thumbnail__stack { |
| @@ -198,10 +179,10 @@ | ||
| 198 | 179 | text-align: center; |
| 199 | 180 | padding: 0 16px; |
| 200 | 181 | width: 100%; |
| 201 | 182 | container-type: inline-size; |
| 202 | - font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; | |
| 203 | - font-weight: var(--wpds-typography-font-weight-default, 400); | |
| 183 | + font-family: -apple-system, "system-ui", "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; | |
| 184 | + font-weight: 400; | |
| 204 | 185 | font-size: 12px; |
| 205 | 186 | line-height: 16px; |
| 206 | 187 | } |
| 207 | 188 | |
| @@ -283,14 +264,8 @@ | ||
| 283 | 264 | /** |
| 284 | 265 | * Focus styles. |
| 285 | 266 | */ |
| 286 | 267 | /** |
| 287 | - * Standard focus rings for the WordPress Design System. | |
| 288 | - * | |
| 289 | - * Apply `outset-ring__focus` inside the relevant pseudo-class at the call site, | |
| 290 | - * e.g. `&:focus { @include outset-ring__focus(); }`. | |
| 291 | - */ | |
| 292 | -/** | |
| 293 | 268 | * Applies editor left position to the selector passed as argument |
| 294 | 269 | */ |
| 295 | 270 | /** |
| 296 | 271 | * Styles that are reused verbatim in a few places |
| @@ -312,9 +287,9 @@ | ||
| 312 | 287 | .media-upload-modal .components-modal__header { |
| 313 | 288 | padding-bottom: 8px; |
| 314 | 289 | } |
| 315 | 290 | .media-upload-modal .components-modal__frame.is-full-screen .components-modal__content { |
| 316 | - margin-bottom: 0; | |
| 291 | + margin-bottom: 16px; | |
| 317 | 292 | } |
| 318 | 293 | .media-upload-modal .components-modal__content { |
| 319 | 294 | padding: 0; |
| 320 | 295 | } |
| @@ -320,37 +295,11 @@ | ||
| 320 | 295 | } |
| 321 | 296 | .media-upload-modal .dataviews-picker-wrapper > .dataviews__view-actions { |
| 322 | 297 | padding-top: 8px; |
| 323 | 298 | } |
| 324 | -.media-upload-modal .media-upload-modal__footer { | |
| 325 | - position: sticky; | |
| 326 | - bottom: 0; | |
| 327 | - background-color: inherit; | |
| 328 | - z-index: 2; | |
| 299 | +.media-upload-modal .dataviews-footer { | |
| 300 | + padding-bottom: 8px; | |
| 329 | 301 | } |
| 330 | -.media-upload-modal .media-upload-modal__footer.is-uploading .dataviews-picker-footer__bulk-selection { | |
| 331 | - visibility: hidden; | |
| 332 | -} | |
| 333 | -.media-upload-modal .media-upload-modal__footer .dataviews-footer { | |
| 334 | - position: static; | |
| 335 | - z-index: auto; | |
| 336 | -} | |
| 337 | -.media-upload-modal .media-upload-modal__upload-status { | |
| 338 | - position: absolute; | |
| 339 | - display: flex; | |
| 340 | - align-items: center; | |
| 341 | - gap: 8px; | |
| 342 | - background-color: var(--wp-dataviews-color-background, #fff); | |
| 343 | - left: 24px; | |
| 344 | - top: 1px; | |
| 345 | - bottom: 1px; | |
| 346 | - z-index: 1; | |
| 347 | -} | |
| 348 | -.media-upload-modal .media-upload-modal__upload-status .components-spinner { | |
| 349 | - width: 16px; | |
| 350 | - height: 16px; | |
| 351 | - margin: 0; | |
| 352 | -} | |
| 353 | 302 | |
| 354 | 303 | .media-upload-modal__snackbar { |
| 355 | 304 | position: fixed; |
| 356 | 305 | bottom: 24px; |
| @@ -370,49 +319,5 @@ | ||
| 370 | 319 | } |
| 371 | 320 | .media-upload-modal__snackbar > div { |
| 372 | 321 | transform: none !important; |
| 373 | 322 | transform-origin: 0 !important; |
| 374 | -} | |
| 375 | - | |
| 376 | -.media-upload-modal__upload-status__popover .components-popover__content { | |
| 377 | - width: 320px; | |
| 378 | -} | |
| 379 | -.media-upload-modal__upload-status__popover .media-upload-modal__upload-status__header { | |
| 380 | - display: flex; | |
| 381 | - align-items: center; | |
| 382 | - justify-content: space-between; | |
| 383 | - padding: 12px 16px; | |
| 384 | -} | |
| 385 | -.media-upload-modal__upload-status__popover .media-upload-modal__upload-status__header h3 { | |
| 386 | - margin: 0; | |
| 387 | - font-size: 13px; | |
| 388 | - font-weight: var(--wpds-typography-font-weight-emphasis, 600); | |
| 389 | -} | |
| 390 | -.media-upload-modal__upload-status__popover .media-upload-modal__upload-status__list { | |
| 391 | - max-height: 200px; | |
| 392 | - overflow-y: auto; | |
| 393 | - margin: 0; | |
| 394 | - padding: 0 0 4px; | |
| 395 | - list-style: none; | |
| 396 | -} | |
| 397 | -.media-upload-modal__upload-status__popover .media-upload-modal__upload-status__item { | |
| 398 | - display: flex; | |
| 399 | - align-items: flex-start; | |
| 400 | - margin-bottom: 0; | |
| 401 | - justify-content: space-between; | |
| 402 | - gap: 8px; | |
| 403 | - padding: 8px 16px; | |
| 404 | -} | |
| 405 | -.media-upload-modal__upload-status__popover .media-upload-modal__upload-status__item .components-spinner { | |
| 406 | - flex-shrink: 0; | |
| 407 | - width: 16px; | |
| 408 | - height: 16px; | |
| 409 | - margin: 0; | |
| 410 | -} | |
| 411 | -.media-upload-modal__upload-status__popover .media-upload-modal__upload-status__filename { | |
| 412 | - overflow: hidden; | |
| 413 | - text-overflow: ellipsis; | |
| 414 | - white-space: nowrap; | |
| 415 | - min-width: 0; | |
| 416 | - flex: 1; | |
| 417 | - font-size: 12px; | |
| 418 | 323 | } |
