From 962bcd1ea9c6104f770bed499267e1bff82fda7c Mon Sep 17 00:00:00 2001
From: zafer <zafer@algora.io>
Date: Mon, 3 Feb 2025 17:40:40 +0300
Subject: [PATCH 1/8] fix overflows

---
 lib/algora_web/live/home_live.ex | 7 ++-----
 1 file changed, 2 insertions(+), 5 deletions(-)

diff --git a/lib/algora_web/live/home_live.ex b/lib/algora_web/live/home_live.ex
index 00a266149..f30f21368 100644
--- a/lib/algora_web/live/home_live.ex
+++ b/lib/algora_web/live/home_live.ex
@@ -129,7 +129,7 @@ defmodule AlgoraWeb.HomeLive do
       </header>
 
       <main>
-        <div class="relative isolate">
+        <div class="relative isolate overflow-hidden">
           <!-- Background pattern -->
           <div
             class="absolute inset-x-0 -top-40 -z-10 transform overflow-hidden blur-3xl sm:-top-80"
@@ -164,10 +164,7 @@ defmodule AlgoraWeb.HomeLive do
             />
           </div>
 
-          <div
-            class="top-[calc(100%-13rem)] absolute inset-x-0 -z-10 transform overflow-hidden blur-3xl sm:top-[calc(100%-30rem)]"
-            aria-hidden="true"
-          >
+          <div class="absolute inset-x-0 -z-10 transform overflow-hidden blur-3xl" aria-hidden="true">
             <div
               class="left-[calc(50%+3rem)] aspect-[1155/678] w-[36.125rem] relative -translate-x-1/2 bg-gradient-to-tr from-primary to-secondary opacity-20 sm:left-[calc(50%+36rem)] sm:w-[72.1875rem]"
               style="clip-path: polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)"

From 1572641bb26d4a5d534e0cdface20f51fbb3ec80 Mon Sep 17 00:00:00 2001
From: zafer <zafer@algora.io>
Date: Mon, 3 Feb 2025 17:48:46 +0300
Subject: [PATCH 2/8] implement mobile menu

---
 lib/algora_web/live/home_live.ex | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/lib/algora_web/live/home_live.ex b/lib/algora_web/live/home_live.ex
index f30f21368..9a559e523 100644
--- a/lib/algora_web/live/home_live.ex
+++ b/lib/algora_web/live/home_live.ex
@@ -43,7 +43,11 @@ defmodule AlgoraWeb.HomeLive do
           </div>
           <!-- Mobile menu button -->
           <div class="flex lg:hidden">
-            <button type="button" class="rounded-md p-2.5 text-muted-foreground hover:text-foreground">
+            <button
+              type="button"
+              class="rounded-md p-2.5 text-muted-foreground hover:text-foreground"
+              phx-click={JS.show(to: "#mobile-menu")}
+            >
               <span class="sr-only">Open main menu</span>
               <.icon name="tabler-menu" class="h-6 w-6" />
             </button>
@@ -71,7 +75,7 @@ defmodule AlgoraWeb.HomeLive do
           </div>
         </nav>
         <!-- Mobile menu -->
-        <div class="lg:hidden" role="dialog" aria-modal="true">
+        <div id="mobile-menu" class="lg:hidden hidden" role="dialog" aria-modal="true">
           <div class="fixed inset-0 z-50"></div>
           <div class="fixed inset-y-0 right-0 z-50 w-full overflow-y-auto bg-background px-6 py-6 sm:max-w-sm sm:ring-1 sm:ring-border">
             <!-- Mobile menu content -->
@@ -80,6 +84,7 @@ defmodule AlgoraWeb.HomeLive do
               <button
                 type="button"
                 class="rounded-md p-2.5 text-muted-foreground hover:text-foreground"
+                phx-click={JS.hide(to: "#mobile-menu")}
               >
                 <span class="sr-only">Close menu</span>
                 <.icon name="tabler-x" class="h-6 w-6" />

From 330ee69f2d1a82b384fae8b018c4a87f29ef1b85 Mon Sep 17 00:00:00 2001
From: zafer <zafer@algora.io>
Date: Mon, 3 Feb 2025 17:50:51 +0300
Subject: [PATCH 3/8] fix CTA buttons

---
 lib/algora_web/live/home_live.ex | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lib/algora_web/live/home_live.ex b/lib/algora_web/live/home_live.ex
index 9a559e523..f7961f865 100644
--- a/lib/algora_web/live/home_live.ex
+++ b/lib/algora_web/live/home_live.ex
@@ -187,7 +187,7 @@ defmodule AlgoraWeb.HomeLive do
                   GitHub bounties, freelancing and full-time jobs.
                 </p>
                 <!-- CTA buttons -->
-                <div class="mt-10 flex items-center gap-x-6">
+                <div class="mt-10 flex flex-col sm:flex-row text-center sm:items-center gap-6">
                   <.link
                     navigate={~p"/onboarding/org"}
                     class="rounded-md bg-primary px-12 py-5 text-xl font-semibold text-primary-foreground shadow hover:bg-primary/90"

From 478802540bdb5e8ab10550b4831dfb878aaccfe3 Mon Sep 17 00:00:00 2001
From: zafer <zafer@algora.io>
Date: Mon, 3 Feb 2025 18:07:08 +0300
Subject: [PATCH 4/8] improve responsiveness of featured devs section

---
 lib/algora_web/live/home_live.ex | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/lib/algora_web/live/home_live.ex b/lib/algora_web/live/home_live.ex
index f7961f865..284a4bb37 100644
--- a/lib/algora_web/live/home_live.ex
+++ b/lib/algora_web/live/home_live.ex
@@ -134,7 +134,7 @@ defmodule AlgoraWeb.HomeLive do
       </header>
 
       <main>
-        <div class="relative isolate overflow-hidden">
+        <div class="relative isolate overflow-hidden min-h-screen">
           <!-- Background pattern -->
           <div
             class="absolute inset-x-0 -top-40 -z-10 transform overflow-hidden blur-3xl sm:-top-80"
@@ -177,8 +177,8 @@ defmodule AlgoraWeb.HomeLive do
             </div>
           </div>
           <!-- Hero content -->
-          <div class="mx-auto max-w-7xl px-6 pt-36 pb-24 sm:pt-60 lg:px-8 lg:pt-16">
-            <div class="mx-auto max-w-2xl gap-x-14 lg:mx-0 lg:flex lg:max-w-none lg:items-center">
+          <div class="mx-auto max-w-7xl px-6 py-24 lg:px-8 lg:pt-20">
+            <div class="mx-auto gap-x-14 lg:mx-0 lg:flex lg:max-w-none lg:items-center">
               <div class="relative w-full lg:-mt-12 lg:max-w-xl lg:shrink-0 xl:max-w-3xl">
                 <h1 class="font-display text-pretty text-5xl font-semibold tracking-tight text-foreground sm:text-7xl">
                   The open source UpWork alternative.
@@ -223,19 +223,19 @@ defmodule AlgoraWeb.HomeLive do
                 </div>
               </div>
               <!-- Featured devs -->
-              <div class="mt-14 flex min-h-screen justify-end gap-8 sm:-mt-44 sm:justify-start sm:pl-20 lg:mt-0 lg:pl-0">
+              <div class="mt-14 flex justify-start sm:justify-center gap-8 lg:justify-start lg:mt-0 lg:pl-0">
                 <%= if length(@featured_devs) > 0 do %>
-                  <div class="ml-auto w-44 flex-none space-y-8 pt-32 sm:ml-0 sm:pt-80 lg:order-last lg:pt-36 xl:order-none xl:pt-80">
+                  <div class="ml-auto w-28 sm:w-56 lg:w-44 flex-none space-y-8 pt-32 sm:ml-0 lg:order-last lg:pt-36 xl:order-none xl:pt-80">
                     <.dev_card dev={List.first(@featured_devs)} />
                   </div>
-                  <div class="mr-auto w-44 flex-none space-y-8 sm:mr-0 sm:pt-52 lg:pt-36">
+                  <div class="mr-auto w-28 sm:w-56 lg:w-44 flex-none space-y-8 sm:mr-0 lg:pt-36">
                     <%= if length(@featured_devs) >= 3 do %>
                       <%= for dev <- Enum.slice(@featured_devs, 1..2) do %>
                         <.dev_card dev={dev} />
                       <% end %>
                     <% end %>
                   </div>
-                  <div class="w-44 flex-none space-y-8 pt-32 sm:pt-0">
+                  <div class="w-28 sm:w-56 lg:w-44 flex-none space-y-8 pt-32 lg:pt-0">
                     <%= for dev <- Enum.slice(@featured_devs, 3..4) do %>
                       <.dev_card dev={dev} />
                     <% end %>

From 0e519f93a47141e2b28b26d31355c8887f936bcb Mon Sep 17 00:00:00 2001
From: zafer <zafer@algora.io>
Date: Mon, 3 Feb 2025 18:19:52 +0300
Subject: [PATCH 5/8] fix responsiveness of logo cloud

---
 lib/algora_web/live/home_live.ex | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/lib/algora_web/live/home_live.ex b/lib/algora_web/live/home_live.ex
index 284a4bb37..eadc485d0 100644
--- a/lib/algora_web/live/home_live.ex
+++ b/lib/algora_web/live/home_live.ex
@@ -217,7 +217,7 @@ defmodule AlgoraWeb.HomeLive do
                   <h2 class="text-sm font-semibold leading-8 text-foreground">
                     Trusted by the world's most innovative teams
                   </h2>
-                  <div class="mt-6 grid grid-cols-5 gap-x-6 gap-y-4">
+                  <div class="mt-6 grid grid-cols-3 sm:grid-cols-5 gap-6 -ml-[5%] sm:-ml-[2.5%]">
                     <.logo_cloud />
                   </div>
                 </div>
@@ -349,7 +349,7 @@ defmodule AlgoraWeb.HomeLive do
             %{
               name: "ZIO",
               url: "https://zio.dev",
-              args: %{src: ~p"/images/wordmarks/zio.png", class: "mt-4 aspect-[67/20] max-h-10 brightness-0 invert"}
+              args: %{src: ~p"/images/wordmarks/zio.png", class: "mt-4 max-h-10 brightness-0 invert"}
             },
             %{
               name: "Tailcall",
@@ -364,6 +364,14 @@ defmodule AlgoraWeb.HomeLive do
               url: "https://www.golem.cloud",
               component: &Wordmarks.golemcloud/1,
               args: %{class: "max-h-9"}
+            },
+            %{
+              name: "Remotion",
+              url: "https://remotion.dev",
+              args: %{
+                src: "https://algora.io/banners/remotion.png",
+                class: "max-h-10 brightness-0 invert sm:hidden"
+              }
             }
           ],
           fn org ->

From c7d80fe92aa7483fc2508019884e8ed26b6a4bff Mon Sep 17 00:00:00 2001
From: zafer <zafer@algora.io>
Date: Mon, 3 Feb 2025 18:25:40 +0300
Subject: [PATCH 6/8] more improvements

---
 lib/algora_web/live/home_live.ex | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/lib/algora_web/live/home_live.ex b/lib/algora_web/live/home_live.ex
index eadc485d0..ebb61732d 100644
--- a/lib/algora_web/live/home_live.ex
+++ b/lib/algora_web/live/home_live.ex
@@ -177,7 +177,7 @@ defmodule AlgoraWeb.HomeLive do
             </div>
           </div>
           <!-- Hero content -->
-          <div class="mx-auto max-w-7xl px-6 py-24 lg:px-8 lg:pt-20">
+          <div class="mx-auto max-w-7xl px-6 pt-24 pb-12 lg:px-8 lg:pt-20">
             <div class="mx-auto gap-x-14 lg:mx-0 lg:flex lg:max-w-none lg:items-center">
               <div class="relative w-full lg:-mt-12 lg:max-w-xl lg:shrink-0 xl:max-w-3xl">
                 <h1 class="font-display text-pretty text-5xl font-semibold tracking-tight text-foreground sm:text-7xl">
@@ -225,17 +225,17 @@ defmodule AlgoraWeb.HomeLive do
               <!-- Featured devs -->
               <div class="mt-14 flex justify-start sm:justify-center gap-8 lg:justify-start lg:mt-0 lg:pl-0">
                 <%= if length(@featured_devs) > 0 do %>
-                  <div class="ml-auto w-28 sm:w-56 lg:w-44 flex-none space-y-8 pt-32 sm:ml-0 lg:order-last lg:pt-36 xl:order-none xl:pt-80">
+                  <div class="ml-auto w-32 min-[500px]:w-40 sm:w-56 lg:w-44 flex-none space-y-8 pt-32 sm:ml-0 lg:order-last lg:pt-36 xl:order-none xl:pt-80">
                     <.dev_card dev={List.first(@featured_devs)} />
                   </div>
-                  <div class="mr-auto w-28 sm:w-56 lg:w-44 flex-none space-y-8 sm:mr-0 lg:pt-36">
+                  <div class="mr-auto w-32 min-[500px]:w-40 sm:w-56 lg:w-44 flex-none space-y-8 sm:mr-0 lg:pt-36">
                     <%= if length(@featured_devs) >= 3 do %>
                       <%= for dev <- Enum.slice(@featured_devs, 1..2) do %>
                         <.dev_card dev={dev} />
                       <% end %>
                     <% end %>
                   </div>
-                  <div class="w-28 sm:w-56 lg:w-44 flex-none space-y-8 pt-32 lg:pt-0">
+                  <div class="w-32 min-[500px]:w-40 sm:w-56 lg:w-44 flex-none space-y-8 pt-32 lg:pt-0">
                     <%= for dev <- Enum.slice(@featured_devs, 3..4) do %>
                       <.dev_card dev={dev} />
                     <% end %>
@@ -293,10 +293,10 @@ defmodule AlgoraWeb.HomeLive do
             <% end %>
           </div>
         </div>
-        <div class="mt-1 text-xs text-muted-foreground">
+        <div class="mt-3 text-xs text-muted-foreground">
           <span class="font-medium">Total Earned:</span>
           <span class="text-sm font-bold text-foreground">
-            {Money.to_string!(@dev.total_earned)}
+            {Money.to_string!(@dev.total_earned, no_fraction_if_integer: true)}
           </span>
         </div>
       </div>

From 012c9b78637fd3425907fb30098f865554203cdf Mon Sep 17 00:00:00 2001
From: zafer <zafer@algora.io>
Date: Mon, 3 Feb 2025 18:42:07 +0300
Subject: [PATCH 7/8] more improvements

---
 lib/algora_web/live/home_live.ex | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/lib/algora_web/live/home_live.ex b/lib/algora_web/live/home_live.ex
index ebb61732d..44bf447f0 100644
--- a/lib/algora_web/live/home_live.ex
+++ b/lib/algora_web/live/home_live.ex
@@ -177,9 +177,9 @@ defmodule AlgoraWeb.HomeLive do
             </div>
           </div>
           <!-- Hero content -->
-          <div class="mx-auto max-w-7xl px-6 pt-24 pb-12 lg:px-8 lg:pt-20">
+          <div class="mx-auto max-w-7xl px-6 pt-24 pb-12 lg:px-8 xl:pt-16">
             <div class="mx-auto gap-x-14 lg:mx-0 lg:flex lg:max-w-none lg:items-center">
-              <div class="relative w-full lg:-mt-12 lg:max-w-xl lg:shrink-0 xl:max-w-3xl">
+              <div class="relative w-full lg:max-w-xl lg:shrink-0 xl:max-w-2xl 2xl:max-w-3xl">
                 <h1 class="font-display text-pretty text-5xl font-semibold tracking-tight text-foreground sm:text-7xl">
                   The open source UpWork alternative.
                 </h1>
@@ -202,10 +202,12 @@ defmodule AlgoraWeb.HomeLive do
                   </.link>
                 </div>
                 <!-- Stats -->
-                <dl class="mt-16 grid grid-cols-2 gap-8 lg:grid-cols-4">
+                <dl class="mt-16 grid grid-cols-2 gap-8 sm:grid-cols-4">
                   <%= for stat <- @stats do %>
                     <div class="flex flex-col gap-y-2">
-                      <dt class="text-sm leading-6 text-muted-foreground">{stat.label}</dt>
+                      <dt class="text-sm leading-6 text-muted-foreground whitespace-nowrap">
+                        {stat.label}
+                      </dt>
                       <dd class="font-display text-3xl font-semibold tracking-tight text-foreground">
                         {stat.value}
                       </dd>

From 9f044ee6f01429a072a93d5dc14eb368a7606c3e Mon Sep 17 00:00:00 2001
From: zafer <zafer@algora.io>
Date: Mon, 3 Feb 2025 18:43:13 +0300
Subject: [PATCH 8/8] more improvements

---
 lib/algora_web/live/home_live.ex | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lib/algora_web/live/home_live.ex b/lib/algora_web/live/home_live.ex
index 44bf447f0..42afa86ef 100644
--- a/lib/algora_web/live/home_live.ex
+++ b/lib/algora_web/live/home_live.ex
@@ -177,7 +177,7 @@ defmodule AlgoraWeb.HomeLive do
             </div>
           </div>
           <!-- Hero content -->
-          <div class="mx-auto max-w-7xl px-6 pt-24 pb-12 lg:px-8 xl:pt-16">
+          <div class="mx-auto max-w-7xl px-6 pt-24 pb-12 lg:px-8 xl:pt-16 2xl:pt-28">
             <div class="mx-auto gap-x-14 lg:mx-0 lg:flex lg:max-w-none lg:items-center">
               <div class="relative w-full lg:max-w-xl lg:shrink-0 xl:max-w-2xl 2xl:max-w-3xl">
                 <h1 class="font-display text-pretty text-5xl font-semibold tracking-tight text-foreground sm:text-7xl">