mariosant/mariosant.dev
1
0
Fork 0
Code Issues Pull Requests Actions Activity

hero and features

Browse Source
This commit is contained in:
Surjith S M
2022-11-04 21:59:18 +05:30
parent f6f484e67d
commit bfb5c99b5a
9 changed files with 115 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/components/hero.astro
View File

@@ -1,10 +1,18 @@
---
import { Image } from "@astrojs/image/components";
import heroImage from "assets/hero.avif";
import heroImage from "assets/hero.png";
import Link from "@components/ui/link.astro";
---
<main class="grid lg:grid-cols-2 place-items-center py-24">
<main class="grid lg:grid-cols-2 place-items-center py-8">
<div class="py-6 md:order-1">
<Image
src={heroImage}
alt="Astronaut in the air"
loading="eager"
format="avif"
/>
</div>
<div>
<h1 class="text-4xl lg:text-7xl font-bold lg:tracking-tight">
Marketing website done with Astro
@@ -14,8 +22,8 @@ import Link from "@components/ui/link.astro";
pages.<wbr /> Built with Astro.build, TailwindCSS & Alpine.js. You can quickly
create any website with this starter.
</p>
<div class="mt-6 flex gap-3">
<Link href="#">Get Started</Link>
<div class="mt-6 flex flex-col sm:flex-row gap-3">
<Link href="#" class="">Get Started</Link>
<Link
size="lg"
style="outline"
@@ -24,7 +32,4 @@ import Link from "@components/ui/link.astro";
>
</div>
</div>
<div>
<!-- <Image src={heroImage} alt="Astronaut in the air" /> -->
</div>
</main>