Files
ta1sph.website/src/pages/index.astro
T
suphicakir 45bbbcce8d Son güncelleme
Son güncelleme
2026-07-18 22:39:14 +03:00

93 lines
5.2 KiB
Plaintext
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
---
import Layout from '../layouts/Layout.astro';
import SectionHeading from '../components/SectionHeading.astro';
import PostCard from '../components/PostCard.astro';
import { getCollection } from 'astro:content';
const posts = (await getCollection('blog', ({ data }) => !data.draft)).sort(
(a, b) => b.data.date.valueOf() - a.data.date.valueOf()
);
const latestPosts = posts.slice(0, 3);
const quickLinks = [
{ href: '/rolebilgisi', icon: 'fa-solid fa-tower-broadcast', title: 'Röle Bilgisi', desc: 'Bölgenizdeki analog ve dijital röleleri filtreleyerek bulun.' },
{ href: '/cevrim', icon: 'fa-solid fa-satellite-dish', title: 'Çevrim', desc: 'Takip ettiğim talk gruplar, röleler ve simplex frekansları.' },
{ href: '/hakkimda', icon: 'fa-regular fa-id-badge', title: 'Hakkımda', desc: 'Çağrı işaretim, DMR ID ve amatör telsizcilik geçmişim.' },
];
---
<Layout title="Ana Sayfa">
<section id="hero" class="relative flex min-h-[85vh] flex-col justify-center overflow-hidden" style="padding-top:var(--nav-h)">
<div class="aurora aurora-a" style="top:-80px;left:-120px"></div>
<div class="aurora aurora-b" style="top:180px;right:-180px"></div>
<div class="relative mx-auto max-w-6xl px-5" style="z-index:2">
<div class="reveal is-in text-center">
<span class="badge-pill mb-6"><span class="badge-dot"></span>ARC Üyesi — Amatör Radyocular Derneği</span>
<h1 class="mb-5" style="font-size:clamp(2.4rem, 6.5vw, 5rem); font-weight:700; line-height:1.09; letter-spacing:-0.03em">
<span class="text-gradient">TA1SPH</span><br />Amatör Telsizcilik Günlüğü
</h1>
<p class="mx-auto mb-9 text-base" style="max-width:600px;color:var(--color-tx2)">
Yeni başlayanlar ve amatör telsizcilik üzerine Türkçe kaynak arayanlar için deneyim paylaşımı: DMR,
röle kullanımı, çevrim bilgileri ve daha fazlası.
</p>
<div class="flex flex-wrap items-center justify-center gap-3">
<a href="/blog" class="btn-primary px-4 py-3 text-sm">Blog Yazılarını Oku <i class="fa-solid fa-arrow-right ms-1 fa-sm"></i></a>
<a href="/rolebilgisi" class="btn-outline px-4 py-3 text-sm">Röle Bilgisine Bak</a>
</div>
</div>
</div>
</section>
<section class="section-pad relative" style="background:var(--color-bg2)">
<div class="mx-auto max-w-6xl px-5">
<div class="reveal mb-10 grid grid-cols-1 gap-4 sm:grid-cols-3">
{quickLinks.map((link) => (
<a href={link.href} class="card-glass flex flex-col gap-3 p-5">
<div class="flex h-11 w-11 items-center justify-center rounded-xl text-white" style="background:var(--grad)">
<i class={link.icon}></i>
</div>
<h3 class="text-base font-semibold" style="color:var(--color-tx)">{link.title}</h3>
<p class="text-sm" style="color:var(--color-tx2)">{link.desc}</p>
</a>
))}
</div>
</div>
</section>
<section class="section-pad relative">
<div class="mx-auto max-w-6xl px-5">
<SectionHeading label="Blog" title="Son Yayınlanan" highlight="Yazılar" sub="En güncel üç yazı." />
<div class="grid grid-cols-1 gap-5 md:grid-cols-2 lg:grid-cols-3">
{latestPosts.map((post) => <PostCard post={post} />)}
</div>
<div class="reveal mt-10 text-center">
<a href="/blog" class="btn-outline px-4 py-3 text-sm">Tüm Yazıları Gör <i class="fa-solid fa-arrow-right ms-1 fa-sm"></i></a>
</div>
</div>
</section>
<section class="section-pad relative" style="background:var(--color-bg3)">
<div class="mx-auto max-w-6xl px-5">
<SectionHeading label="Topluluk" title="Takip Ettiğim" highlight="Telegram Grupları" sub="Sorularınız için bu gruplara katılabilirsiniz." />
<div class="reveal grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-4">
<a class="card-glass flex flex-col items-center gap-2 p-5 text-center" href="https://t.me/amatortelsizci" target="_blank" rel="noopener">
<i class="fa-brands fa-telegram fa-xl" style="color:var(--color-pur)"></i>
<span class="text-sm font-semibold" style="color:var(--color-tx)">Amatör Telsizci</span>
</a>
<a class="card-glass flex flex-col items-center gap-2 p-5 text-center" href="https://t.me/ym1ktc" target="_blank" rel="noopener">
<i class="fa-brands fa-telegram fa-xl" style="color:var(--color-pur)"></i>
<span class="text-sm font-semibold" style="color:var(--color-tx)">Amatör Radyocular Derneği</span>
</a>
<a class="card-glass flex flex-col items-center gap-2 p-5 text-center" href="https://t.me/cevrim_zamani" target="_blank" rel="noopener">
<i class="fa-brands fa-telegram fa-xl" style="color:var(--color-pur)"></i>
<span class="text-sm font-semibold" style="color:var(--color-tx)">Çevrim Zamanı</span>
</a>
<a class="card-glass flex flex-col items-center gap-2 p-5 text-center" href="https://t.me/qrv73topluluk" target="_blank" rel="noopener">
<i class="fa-brands fa-telegram fa-xl" style="color:var(--color-pur)"></i>
<span class="text-sm font-semibold" style="color:var(--color-tx)">QRV73 Topluluk</span>
</a>
</div>
</div>
</section>
</Layout>