From ac550f578021ab7fc3962becb3211ac5e2dc9ab6 Mon Sep 17 00:00:00 2001
From: Bailey Pumfleet <pumfleet@hey.com>
Date: Sat, 10 Apr 2021 12:21:44 +0100
Subject: [PATCH] Vertically scroll through timeslots

---
 pages/[user]/[type].tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/pages/[user]/[type].tsx b/pages/[user]/[type].tsx
index f7cfddb415..df71bb048a 100644
--- a/pages/[user]/[type].tsx
+++ b/pages/[user]/[type].tsx
@@ -99,7 +99,7 @@ export default function Type(props) {
             </Head>
 
             <main className={"mx-auto my-24 transition-max-width ease-in-out duration-500 " + (selectedDate ? 'max-w-6xl' : 'max-w-3xl')}>
-                <div className="bg-white overflow-hidden shadow rounded-lg">
+                <div className="bg-white overflow-hidden shadow rounded-lg md:max-h-96">
                     <div className="sm:flex px-4 py-5 sm:p-6">
                         <div className={"sm:border-r " + (selectedDate ? 'sm:w-1/3' : 'sm:w-1/2')}>
                             {props.user.avatar && <img src={props.user.avatar} alt="Avatar" className="w-16 h-16 rounded-full mb-4"/>}
@@ -133,7 +133,7 @@ export default function Type(props) {
                                 {calendar}
                             </div>
                         </div>
-                        {selectedDate && <div className="sm:pl-4 mt-8 sm:mt-0 text-center sm:w-1/3">
+                        {selectedDate && <div className="sm:pl-4 mt-8 sm:mt-0 text-center sm:w-1/3 md:max-h-96 overflow-y-scroll">
                             <div className="text-gray-600 font-light text-xl mb-4 text-left">
                                 <span className="w-1/2">{dayjs(selectedDate).format("dddd DD MMMM YYYY")}</span>
                             </div>