From 60b9f7ee15c28ad253444b9f9e9b90ab4b8e5956 Mon Sep 17 00:00:00 2001
From: Peer Richelsen <peeroke@richelsen.net>
Date: Mon, 2 Aug 2021 18:30:30 +0200
Subject: [PATCH 1/7] replaced logo at login

---
 pages/auth/login.tsx | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/pages/auth/login.tsx b/pages/auth/login.tsx
index fbc608a8..ac68957a 100644
--- a/pages/auth/login.tsx
+++ b/pages/auth/login.tsx
@@ -10,7 +10,7 @@ export default function Login({ csrfToken }) {
         <link rel="icon" href="/favicon.ico" />
       </Head>
       <div className="sm:mx-auto sm:w-full sm:max-w-md">
-        <img className="h-6 mx-auto" src="/calendso-logo-word.svg" alt="Calendso Logo" />
+        <img className="h-6 mx-auto" src="/calendso-logo-white-word.svg" alt="Calendso Logo" />
         <h2 className="mt-6 text-center text-3xl font-bold text-neutral-900">Sign in to your account</h2>
       </div>
 
@@ -69,7 +69,10 @@ export default function Login({ csrfToken }) {
           </form>
         </div>
         <div className="mt-4 text-neutral-600 text-center text-sm">
-          Don&apos;t have an account? <a href="#" className="font-medium text-neutral-900">Create an account</a>
+          Don&apos;t have an account?{" "}
+          <a href="#" className="font-medium text-neutral-900">
+            Create an account
+          </a>
         </div>
       </div>
     </div>

From aaa86888db8297e3fc2b638486868bab24ea5fd6 Mon Sep 17 00:00:00 2001
From: Peer Richelsen <peeroke@richelsen.net>
Date: Mon, 2 Aug 2021 18:31:49 +0200
Subject: [PATCH 2/7] added create account link for hosted

---
 pages/auth/login.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/pages/auth/login.tsx b/pages/auth/login.tsx
index ac68957a..bf83b392 100644
--- a/pages/auth/login.tsx
+++ b/pages/auth/login.tsx
@@ -69,8 +69,8 @@ export default function Login({ csrfToken }) {
           </form>
         </div>
         <div className="mt-4 text-neutral-600 text-center text-sm">
-          Don&apos;t have an account?{" "}
-          <a href="#" className="font-medium text-neutral-900">
+          Don&apos;t have an account? {/* replace this with your account creation flow */}
+          <a href="https://checkout.calendso.com" className="font-medium text-neutral-900">
             Create an account
           </a>
         </div>

From d08b4ba0f369edc03ad28db65f9370c3b5317e62 Mon Sep 17 00:00:00 2001
From: Peer Richelsen <peeroke@richelsen.net>
Date: Mon, 2 Aug 2021 18:32:45 +0200
Subject: [PATCH 3/7] changed colors of password reset

---
 pages/auth/forgot-password/index.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/pages/auth/forgot-password/index.tsx b/pages/auth/forgot-password/index.tsx
index 98a60bbe..f3a29636 100644
--- a/pages/auth/forgot-password/index.tsx
+++ b/pages/auth/forgot-password/index.tsx
@@ -113,7 +113,7 @@ export default function Page({ csrfToken }) {
                   <button
                     type="submit"
                     disabled={loading}
-                    className={`w-full flex justify-center py-2 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-black ${
+                    className={`w-full flex justify-center py-2 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-black hover:bg-gray-900 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-black ${
                       loading ? "cursor-not-allowed" : ""
                     }`}>
                     {loading && (
@@ -142,7 +142,7 @@ export default function Page({ csrfToken }) {
                   <Link href="/auth/login">
                     <button
                       type="button"
-                      className="w-full flex justify-center py-2 px-4 text-sm font-medium text-blue-600 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-black">
+                      className="w-full flex justify-center py-2 px-4 text-sm font-medium text-black focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-black">
                       Login
                     </button>
                   </Link>

From 0eb7cea1e1519bbbda5b7277f36270f86040c38b Mon Sep 17 00:00:00 2001
From: Peer Richelsen <peeroke@richelsen.net>
Date: Mon, 2 Aug 2021 18:38:02 +0200
Subject: [PATCH 4/7] fixed integration CTA

---
 pages/integrations/index.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/pages/integrations/index.tsx b/pages/integrations/index.tsx
index 0740271a..f7ad0c36 100644
--- a/pages/integrations/index.tsx
+++ b/pages/integrations/index.tsx
@@ -99,8 +99,8 @@ export default function Home({ integrations }) {
       <Shell
         heading="Integrations"
         subtitle="Connect your favourite apps."
-        noPaddingBottom>
-        <div className="text-right py-2">
+        noPaddingBottom
+        CTA={
           <button
             onClick={toggleAddModal}
             type="button"
@@ -108,7 +108,7 @@ export default function Home({ integrations }) {
             <PlusIcon className="w-5 h-5 mr-1" />
             Add new integration
           </button>
-        </div>
+        }>
         <div className="bg-white shadow overflow-hidden rounded-sm mb-8">
           {integrations.filter((ig) => ig.credential).length !== 0 ? (
             <ul className="divide-y divide-gray-200">

From d549c0321d8216785b5f46d1a44c8ecce54b35a1 Mon Sep 17 00:00:00 2001
From: Peer Richelsen <peeroke@richelsen.net>
Date: Mon, 2 Aug 2021 18:38:26 +0200
Subject: [PATCH 5/7] fixed integration CTA

---
 pages/integrations/index.tsx | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/pages/integrations/index.tsx b/pages/integrations/index.tsx
index f7ad0c36..ae8c5457 100644
--- a/pages/integrations/index.tsx
+++ b/pages/integrations/index.tsx
@@ -16,6 +16,7 @@ import { Switch } from "@headlessui/react";
 
 export default function Home({ integrations }) {
   const [session, loading] = useSession();
+
   const [showAddModal, setShowAddModal] = useState(false);
   const [showSelectCalendarModal, setShowSelectCalendarModal] = useState(false);
   const [selectableCalendars, setSelectableCalendars] = useState([]);
@@ -86,7 +87,11 @@ export default function Home({ integrations }) {
   useEffect(loadCalendars, [integrations]);
 
   if (loading) {
-    return <div className="loader"><span className="loader-inner"></span></div>;
+    return (
+      <div className="loader">
+        <span className="loader-inner"></span>
+      </div>
+    );
   }
 
   return (

From b11cace4faee308b4e70a63ef258aa31860298eb Mon Sep 17 00:00:00 2001
From: Peer Richelsen <peeroke@richelsen.net>
Date: Mon, 2 Aug 2021 18:40:39 +0200
Subject: [PATCH 6/7] fixed integration CTA

---
 pages/integrations/[integration].tsx | 5 +----
 1 file changed, 1 insertion(+), 4 deletions(-)

diff --git a/pages/integrations/[integration].tsx b/pages/integrations/[integration].tsx
index 52f14144..8cdaa93a 100644
--- a/pages/integrations/[integration].tsx
+++ b/pages/integrations/[integration].tsx
@@ -40,10 +40,7 @@ export default function integration(props) {
         <link rel="icon" href="/favicon.ico" />
       </Head>
 
-      <Shell heading={getIntegrationName(props.integration.type)}>
-        <div className="flex mb-8">
-          <p className="text-sm text-neutral-500">Manage and delete integrations.</p>
-        </div>
+      <Shell heading={getIntegrationName(props.integration.type)} subtitle="Manage and delete integrations.">
         <div className="grid grid-cols-3 gap-4">
           <div className="col-span-2 bg-white shadow overflow-hidden rounded-sm">
             <div className="px-4 py-5 sm:px-6">

From a35ac3487b21b5478d2e24b9d86448522c0c27d9 Mon Sep 17 00:00:00 2001
From: Peer Richelsen <peeroke@richelsen.net>
Date: Mon, 2 Aug 2021 18:54:27 +0200
Subject: [PATCH 7/7] fixed layout for bookings on mobile

---
 pages/bookings/index.tsx | 34 +++++++++++++++++++---------------
 1 file changed, 19 insertions(+), 15 deletions(-)

diff --git a/pages/bookings/index.tsx b/pages/bookings/index.tsx
index 3ed8272c..5ad51831 100644
--- a/pages/bookings/index.tsx
+++ b/pages/bookings/index.tsx
@@ -32,7 +32,7 @@ export default function Bookings({ bookings }) {
         <link rel="icon" href="/favicon.ico" />
       </Head>
       <Shell heading="Bookings" subtitle="See upcoming and past events booked through your event type links.">
-        <div className="flex flex-col">
+        <div className="-mx-4 sm:mx-auto flex flex-col">
           <div className="-my-2 overflow-x-auto sm:-mx-6 lg:-mx-8">
             <div className="py-2 align-middle inline-block min-w-full sm:px-6 lg:px-8">
               <div className="shadow overflow-hidden border-b border-gray-200 sm:rounded-sm">
@@ -43,10 +43,7 @@ export default function Bookings({ bookings }) {
                       .concat(bookings.filter((booking) => booking.confirmed || booking.rejected))
                       .map((booking) => (
                         <tr key={booking.id}>
-                          <td
-                            className={
-                              "px-6 py-4 whitespace-nowrap" + (booking.rejected ? " line-through" : "")
-                            }>
+                          <td className={"px-6 py-4" + (booking.rejected ? " line-through" : "")}>
                             {!booking.confirmed && !booking.rejected && (
                               <span className="ml-2 inline-flex items-center px-1.5 py-0.5 rounded-sm text-xs font-medium bg-yellow-100 text-yellow-800">
                                 Unconfirmed
@@ -56,13 +53,20 @@ export default function Bookings({ bookings }) {
                               {booking.attendees[0].name}
                             </div>
                             <div className="text-sm text-gray-500">{booking.attendees[0].email}</div>
+                            <div
+                              style={{ maxWidth: 150 }}
+                              className="block lg:hidden font-medium text-xs text-gray-900 truncate">
+                              {booking.title}
+                            </div>
                           </td>
                           <td
                             className={
                               "px-6 py-4 max-w-20 w-full" + (booking.rejected ? " line-through" : "")
                             }>
-                            <div className="text-sm text-neutral-900 font-medium">{booking.title}</div>
-                            <div className="text-sm text-neutral-500">
+                            <div className="hidden lg:block text-sm text-neutral-900 font-medium">
+                              {booking.title}
+                            </div>
+                            <div className="hidden lg:block text-sm text-neutral-500">
                               You and {booking.attendees[0].name}
                             </div>
                           </td>
@@ -74,28 +78,28 @@ export default function Bookings({ bookings }) {
                           <td className="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
                             {!booking.confirmed && !booking.rejected && (
                               <>
-                                <a
+                                <button
                                   onClick={() => confirmBookingHandler(booking, true)}
-                                  className="cursor-pointer text-blue-600 hover:text-blue-900">
+                                  className="text-xs sm:text-sm inline-flex items-center px-4 py-2 border-transparent font-medium rounded-sm shadow-sm text-neutral-700 bg-white hover:bg-neutral-100 border border-neutral-300 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-black ml-2">
                                   Confirm
-                                </a>
-                                <a
+                                </button>
+                                <button
                                   onClick={() => confirmBookingHandler(booking, false)}
-                                  className="cursor-pointer ml-4 text-blue-600 hover:text-blue-900">
+                                  className="text-xs sm:text-sm ml-4 inline-flex items-center px-4 py-2 border-transparent font-medium rounded-sm shadow-sm text-neutral-700 bg-white hover:bg-neutral-100 border border-neutral-300 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-black ml-2">
                                   Reject
-                                </a>
+                                </button>
                               </>
                             )}
                             {booking.confirmed && !booking.rejected && (
                               <>
                                 <a
                                   href={window.location.href + "/../cancel/" + booking.uid}
-                                  className="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-sm shadow-sm text-neutral-700 bg-white hover:bg-neutral-100 border border-neutral-300 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-black mr-2">
+                                  className="text-xs sm:text-sm inline-flex items-center px-4 py-2 border-transparent font-medium rounded-sm shadow-sm text-neutral-700 bg-white hover:bg-neutral-100 border border-neutral-300 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-black ml-2">
                                   Cancel
                                 </a>
                                 <a
                                   href={window.location.href + "/../reschedule/" + booking.uid}
-                                  className="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-sm shadow-sm text-neutral-700 bg-white hover:bg-neutral-100 border border-neutral-300 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-black mr-2">
+                                  className="text-xs sm:text-sm inline-flex items-center px-4 py-2 border-transparent font-medium rounded-sm shadow-sm text-neutral-700 bg-white hover:bg-neutral-100 border border-neutral-300 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-black ml-2">
                                   Reschedule
                                 </a>
                               </>