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

Merged in fix/STAY-132 (pull request #3283)

Browse Source 
fix: align guarantee info button and text to the right regardless of breakpoint

* fix: align guarantee info button and text to the right regardless of breakpoint


Approved-by: Erik Tiekstra
This commit is contained in:
Christel Westerberg
2025-12-03 07:16:51 +00:00
parent c6d0223edb
commit b563a83f10
3 changed files with 13 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/GuaranteeInfo/GuaranteeInfoModal/guaranteeInfoModal.module.css
View File

@@ -12,6 +12,8 @@
color: var(--Icon-Interactive-Default); color: var(--Icon-Interactive-Default);
cursor: pointer; cursor: pointer;
flex-shrink: 0; flex-shrink: 0;
vertical-align: bottom;
margin-right: var(--Space-x05);
} }
.closeButton { .closeButton {

5
apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/GuaranteeInfo/guaranteeInfo.module.css
View File

@@ -2,6 +2,7 @@
align-items: center; align-items: center;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
gap: var(--Space-x1);
} }
.label { .label {
@@ -15,7 +16,5 @@
} }
.guaranteeInfo { .guaranteeInfo {
display: flex; text-align: right;
align-items: flex-start;
gap: var(--Space-x05);
} }

20
apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/GuaranteeInfo/index.tsx
View File

@@ -36,17 +36,15 @@ export default function GuaranteeInfo() {
</p> </p>
</Typography> </Typography>
</div> </div>
<div className={styles.guaranteeInfo}> <Typography variant="Body/Paragraph/mdRegular">
<GuaranteeInfoModal /> <span className={styles.guaranteeInfo}>
<Typography variant="Body/Paragraph/mdRegular"> <GuaranteeInfoModal />
<p> {intl.formatMessage({
{intl.formatMessage({ id: "myStay.roomHeldAfter18",
id: "myStay.roomHeldAfter18", defaultMessage: "Room held after 18:00",
defaultMessage: "Room held after 18:00", })}
})} </span>
</p> </Typography>
</Typography>
</div>
</div> </div>
) )
} }