9fc65b6e53
fix(SW-998): fix issues related to non-english languages * fix(SW-998): reverse price logic Approved-by: Niclas Edenvin
143 lines
2.3 KiB
CSS
143 lines
2.3 KiB
CSS
.card {
|
|
display: flex;
|
|
flex-direction: column;
|
|
background-color: var(--Base-Surface-Primary-light-Normal);
|
|
border: 1px solid var(--Base-Border-Subtle);
|
|
border-radius: var(--Corner-radius-Medium);
|
|
width: 100%;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.card.active {
|
|
border: 1px solid var(--Base-Border-Hover);
|
|
}
|
|
|
|
.card.active {
|
|
border: 1px solid var(--Base-Border-Hover);
|
|
}
|
|
|
|
.imageContainer {
|
|
position: relative;
|
|
height: 200px;
|
|
width: 100%;
|
|
}
|
|
|
|
.imageContainer img {
|
|
object-fit: cover;
|
|
}
|
|
|
|
.hotelInformation {
|
|
margin-bottom: var(--Spacing-x-half);
|
|
}
|
|
|
|
.hotelContent {
|
|
display: flex;
|
|
flex-direction: column;
|
|
padding: var(--Spacing-x2);
|
|
}
|
|
|
|
.hotelDescription {
|
|
display: none;
|
|
}
|
|
|
|
.titleContainer {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--Spacing-x-half);
|
|
margin-top: var(--Spacing-x-half);
|
|
}
|
|
|
|
.addressContainer {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: var(--Spacing-x1);
|
|
}
|
|
|
|
.address {
|
|
display: none;
|
|
font-style: normal;
|
|
}
|
|
.facilities {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: var(--Spacing-x1);
|
|
margin-top: var(--Spacing-x-one-and-half);
|
|
}
|
|
|
|
.facilitiesItem {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: var(--Spacing-x-half);
|
|
}
|
|
|
|
.button {
|
|
min-width: 160px;
|
|
}
|
|
|
|
.specialAlerts {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--Spacing-x1);
|
|
}
|
|
|
|
.prices {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--Spacing-x-one-and-half);
|
|
}
|
|
|
|
@media screen and (min-width: 1367px) {
|
|
.card.pageListing {
|
|
flex-direction: row;
|
|
overflow: hidden;
|
|
padding: 0;
|
|
}
|
|
|
|
.pageListing .hotelDescription {
|
|
display: block;
|
|
}
|
|
|
|
.pageListing .imageContainer {
|
|
position: relative;
|
|
height: 100%;
|
|
width: 314px;
|
|
}
|
|
|
|
.pageListing .hotelInformation {
|
|
width: min(422px, 100%);
|
|
padding-right: var(--Spacing-x2);
|
|
margin: 0;
|
|
}
|
|
|
|
.pageListing .facilities {
|
|
margin: var(--Spacing-x1) 0;
|
|
}
|
|
|
|
.pageListing .hotelContent {
|
|
flex-direction: row;
|
|
align-items: center;
|
|
gap: var(--Spacing-x2);
|
|
padding-left: var(--Spacing-x3);
|
|
}
|
|
|
|
.pageListing .titleContainer {
|
|
margin-bottom: var(--Spacing-x-one-and-half);
|
|
}
|
|
|
|
.pageListing .button {
|
|
width: 100%;
|
|
}
|
|
|
|
.pageListing .addressMobile {
|
|
display: none;
|
|
}
|
|
|
|
.pageListing .address {
|
|
display: inline;
|
|
}
|
|
|
|
.pageListing .prices {
|
|
width: 260px;
|
|
}
|
|
}
|