Skip to content

Commit 8dcfff2

Browse files
josevalimjosevalim
committed
Small screens improvements
1 parent d22845c commit 8dcfff2

4 files changed

Lines changed: 16 additions & 13 deletions

File tree

‎src/components/home/Stewards.astro‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ import SectionHeading from "@/components/ui/SectionHeading.astro";
3838
target="_blank"
3939
rel="noopener noreferrer"
4040
aria-label="Software Mansion (opens in a new tab)"
41-
class="flex h-full w-full flex-col gap-4 px-8 pt-14 pb-12 transition-colors duration-base ease-out-quart hover:bg-purple-0 xl:px-14"
41+
class="flex h-full w-full flex-col gap-0 px-8 pt-14 pb-12 transition-colors duration-base ease-out-quart hover:bg-purple-0 md:gap-4 xl:px-14"
4242
>
4343
<div class="flex h-20 shrink-0 items-center justify-center">
4444
<span
@@ -49,7 +49,7 @@ import SectionHeading from "@/components/ui/SectionHeading.astro";
4949
/>
5050
</div>
5151
<div class="flex h-20 shrink-0 items-center justify-center">
52-
<p class="pt-4 text-center font-sans text-body text-black/80 lg:pt-0">
52+
<p class="text-center font-sans text-body text-black/80 md:pt-4 lg:pt-0">
5353
Membrane, Popcorn, LiveDebugger, Legion. Building Elixir tooling
5454
across the whole stack since 2016.
5555
</p>
@@ -63,10 +63,10 @@ import SectionHeading from "@/components/ui/SectionHeading.astro";
6363
target="_blank"
6464
rel="noopener noreferrer"
6565
aria-label="Dashbit (opens in a new tab)"
66-
class="flex h-full w-full flex-col gap-4 px-8 pt-14 pb-12 transition-colors duration-base ease-out-quart hover:bg-purple-0 xl:px-14"
66+
class="flex h-full w-full flex-col gap-0 px-8 pt-14 pb-12 transition-colors duration-base ease-out-quart hover:bg-purple-0 md:gap-4 xl:px-14"
6767
>
6868
<div class="flex h-20 shrink-0 items-center justify-center">
69-
<div class="scale-[1.6] md:scale-[1.5] lg:scale-[1.2]">
69+
<div class="scale-[2] md:scale-[1.5] lg:scale-[1.2]">
7070
<BrandLogo
7171
src={dashbitLogo}
7272
alt="Dashbit"
@@ -76,7 +76,7 @@ import SectionHeading from "@/components/ui/SectionHeading.astro";
7676
</div>
7777
</div>
7878
<div class="flex h-20 shrink-0 items-center justify-center">
79-
<p class="pt-4 text-center font-sans text-body text-black/80 lg:pt-0">
79+
<p class="text-center font-sans text-body text-black/80 md:pt-4 lg:pt-0">
8080
Creators of Elixir, Livebook, Broadway, Plug, and more. Dashbit
8181
helps companies adopt and grow Elixir in production.
8282
</p>
@@ -90,7 +90,7 @@ import SectionHeading from "@/components/ui/SectionHeading.astro";
9090
target="_blank"
9191
rel="noopener noreferrer"
9292
aria-label="Jump (opens in a new tab)"
93-
class="flex h-full w-full flex-col gap-4 px-8 pt-14 pb-12 transition-colors duration-base ease-out-quart hover:bg-purple-0 xl:px-14"
93+
class="flex h-full w-full flex-col gap-0 px-8 pt-14 pb-12 transition-colors duration-base ease-out-quart hover:bg-purple-0 md:gap-4 xl:px-14"
9494
>
9595
<div class="flex h-20 shrink-0 items-center justify-center">
9696
<span
@@ -101,7 +101,7 @@ import SectionHeading from "@/components/ui/SectionHeading.astro";
101101
/>
102102
</div>
103103
<div class="flex h-20 shrink-0 items-center justify-center">
104-
<p class="pt-4 text-center font-sans text-body text-black/80 lg:pt-0">
104+
<p class="text-center font-sans text-body text-black/80 md:pt-4 lg:pt-0">
105105
Trusted AI for advisors and financial professionals. Contributors
106106
to Expert LSP, Quokka, and more.
107107
</p>

‎src/components/home/UseElixirFor.astro‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -455,7 +455,7 @@ const starConfig = JSON.stringify(
455455
data-active={i === defaultActiveRow ? "" : undefined}
456456
class="group/card flex w-full flex-col justify-between gap-8 overflow-clip border border-gray-60 p-6 opacity-70 transition-opacity duration-base ease-out-quart data-[active]:opacity-100 md:p-12 xl:h-[400px] xl:gap-0"
457457
>
458-
<div class="flex flex-col items-start gap-8">
458+
<div class="flex flex-col items-start gap-6 md:gap-8">
459459
<div
460460
class="flex h-12 shrink-0 items-center grayscale transition-[filter] duration-base ease-out-quart group-data-[active]/card:grayscale-0"
461461
data-card-logo
@@ -499,8 +499,11 @@ const starConfig = JSON.stringify(
499499
)}
500500
</a>
501501
</div>
502-
<div class="max-w-[500px]">
503-
<p class="font-sans text-lead font-normal text-white">
502+
<div class="flex max-w-[500px] flex-col gap-4">
503+
<h3 class="font-sans text-lead font-medium text-white lg:hidden">
504+
{categoriesData[i].label}
505+
</h3>
506+
<p class="font-sans text-body font-normal text-white md:text-lead">
504507
{row.description}
505508
</p>
506509
</div>

‎src/components/home/WhyElixir.astro‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -57,7 +57,7 @@ const cards: WhyCard[] = [
5757
/>
5858
</Reveal>
5959
<Reveal delay={1}>
60-
<div class="grid border-t border-l border-(--color-border-on-light) mb-20 md:grid-cols-2 md:mb-24 lg:mb-28">
60+
<div class="grid border-t border-l border-(--color-border-on-light) mb-20 md:mb-24 lg:grid-cols-2 lg:mb-28">
6161
{cards.map((card) => (
6262
<FeatureCard
6363
title={card.title}

‎src/components/ui/FeatureCard.astro‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -45,15 +45,15 @@ const bodyParts = body.split(/(\[[^\]]+\])/g);
4545
<div class="flex flex-col gap-4">
4646
<As
4747
class:list={[
48-
"font-(family-name:--font-display) text-[1.75rem] font-medium md:text-[2rem]",
48+
"font-(family-name:--font-display) text-h4 font-medium md:text-[1.75rem] lg:text-h3",
4949
isDark ? "text-(--color-white)" : "text-(--color-black)",
5050
]}
5151
>
5252
{title}
5353
</As>
5454
<p
5555
class:list={[
56-
"text-[1.125rem] leading-[1.5]",
56+
"text-body lg:text-[1.125rem]",
5757
isDark ? "text-(--color-white-10)" : "text-(--color-black)/80",
5858
]}
5959
>

0 commit comments

Comments
 (0)