scandic/web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: update typography including missing header element in hotel cards

Browse Source 
add responsive sizes to hotel card image

removed non-existing class
This commit is contained in:
Christian Andolf
2025-05-23 16:08:09 +02:00
parent a849c48edd
commit 642a6881e2
3 changed files with 61 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
apps/scandic-web/components/HotelReservation/HotelCard/hotelCard.module.css
View File

@@ -6,6 +6,7 @@
border-radius: var(--Corner-radius-md);
width: 100%;
overflow: hidden;
color: var(--Text-Default);
}
.card.active {
@@ -27,13 +28,13 @@
}
.hotelInformation {
margin-bottom: var(--Spacing-x-half);
margin-bottom: var(--Space-x05);
}
.hotelContent {
display: flex;
flex-direction: column;
padding: var(--Spacing-x2);
padding: var(--Space-x2);
}
.hotelDescription {
@@ -43,14 +44,14 @@
.titleContainer {
display: flex;
flex-direction: column;
gap: var(--Spacing-x-half);
margin-top: var(--Spacing-x-half);
gap: var(--Space-x05);
margin-top: var(--Space-x05);
}
.addressContainer {
display: flex;
flex-wrap: wrap;
gap: var(--Spacing-x1);
gap: var(--Space-x1);
}
.address {
@@ -61,26 +62,27 @@
.facilities {
display: flex;
flex-wrap: wrap;
gap: var(--Spacing-x1);
margin-top: var(--Spacing-x-one-and-half);
gap: var(--Space-x1);
margin-top: var(--Space-x15);
}
.facilitiesItem {
display: flex;
align-items: center;
gap: var(--Spacing-x-half);
gap: var(--Space-x05);
color: var(--Text-Secondary);
}
.specialAlerts {
display: flex;
flex-direction: column;
gap: var(--Spacing-x1);
gap: var(--Space-x1);
}
.prices {
display: flex;
flex-direction: column;
gap: var(--Spacing-x-one-and-half);
gap: var(--Space-x15);
}
.link:hover {
@@ -105,7 +107,7 @@
.pointsCard {
background-color: var(--Base-Surface-Secondary-light-Normal);
padding: var(--Spacing-x-one-and-half);
padding: var(--Space-x15);
border-radius: var(--Corner-radius-md);
}
@@ -155,23 +157,23 @@
.pageListing .hotelInformation {
width: min(422px, 100%);
padding-right: var(--Spacing-x2);
padding-right: var(--Space-x2);
margin: 0;
}
.pageListing .facilities {
margin: var(--Spacing-x1) 0;
margin: var(--Space-x1) 0;
}
.pageListing .hotelContent {
flex-direction: row;
align-items: center;
gap: var(--Spacing-x2);
padding-left: var(--Spacing-x3);
gap: var(--Space-x2);
padding-left: var(--Space-x3);
}
.pageListing .titleContainer {
margin-bottom: var(--Spacing-x-one-and-half);
margin-bottom: var(--Space-x15);
}
.pageListing .fakeButton {