BOOK-510: updated booking chip/special needs filter order on mobile * BOOK-510: updated booking chip/special needs filter order on mobile * BOOK-510: updated the close button to IconButton to fix styling issues on iOS * book-510: added aria-label * BOOK-510: refctored solution * small spacing fixes * fix(BOOK-510) updated aria-label Approved-by: Erik Tiekstra
36 lines
653 B
CSS
36 lines
653 B
CSS
.container {
|
|
display: grid;
|
|
gap: var(--Space-x1);
|
|
align-items: flex-start;
|
|
grid-template-areas:
|
|
"availableRoomsCount"
|
|
"noAvailabilityAlert"
|
|
"filters";
|
|
}
|
|
|
|
.availableRoomsCount {
|
|
grid-area: availableRoomsCount;
|
|
}
|
|
|
|
.noAvailabilityAlert {
|
|
grid-area: noAvailabilityAlert;
|
|
}
|
|
|
|
.filters {
|
|
grid-area: filters;
|
|
display: flex;
|
|
gap: var(--Space-x1);
|
|
align-items: flex-start;
|
|
justify-content: flex-end;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
@media screen and (min-width: 768px) {
|
|
.container {
|
|
grid-template-columns: auto 1fr;
|
|
grid-template-areas:
|
|
"availableRoomsCount filters"
|
|
"noAvailabilityAlert noAvailabilityAlert";
|
|
}
|
|
}
|