Skip to content

Commit feb1eb8

Browse files
Dante MogrimDante Mogrim
authored andcommitted
Make buttons more responsive
On tablets and larger phone screens, these two were lacking a margin setting (leading to a "squished" look). This commit resolves that.
1 parent 81c4728 commit feb1eb8

File tree

1 file changed

+3
-3
lines changed

1 file changed

+3
-3
lines changed

src/pages/LandingPage.jsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -88,9 +88,9 @@ export default function LandingPage() {
8888
</div>
8989
</div>
9090
</FadeIn>
91-
<div className="mt-4 flex gap-4 justify-start font-semibold md:block md:mt-12">
91+
<div className="flex items-start justify-start gap-4 mt-4 font-semibold md:mt-12">
9292
<button
93-
className="bg-white shadow-lg px-9 py-3 rounded-full border border-zinc-200 hover:bg-zinc-100 transition-all duration-300"
93+
className="py-3 transition-all duration-300 bg-white border rounded-full shadow-lg px-9 border-zinc-200 hover:bg-zinc-100"
9494
onClick={() =>
9595
document
9696
.getElementById("learn-more")
@@ -101,7 +101,7 @@ export default function LandingPage() {
101101
</button>
102102
<Link
103103
to="/editor"
104-
className="md:mt-2 inline-block bg-sky-900 text-white ps-7 pe-6 py-3 rounded-full shadow-lg hover:bg-sky-800 transition-all duration-300"
104+
className="inline-block py-3 text-white transition-all duration-300 rounded-full shadow-lg bg-sky-900 ps-7 pe-6 hover:bg-sky-800"
105105
>
106106
Try it for yourself <i className="bi bi-arrow-right ms-1"></i>
107107
</Link>

0 commit comments

Comments
 (0)