78 lines
2.6 KiB
TypeScript
78 lines
2.6 KiB
TypeScript
import Link from "next/link";
|
|
|
|
export default function Hobbies() {
|
|
return (
|
|
<div className="page">
|
|
{/* external CSS: seluruh tampilan halaman ini hanya memakai file styles.css */}
|
|
<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="hobby-title">Hobi Saya</h1>
|
|
<p>Ini beberapa hal yang biasa saya lakukan di waktu luang.</p>
|
|
{/* daftar tidak berurutan (ul): ringkasan hobi */}
|
|
<ul className="hobby-list">
|
|
<li>Bermain game</li>
|
|
<li>Menonton film</li>
|
|
<li>Mendengarkan musik</li>
|
|
</ul>
|
|
</section>
|
|
|
|
<section className="box">
|
|
<h2 className="hobby-subtitle">Bermain Game</h2>
|
|
<img
|
|
className="hobby-img"
|
|
src="/images/hobibermaingame.jpg"
|
|
alt="Tangkapan layar profil pemain di game mobile yang menampilkan peringkat dan statistik"
|
|
/>
|
|
<p>Saya suka bermain game Mobile Legends</p>
|
|
</section>
|
|
|
|
<section className="box">
|
|
<h2 className="hobby-subtitle">Menonton Film</h2>
|
|
<img
|
|
className="hobby-img"
|
|
src="/images/hobimenontonfilm.jpg"
|
|
alt="Adegan film seorang pria duduk di pantai berbatu dengan tebing di belakangnya"
|
|
/>
|
|
<p>Saya juga suka menonton film</p>
|
|
</section>
|
|
|
|
<section className="box">
|
|
<h2 className="hobby-subtitle">Mendengarkan Musik</h2>
|
|
<img
|
|
className="hobby-img"
|
|
src="/images/hobimendengarkanmusik.jpg"
|
|
alt="Tangkapan layar aplikasi pemutar musik yang sedang memutar sebuah lagu"
|
|
/>
|
|
<p>Saya juga suka mendengarkan musik, terutama genre pop rock</p>
|
|
</section>
|
|
|
|
<section className="box">
|
|
<h2 className="hobby-subtitle">Urutan Hobi Favorit</h2>
|
|
{/* daftar berurutan (ol): peringkat hobi dari yang paling disukai */}
|
|
<ol className="hobby-list">
|
|
<li>Mendengarkan musik</li>
|
|
<li>Menonton film</li>
|
|
<li>Bermain game</li>
|
|
</ol>
|
|
</section>
|
|
</main>
|
|
|
|
<footer className="footer-bar">
|
|
<p>© 2026 Zagar</p>
|
|
</footer>
|
|
</div>
|
|
);
|
|
}
|