From 2dfbc281852e7d9f442c84ca8d58391df7259292 Mon Sep 17 00:00:00 2001
From: martin-mfg <2026226+martin-mfg@users.noreply.github.com>
Date: Fri, 14 Nov 2025 17:38:18 +0100
Subject: [PATCH] step 1: adapt layout and labels

---
 frontend/frontend/src/pages/Home/Home.js      | 12 --------
 .../frontend/src/pages/Home/stages/Login.js   | 30 +++++++++----------
 2 files changed, 15 insertions(+), 27 deletions(-)

diff --git a/frontend/frontend/src/pages/Home/Home.js b/frontend/frontend/src/pages/Home/Home.js
index a71bfc5a..ee2e3c03 100644
--- a/frontend/frontend/src/pages/Home/Home.js
+++ b/frontend/frontend/src/pages/Home/Home.js
@@ -227,18 +227,6 @@ const HomeScreen = () => {
     );
   }
 
-  if (!isAuthenticated) {
-    return (
-      <div className="h-full py-8 flex justify-center items-center">
-        <div className="text-center">
-          <h1 className="text-3xl font-bold">
-            Please sign in to access this page
-          </h1>
-        </div>
-      </div>
-    );
-  }
-
   return (
     <div className="h-full px-2 py-4 lg:p-8 text-gray-600 body-font">
       <div className="flex flex-col">
diff --git a/frontend/frontend/src/pages/Home/stages/Login.js b/frontend/frontend/src/pages/Home/stages/Login.js
index 4d4782f8..d33991a0 100644
--- a/frontend/frontend/src/pages/Home/stages/Login.js
+++ b/frontend/frontend/src/pages/Home/stages/Login.js
@@ -57,14 +57,14 @@ const LoginStage = ({ setCurrItem }) => {
                 <p className="text-sm text-gray-500 mt-1">
                   {privateAccess
                     ? 'You have granted access to both public and private repositories.'
-                    : 'You have granted access to public repositories only.'}
+                    : 'You have granted access to public repositories.'}
                 </p>
               </div>
 
               {/* Access Level Management Buttons */}
               <div className="mb-4">
                 {privateAccess ? (
-                  <div>
+                  <div className="flex items-center gap-4">
                     <a
                       href={`https://${HOST}/api/downgrade?user_key=${userKey}`}
                     >
@@ -74,13 +74,13 @@ const LoginStage = ({ setCurrItem }) => {
                         </span>
                       </Button>
                     </a>
-                    <p className="text-sm text-gray-600 mt-2">
+                    <p className="text-sm text-gray-600 flex-1">
                       Switch to public access if you prefer not to share private
                       repository data.
                     </p>
                   </div>
                 ) : (
-                  <div>
+                  <div className="flex items-center gap-4">
                     <a href={GITHUB_PRIVATE_AUTH_URL}>
                       <Button className="h-12 flex justify-center items-center w-[260px] text-white bg-blue-500 hover:bg-blue-600">
                         <span className="xl:text-lg">
@@ -88,7 +88,7 @@ const LoginStage = ({ setCurrItem }) => {
                         </span>
                       </Button>
                     </a>
-                    <p className="text-sm text-gray-600 mt-2">
+                    <p className="text-sm text-gray-600 flex-1">
                       Upgrade to include contributions from your private
                       repositories for more complete stats.
                     </p>
@@ -97,15 +97,15 @@ const LoginStage = ({ setCurrItem }) => {
               </div>
 
               {/* Logout Button */}
-              <div className="mt-6">
+              <div className="mt-6 flex items-center gap-4">
                 <Button
                   className="h-12 flex justify-center items-center w-[260px] text-black border border-black bg-white hover:bg-gray-100"
                   onClick={logout}
                 >
-                  <span className="xl:text-lg">Sign Out</span>
+                  <span className="xl:text-lg">Log Out</span>
                 </Button>
-                <p className="text-sm text-gray-600 mt-2">
-                  Sign out from your GitHub account.
+                <p className="text-sm text-gray-600 flex-1">
+                  Log out from your GitHub account.
                 </p>
               </div>
             </>
@@ -121,7 +121,7 @@ const LoginStage = ({ setCurrItem }) => {
                 </p>
               </div>
 
-              <div>
+              <div className="flex items-center gap-4 mb-4">
                 <a href={GITHUB_PUBLIC_AUTH_URL}>
                   <Button className="h-12 flex justify-center items-center w-[260px] text-white bg-blue-500 hover:bg-blue-600">
                     <GithubIcon className="w-6 h-6" />
@@ -130,12 +130,12 @@ const LoginStage = ({ setCurrItem }) => {
                     </span>
                   </Button>
                 </a>
-                <p className="text-sm text-gray-600 mt-2 mb-4">
+                <p className="text-sm text-gray-600 flex-1">
                   Generate stats based on your public repositories.
                 </p>
               </div>
 
-              <div>
+              <div className="flex items-center gap-4 mb-4">
                 <a href={GITHUB_PRIVATE_AUTH_URL}>
                   <Button className="h-12 flex justify-center items-center w-[260px] text-black border border-black bg-white hover:bg-gray-100">
                     <GithubIcon className="w-6 h-6" />
@@ -144,20 +144,20 @@ const LoginStage = ({ setCurrItem }) => {
                     </span>
                   </Button>
                 </a>
-                <p className="text-sm text-gray-600 mt-2 mb-4">
+                <p className="text-sm text-gray-600 flex-1">
                   Includes contributions in your private repositories for more
                   complete and accurate stats.
                 </p>
               </div>
 
-              <div>
+              <div className="flex items-center gap-4">
                 <Button
                   className="h-12 flex justify-center items-center w-[260px] text-black border border-black bg-white hover:bg-gray-100"
                   onClick={() => setCurrItem(1)}
                 >
                   <span className="ml-2 xl:text-lg">Continue as Guest</span>
                 </Button>
-                <p className="text-sm text-gray-600 mt-2">
+                <p className="text-sm text-gray-600 flex-1">
                   Try out Github Trends with data from an example
                   user/repository.
                 </p>