Chris@4: /**
Chris@4: * @file media_library.module.css
Chris@4: */
Chris@4: 
Chris@5: .media-library-wrapper {
Chris@5:   display: flex;
Chris@5: }
Chris@5: 
Chris@5: .media-library-menu {
Chris@5:   margin: 0;
Chris@5:   padding: 0;
Chris@5: }
Chris@5: 
Chris@5: /* @todo Use a class instead of the li element.
Chris@5:      https://www.drupal.org/project/drupal/issues/3029227 */
Chris@5: .media-library-menu li {
Chris@5:   padding: 0;
Chris@5:   list-style: none;
Chris@5: }
Chris@5: 
Chris@4: .media-library-views-form > .form-actions {
Chris@4:   flex-basis: 100%;
Chris@4: }
Chris@4: 
Chris@4: .media-library-views-form,
Chris@4: .media-library-selection,
Chris@5: .media-library-add-form__selected-media .details-wrapper,
Chris@4: .media-library-views-form__bulk_form,
Chris@4: .media-library-view .form--inline {
Chris@4:   display: flex;
Chris@4:   flex-wrap: wrap;
Chris@4: }
Chris@4: 
Chris@4: .media-library-views-form__header {
Chris@4:   flex-basis: 100%;
Chris@4: }
Chris@4: 
Chris@4: .media-library-item {
Chris@4:   position: relative;
Chris@4: }
Chris@4: 
Chris@4: .media-library-item .js-click-to-select-trigger {
Chris@4:   overflow: hidden;
Chris@4:   cursor: pointer;
Chris@4: }
Chris@4: 
Chris@4: .media-library-view .form-actions {
Chris@4:   align-self: flex-end;
Chris@4: }
Chris@4: 
Chris@4: .media-library-item .js-click-to-select-checkbox {
Chris@4:   position: absolute;
Chris@4:   z-index: 1;
Chris@4:   top: 5px;
Chris@4:   right: 0;
Chris@5:   display: block;
Chris@4: }
Chris@4: 
Chris@4: .media-library-item__status {
Chris@4:   position: absolute;
Chris@4:   top: 10px;
Chris@4:   left: 2px;
Chris@4:   pointer-events: none;
Chris@4: }
Chris@4: 
Chris@4: .media-library-select-all {
Chris@4:   flex-basis: 100%;
Chris@4:   width: 100%;
Chris@4: }
Chris@4: 
Chris@5: .media-library-view--widget .media-library-select-all {
Chris@4:   display: none;
Chris@4: }
Chris@4: 
Chris@4: .media-library-item--disabled {
Chris@4:   pointer-events: none;
Chris@4: }
Chris@4: 
Chris@4: .media-library-selection .media-library-item__preview {
Chris@4:   cursor: move;
Chris@4: }
Chris@4: 
Chris@4: /* @todo Remove or re-work in https://www.drupal.org/node/2985168 */
Chris@4: .media-library-widget .media-library-item__name a,
Chris@5: .media-library-view--widget .media-library-item__name a,
Chris@5: .media-library-add-form__selected-media .media-library-item__name a {
Chris@4:   pointer-events: none;
Chris@4: }
Chris@4: 
Chris@5: .media-library-widget-modal .ui-dialog-buttonpane {
Chris@5:   display: flex;
Chris@5:   align-items: center;
Chris@5: }
Chris@5: 
Chris@5: .media-library-widget-modal .ui-dialog-buttonpane .form-actions {
Chris@5:   flex: 1;
Chris@5: }
Chris@5: 
Chris@4: @media screen and (max-width: 600px) {
Chris@4:   .media-library-view .form-actions {
Chris@4:     flex-basis: 100%;
Chris@4:   }
Chris@4: }