Skip to content

Commit c3fca81

Browse files
committed
feat: update navigation links and improve layout in various modules
1 parent 5b1d798 commit c3fca81

File tree

5 files changed

+74
-52
lines changed

5 files changed

+74
-52
lines changed

lib/algora_web/components/header.ex

Lines changed: 10 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -26,16 +26,22 @@ defmodule AlgoraWeb.Components.Header do
2626
<!-- Desktop nav -->
2727
<div class="hidden lg:flex lg:gap-x-12">
2828
<.link
29-
href={AlgoraWeb.Constants.get(:docs_url)}
29+
navigate={~p"/bounties"}
3030
class="text-sm/6 font-medium text-foreground/80 hover:text-foreground"
3131
>
32-
Docs
32+
Bounties
3333
</.link>
3434
<.link
35-
href={AlgoraWeb.Constants.get(:blog_url)}
35+
navigate={~p"/projects"}
3636
class="text-sm/6 font-semibold text-foreground/80 hover:text-foreground"
3737
>
38-
Blog
38+
Projects
39+
</.link>
40+
<.link
41+
navigate={~p"/community"}
42+
class="text-sm/6 font-semibold text-foreground/80 hover:text-foreground"
43+
>
44+
Community
3945
</.link>
4046
<.link
4147
navigate={~p"/pricing"}

lib/algora_web/constants.ex

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,8 +14,8 @@ defmodule AlgoraWeb.Constants do
1414
github_url: "https://github.com/algora-io",
1515
calendar_url: "https://cal.com/ioannisflo",
1616
# TODO: update this to the new repo
17-
github_repo_url: "https://github.com/algora-io/console",
18-
github_repo_api_url: "https://api.github.com/repos/algora-io/console",
17+
github_repo_url: "https://github.com/algora-io/tv",
18+
github_repo_api_url: "https://api.github.com/repos/algora-io/tv",
1919
docs_url: "https://docs.algora.io",
2020
docs_supported_countries_url: "https://docs.algora.io/bounties/payments#supported-countries-regions",
2121
demo_url: "https://www.youtube.com/watch?v=Ts5GhlEROrs",

lib/algora_web/live/home_live.ex

Lines changed: 58 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -127,32 +127,18 @@ defmodule AlgoraWeb.HomeLive do
127127
Discover GitHub bounties, contract work and jobs.<br class="hidden sm:block" />
128128
Hire the top 1% open source developers.
129129
</p>
130-
<!-- CTA buttons -->
131-
<.form
132-
for={@repo_form}
133-
phx-submit="submit_repo"
134-
class="mt-6 sm:mt-10 w-full max-w-lg xl:max-w-2xl"
135-
>
136-
<div class="relative">
137-
<.input
138-
field={@repo_form[:url]}
139-
placeholder="github.com/your/repo"
140-
class={
141-
classes([
142-
"w-full h-10 sm:h-16 text-sm sm:text-lg xl:text-2xl pl-8 sm:pl-[3.75rem] pr-24 sm:pr-48 ring-2 ring-emerald-500 font-display rounded-lg sm:rounded-xl",
143-
@repo_form[:url].errors != [] && "ring-destructive"
144-
])
145-
}
146-
/>
147-
<Logos.github class="size-5 sm:size-10 absolute left-2 sm:left-3 top-2 sm:top-3 text-muted-foreground/50" />
148-
<.button
149-
type="submit"
150-
class="absolute right-2 top-1.5 sm:top-2 bottom-1.5 sm:bottom-2 px-2 sm:px-8 h-7 sm:h-[3rem] text-sm sm:text-xl sm:font-semibold drop-shadow-[0_1px_5px_#34d39980] rounded-lg sm:rounded-xl"
151-
>
152-
Get Started
153-
</.button>
154-
</div>
155-
</.form>
130+
<div class="mt-6 sm:mt-10 flex gap-4">
131+
<.button navigate={~p"/auth/signup"} size="xl">
132+
Companies
133+
</.button>
134+
<.button
135+
href={AlgoraWeb.Constants.get(:github_repo_url)}
136+
variant="secondary"
137+
size="xl"
138+
>
139+
Developers
140+
</.button>
141+
</div>
156142
</div>
157143
<!-- Featured devs -->
158144
<div class={
@@ -182,6 +168,51 @@ defmodule AlgoraWeb.HomeLive do
182168
</div>
183169
</div>
184170
171+
<div class="relative isolate overflow-hidden py-[35vw] sm:py-[25vw]">
172+
<div class="z-20 absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 transform">
173+
<div class="scale-[300%] sm:scale-[150%] opacity-50">
174+
<div class="[transform:perspective(4101px)_rotateX(51deg)_rotateY(-13deg)_rotateZ(40deg)]">
175+
<img
176+
alt="Algora dashboard"
177+
width="1200"
178+
height="630"
179+
loading="lazy"
180+
class="border border-border bg-muted mix-blend-overlay [box-shadow:0px_80px_60px_0px_rgba(0,0,0,0.35),0px_35px_28px_0px_rgba(0,0,0,0.25),0px_18px_15px_0px_rgba(0,0,0,0.20),0px_10px_8px_0px_rgba(0,0,0,0.17),0px_5px_4px_0px_rgba(0,0,0,0.14),0px_2px_2px_0px_rgba(0,0,0,0.10)]"
181+
style="color:transparent"
182+
src={~p"/images/screenshots/org-home.png"}
183+
/>
184+
</div>
185+
</div>
186+
</div>
187+
<div class="z-30 relative mx-auto max-w-7xl px-6 lg:px-8">
188+
<.form
189+
for={@repo_form}
190+
phx-submit="submit_repo"
191+
class="mt-6 sm:mt-10 w-full max-w-lg xl:max-w-2xl mx-auto"
192+
>
193+
<div class="relative">
194+
<.input
195+
field={@repo_form[:url]}
196+
placeholder="github.com/your/repo"
197+
class={
198+
classes([
199+
"w-full h-10 sm:h-16 text-sm sm:text-lg xl:text-2xl pl-8 sm:pl-[3.75rem] pr-24 sm:pr-48 ring-2 ring-emerald-500 font-display rounded-lg sm:rounded-xl",
200+
@repo_form[:url].errors != [] && "ring-destructive"
201+
])
202+
}
203+
/>
204+
<Logos.github class="size-5 sm:size-10 absolute left-2 sm:left-3 top-2 sm:top-3 text-muted-foreground/50" />
205+
<.button
206+
type="submit"
207+
class="absolute right-2 top-1.5 sm:top-2 bottom-1.5 sm:bottom-2 px-2 sm:px-8 h-7 sm:h-[3rem] text-sm sm:text-xl sm:font-semibold drop-shadow-[0_1px_5px_#34d39980] rounded-lg sm:rounded-xl"
208+
>
209+
Get Started
210+
</.button>
211+
</div>
212+
</.form>
213+
</div>
214+
</div>
215+
185216
<div class="p-4 sm:p-6 md:p-8">
186217
<div class="mx-auto max-w-6xl gap-8 text-sm leading-6 py-8 sm:py-16 md:py-24 lg:py-40">
187218
<div class="pt-20 sm:pt-40 flex gap-4 sm:gap-8 lg:gap-x-16">
@@ -884,22 +915,7 @@ defmodule AlgoraWeb.HomeLive do
884915
</div>
885916
</section>
886917
887-
<section class="relative isolate overflow-hidden bg-black py-[35vw] sm:py-[25vw]">
888-
<div class="z-20 absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 transform">
889-
<div class="scale-[300%] sm:scale-[150%] opacity-50">
890-
<div class="[transform:perspective(4101px)_rotateX(51deg)_rotateY(-13deg)_rotateZ(40deg)]">
891-
<img
892-
alt="Algora dashboard"
893-
width="1200"
894-
height="630"
895-
loading="lazy"
896-
class="border border-border bg-muted mix-blend-overlay [box-shadow:0px_80px_60px_0px_rgba(0,0,0,0.35),0px_35px_28px_0px_rgba(0,0,0,0.25),0px_18px_15px_0px_rgba(0,0,0,0.20),0px_10px_8px_0px_rgba(0,0,0,0.17),0px_5px_4px_0px_rgba(0,0,0,0.14),0px_2px_2px_0px_rgba(0,0,0,0.10)]"
897-
style="color:transparent"
898-
src={~p"/images/screenshots/org-home.png"}
899-
/>
900-
</div>
901-
</div>
902-
</div>
918+
<section class="relative isolate overflow-hidden bg-background py-16 sm:py-40">
903919
<div class="z-30 relative mx-auto max-w-7xl px-6 lg:px-8">
904920
<h2 class="mb-8 text-3xl font-bold text-card-foreground text-center">
905921
<span class="text-muted-foreground">The open source</span>

lib/algora_web/live/sign_in_live.ex

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@ defmodule AlgoraWeb.SignInLive do
3030
</p>
3131
3232
<div :if={@mode == :signup} class="mt-6">
33-
<label class="mb-2 block text-sm/6 font-semibold">I am a...</label>
33+
<label class="mb-2 block text-sm/6 font-semibold">Sign up as...</label>
3434
<div class="grid grid-cols-2 gap-4">
3535
<.button navigate={~p"/onboarding/org"}>
3636
Company
@@ -41,7 +41,7 @@ defmodule AlgoraWeb.SignInLive do
4141
</div>
4242
</div>
4343
<div :if={@mode == :login} class="mt-6">
44-
<label class="mb-2 block text-sm/6 font-semibold">I am a...</label>
44+
<label class="mb-2 block text-sm/6 font-semibold">Sign in as...</label>
4545
<div class="grid grid-cols-2 gap-4">
4646
<label class={[
4747
"group relative flex cursor-pointer rounded-lg px-3 py-2 shadow-sm focus:outline-none",

lib/algora_web/live/user/profile_live.ex

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -46,9 +46,9 @@ defmodule AlgoraWeb.User.ProfileLive do
4646
4747
<div class="flex flex-wrap gap-4">
4848
<%= for tech <- @user.tech_stack do %>
49-
<span class="rounded-lg bg-secondary px-2 py-0.5 text-xs ring-1 ring-border">
49+
<.badge>
5050
{tech}
51-
</span>
51+
</.badge>
5252
<% end %>
5353
</div>
5454
</div>

0 commit comments

Comments
 (0)