UX: improve bulk button layout and alignment (#19966)

This commit is contained in:
Kris 2023-01-24 09:47:35 -05:00 committed by GitHub
parent 17deb79fcb
commit 7683b4bbfa
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -636,36 +636,21 @@
} }
.topic-bulk-actions-modal { .topic-bulk-actions-modal {
.modal-inner-container {
min-width: 0;
width: 100%;
}
p { p {
margin-top: 0; margin-top: 0;
} }
&.full .modal-body {
height: 400px;
max-height: 400px;
}
.bulk-buttons { .bulk-buttons {
display: flex; display: grid;
flex-wrap: wrap; grid-template-columns: repeat(auto-fit, minmax(12em, 1fr));
margin-right: -1%; gap: 0.5em;
max-width: 100%;
.btn { min-width: 0;
flex: 1 0 30%; .d-button-label {
margin-bottom: 1em; @include ellipsis;
margin-right: 1%;
white-space: nowrap;
overflow: hidden;
max-width: 33%;
@media screen and (max-width: 767px) {
flex: 1 0 48%;
max-width: 48%;
}
@include breakpoint(mobile-extra-large) {
flex: 1 1 auto;
min-width: 49%;
}
} }
} }
} }