titor/drawDB
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Make buttons more responsive

Browse Source 
On tablets and larger phone screens, these two were lacking a margin
setting (leading to a "squished" look). This commit resolves that.
This commit is contained in:
Dante Mogrim 2024-10-14 18:32:52 +02:00
parent 81c4728ea5
commit feb1eb8364
1 changed files with 3 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/pages/LandingPage.jsx
View File

@ -88,9 +88,9 @@ export default function LandingPage() {
</div>
</div>
</FadeIn>
<div className="mt-4 flex gap-4 justify-start font-semibold md:block md:mt-12">
<div className="flex items-start justify-start gap-4 mt-4 font-semibold md:mt-12">
<button
className="bg-white shadow-lg px-9 py-3 rounded-full border border-zinc-200 hover:bg-zinc-100 transition-all duration-300"
className="py-3 transition-all duration-300 bg-white border rounded-full shadow-lg px-9 border-zinc-200 hover:bg-zinc-100"
onClick={() =>
document
.getElementById("learn-more")
@ -101,7 +101,7 @@ export default function LandingPage() {
</button>
<Link
to="/editor"
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"
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"
>
Try it for yourself <i className="bi bi-arrow-right ms-1"></i>
</Link>