feat(LOY-422): Upcoming Stays Redesign * feat(LOY-422): Upcoming Stays Redesign * feat(LOY-422): Carousel next/previous arrows * chore(LOY-422): add new material icon * refactor(LOY-422): restructure new and old upcoming stays * fix(LOY-422): handle less than 1 case * chore(LOY-422): remove uneeded id * chore(LOY-422): remove intl label for date edge case Approved-by: Matilda Landström
34 lines
601 B
CSS
34 lines
601 B
CSS
.container {
|
|
display: grid;
|
|
gap: var(--Space-x3);
|
|
align-items: center;
|
|
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;
|
|
}
|
|
|
|
@media screen and (min-width: 768px) {
|
|
.container {
|
|
grid-template-columns: 1fr auto;
|
|
grid-template-areas:
|
|
"availableRoomsCount filters"
|
|
"noAvailabilityAlert noAvailabilityAlert";
|
|
}
|
|
}
|