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