diff --git a/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomsList/ScrollToList.tsx b/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomsList/ScrollToList.tsx index 221d6dfd3..db21b079b 100644 --- a/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomsList/ScrollToList.tsx +++ b/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomsList/ScrollToList.tsx @@ -16,15 +16,19 @@ export default function ScrollToList() { // Required to prevent the history.pushState on the first selection // to scroll user back to top requestAnimationFrame(() => { - const SCROLL_OFFSET = 100 - const selectedInputRoomCard = document.querySelector( - `.${styles.roomList} li:has(input[type=radio]:checked)` + const SCROLL_OFFSET = 173 // summary on mobile is 163px + + const selectedRateCard: HTMLElement | null = document.querySelector( + `.${styles.roomList} label:has(input[type=radio]:checked)` ) - if (selectedInputRoomCard) { - const elementPosition = - selectedInputRoomCard.getBoundingClientRect().top + + if (selectedRateCard) { + const elementPosition = selectedRateCard.getBoundingClientRect().top + const windowHeight = window.innerHeight const offsetPosition = - elementPosition + window.scrollY - SCROLL_OFFSET + elementPosition + + window.scrollY - + (windowHeight - selectedRateCard.offsetHeight - SCROLL_OFFSET) window.scrollTo({ top: offsetPosition,