60 lines
1.9 KiB
TypeScript
60 lines
1.9 KiB
TypeScript
import Link from "next/link";
|
|
|
|
export default function Contact() {
|
|
return (
|
|
<div className="page">
|
|
{/* external CSS: dipilih karena styles.css sudah berisi gaya navbar, kotak, dan footer yang sama dengan halaman lain, jadi tampilan seragam dan mudah diubah dari satu file */}
|
|
<link rel="stylesheet" href="/styles.css" />
|
|
|
|
<header>
|
|
<nav className="nav-bar">
|
|
<Link href="/">Home</Link>
|
|
<Link href="/about">About</Link>
|
|
<Link href="/hobbies">Hobbies</Link>
|
|
<Link href="/gallery">Gallery</Link>
|
|
<Link href="/contact">Contact</Link>
|
|
</nav>
|
|
</header>
|
|
|
|
<main className="main-wrapper">
|
|
<section className="box">
|
|
<h1 className="contact-title">Hubungi Saya</h1>
|
|
<p>Kamu bisa menghubungi saya lewat kontak berikut.</p>
|
|
</section>
|
|
|
|
<section className="box">
|
|
<h2 className="contact-subtitle">Kontak</h2>
|
|
<ul className="contact-list">
|
|
<li>
|
|
<span className="contact-label">Email</span>
|
|
<a className="contact-link" href="mailto:zagar-n.inf25@ukwms.ac.id">
|
|
zagar-n.inf25@ukwms.ac.id
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<span className="contact-label">Instagram</span>
|
|
{/* link eksternal: membuka situs di luar halaman sendiri pada tab baru */}
|
|
<a
|
|
className="contact-link"
|
|
href="https://www.instagram.com/jmn_zn14"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
@jmn_zn14
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<span className="contact-label">Domisili</span>
|
|
<span>Surabaya, Jawa Timur</span>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
</main>
|
|
|
|
<footer className="footer-bar">
|
|
<p>© 2026 Zagar</p>
|
|
</footer>
|
|
</div>
|
|
);
|
|
}
|