RythonDev/src/pages/contact.astro
2024-11-04 17:47:04 +11:00

57 lines
1.5 KiB
Text

---
import NavBar from "../components/sections/NavBar.astro";
import Layout from "../layouts/Layout.astro";
import ContactComponent from "../components/sections/ContactComponent.svelte";
import Card from "../components/elements/Card.astro";
import Footer from "../components/sections/FooterComponent.astro";
---
<Layout
title="Contact"
description="Find out how to contact RythonDev, for sponsorship offers or collaboration opportunities!"
>
<NavBar />
<div id="contact-component" class="mt-10 pt-20">
<h1 class="text-center text-5xl">Contact</h1>
<div class="mt-10 flex justify-center items-center">
<div class="w-[90%] md:w-[600px]">
<Card primaryColor="#40A2D8">
<div class="card-content">
<div class="flex flex-col justify-left w-full mb-3">
<h2
class="font-bold text-xl text-center text-balance"
>
Looking for a young developer with fresh ideas?
</h2>
</div>
<hr class="w-full mb-3" />
<div class="text-center text-balance">
Whether it's sponsorships or collaboration
opportunities, hit me up!
</div>
</div>
</Card>
</div>
</div>
<div class="mt-10">
<ContactComponent client:only />
</div>
</div>
<Footer />
</Layout>
<style>
.card-content {
display: flex;
flex-direction: column;
background-image: radial-gradient(
rgba(255, 255, 255, 0.1) 1px,
transparent 1px
);
background-position: 50% 50%;
background-size: 1.1rem 1.1rem;
padding: 2rem 2rem;
border-radius: 1.25rem;
overflow: hidden;
}
</style>