fix: height of booking timeline

one-zero-eight · Sep 29, 2024 · 0491f27 · 0491f27
1 parent ec244b3
commit 0491f27
Show file tree

Hide file tree

Showing 3 changed files with 3 additions and 4 deletions.
diff --git a/src/app/routes/_with_menu/room-booking.tsx b/src/app/routes/_with_menu/room-booking.tsx
@@ -5,7 +5,7 @@ import { Helmet } from "react-helmet-async";
 
 export const Route = createFileRoute("/_with_menu/room-booking")({
   component: () => (
-    <div className="flex h-full flex-col p-4 @container/content @2xl/main:p-12">
+    <div className="flex h-[100dvh] flex-col p-4 @container/content @2xl/main:p-12">
       <Helmet>
         <title>Room booking</title>
         <meta
@@ -18,7 +18,7 @@ export const Route = createFileRoute("/_with_menu/room-booking")({
         title="Room booking"
         description="Book auditoriums and meeting rooms in Innopolis University."
       />
-      <div className="mt-4 flex-grow">
+      <div className="mt-4 flex-grow overflow-hidden">
         <RoomBookingPage />
       </div>
     </div>

diff --git a/src/components/room-booking/BookingTimeline.vue b/src/components/room-booking/BookingTimeline.vue
@@ -603,7 +603,6 @@ $time-block-width: 50px;
 
   &-scroller {
     position: relative;
-    max-height: 100%;
     overflow: auto;
     overscroll-behavior: contain;
     scrollbar-width: none;

diff --git a/src/components/room-booking/RoomBookingPage.tsx b/src/components/room-booking/RoomBookingPage.tsx
@@ -18,7 +18,7 @@ export function RoomBookingPage() {
   return (
     <>
       <BookingTimeline
-        className="h-full"
+        className="flex max-h-full"
         onBooking={(data) => {
           setBookingModalData(data);
           setModalOpen(true);