Landing page button upgrade

voynow · Oct 11, 2024 · 7c7151a · 7c7151a
1 parent 042718c
commit 7c7151a
Show file tree

Hide file tree

Showing 5 changed files with 40 additions and 36 deletions.
diff --git a/test.ipynb b/test.ipynb
@@ -139,7 +139,7 @@
   },
   {
    "cell_type": "code",
-   "execution_count": 4,
+   "execution_count": 7,
    "metadata": {},
    "outputs": [],
    "source": [
@@ -150,7 +150,7 @@
   },
   {
    "cell_type": "code",
-   "execution_count": null,
+   "execution_count": 6,
    "metadata": {},
    "outputs": [],
    "source": [
@@ -162,9 +162,9 @@
     "# import os\n",
     "# from pprint import pprint\n",
     "\n",
-    "# user = get_user()\n",
+    "# user = get_user(145941425)\n",
     "# strava_client = get_strava_client(user.athlete_id)\n",
-    "# sysmsg_base = f\"{COACH_ROLE}\\nYour client has included the following preferences: {user.preferences}\\n\"\n",
+    "# sysmsg_base = f\"{COACH_ROLE}\\nYour client has included the following preferences: {user.preferences}\\nLets do 4 days of running ONLY.\"\n",
     "# activities_df = get_activities_df(strava_client)\n",
     "# day_of_week_summaries = get_day_of_week_summaries(activities_df)\n",
     "# weekly_summaries = get_weekly_summaries(activities_df)\n",
@@ -179,7 +179,7 @@
   },
   {
    "cell_type": "code",
-   "execution_count": null,
+   "execution_count": 8,
    "metadata": {},
    "outputs": [],
    "source": [
@@ -197,7 +197,7 @@
   },
   {
    "cell_type": "code",
-   "execution_count": 7,
+   "execution_count": 1,
    "metadata": {},
    "outputs": [
     {
@@ -206,22 +206,22 @@
        "{'message': 'Endpoint request timed out'}"
       ]
      },
-     "execution_count": 7,
+     "execution_count": 1,
      "metadata": {},
      "output_type": "execute_result"
     }
    ],
    "source": [
-    "import requests\n",
-    "import os\n",
+    "# import requests\n",
+    "# import os\n",
     "\n",
-    "url = \"https://lwg77yq7dd.execute-api.us-east-1.amazonaws.com/prod/signup\"\n",
+    "# url = \"https://lwg77yq7dd.execute-api.us-east-1.amazonaws.com/prod/signup\"\n",
     "\n",
-    "response = requests.post(url, json={\n",
-    "    \"trigger_test_key\": os.environ[\"TRIGGER_TEST_KEY\"]\n",
-    "})\n",
+    "# response = requests.post(url, json={\n",
+    "#     \"trigger_test_key\": os.environ[\"TRIGGER_TEST_KEY\"]\n",
+    "# })\n",
     "\n",
-    "response.json()"
+    "# response.json()"
    ]
   },
   {

diff --git a/web/src/app/components/ImageCarousel.tsx b/web/src/app/components/ImageCarousel.tsx
@@ -19,7 +19,7 @@ export default function ImageCarousel(): JSX.Element {
     }, []);
 
     return (
-        <div className="mt-16 max-w-4xl w-full">
+        <div className="mt-20 max-w-4xl w-full">
             <div className="relative overflow-hidden">
                 <div
                     className="flex transition-transform duration-500 ease-in-out"

diff --git a/web/src/app/components/Navbar.tsx b/web/src/app/components/Navbar.tsx
@@ -16,13 +16,13 @@ export default function Navbar(): JSX.Element {
     };
 
     return (
-        <nav className="fixed top-0 w-full bg-white shadow-sm text-gray-800 z-10">
-            <div className="px-4 flex justify-between items-center h-16">
+        <nav className="fixed top-0 w-full bg-gray-100 text-gray-800 z-10">
+            <div className="px-8 flex justify-between items-center h-16">
                 <Link href="/" className="text-3xl font-bold hover:text-gray-500 transition duration-300 ease-in-out">
-                    Track<span className="text-blue-400">Flow</span>
+                    Track<span className="text-blue-500">Flow</span>
                 </Link>
                 <button
-                    className="text-white bg-gray-800 hover:bg-gray-700 font-semibold rounded-full px-4 py-2 transition duration-300 ease-in-out flex items-center space-x-2"
+                    className="px-4 py-2 text-gray-800 bg-white font-semibold rounded-3xl flex space-x-2 outline outline-2 outline-gray-800 hover:scale-105 hover:shadow-lg transition duration-300 ease-in-out"
                     onClick={handleSignIn}
                 >
                     <svg className="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">

diff --git a/web/src/app/page.tsx b/web/src/app/page.tsx
@@ -10,22 +10,24 @@ export default function Home(): JSX.Element {
   const router = useRouter();
 
   return (
-    <div className="bg-gray-100 text-gray-800 min-h-screen">
+    <div className="bg-gray-100 text-gray-800 pt-8 min-h-screen">
       <Navbar />
       <main className="flex flex-col items-center justify-center px-4 py-16 sm:px-6 lg:px-8">
         <div className="text-center">
           <h1 className="text-5xl sm:text-6xl font-extrabold tracking-tight mb-4 mt-12">
             Track<span className="text-blue-400">Flow</span> 🏃‍♂️🎯
           </h1>
           <p className="text-xl sm:text-2xl text-gray-400 mb-8">
-            AI-Powered Training Plans, Tailored Just for You
+            Step into the Next Generation of Training
           </p>
-          <button
-            className="bg-red-600 hover:bg-red-500 text-white font-bold py-3 px-6 rounded-full text-lg transition duration-300 ease-in-out"
-            onClick={() => router.push('/signup')}
-          >
-            Get Started
-          </button>
+          <div className="space-y-4">
+            <button
+              className="px-6 py-3 text-white bg-gradient-to-r from-blue-400 to-indigo-600 font-bold rounded-full text-2xl hover:scale-105 hover:shadow-lg transition duration-300 ease-in-out transform hover:-translate-y-1"
+              onClick={() => router.push('/signup')}
+            >
+              Join the Community
+            </button>
+          </div>
         </div>
 
         <ImageCarousel />

diff --git a/web/src/app/signup/page.tsx b/web/src/app/signup/page.tsx
@@ -42,15 +42,17 @@ export default function SignUpPage(): JSX.Element {
                         required
                         className="appearance-none rounded-lg relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 focus:z-10 sm:text-sm"
                     />
-                    <button
-                        type="submit"
-                        className="group relative w-full flex justify-center py-3 px-4 border border-transparent text-sm font-medium rounded-lg text-white bg-blue-500 hover:bg-blue-400 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 transition duration-150 ease-in-out"
-                    >
-                        <span className="absolute left-0 inset-y-0 flex items-center pl-3">
-                            <Image src="/strava-icon.png" alt="Strava Logo" width={20} height={20} />
-                        </span>
-                        Sign up with Strava
-                    </button>
+                    <div className="flex justify-center">
+                        <button
+                            type="submit"
+                            className="w-[65%] flex justify-center py-3 text-lg font-bold rounded-3xl text-orange-600 bg-white outline outline-2 outline-orange-600 hover:scale-105 hover:shadow-lg transition-all duration-300 ease-in-out"
+                        >
+                            Sign Up
+                            <span className="ml-2 my-auto">
+                                <Image src="/strava-icon.png" alt="Strava Logo" width={20} height={20} />
+                            </span>
+                        </button>
+                    </div>
                 </form>
             </div>
         </div>