From 0b1625b67819db0f8ed686c9b72318bac91d0d7b Mon Sep 17 00:00:00 2001 From: Tobias Johansson Date: Fri, 11 Apr 2025 10:45:07 +0000 Subject: [PATCH] Merged in feat/SW-1526-select-room-rate-focus (pull request #1732) fix(SW-1526): adjusted scroll position when selecting a rate * fix: adjusted scroll position when selecting a rate * fix Approved-by: Michael Zetterberg --- .../Rooms/RoomsList/ScrollToList.tsx | 18 +++++++++++------- 1 file changed, 11 insertions(+), 7 deletions(-) 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,