5803025001/w11_01_Nathan_personalPage
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fourth batch, finished gallery, no img because i stil digging my own phone gallery

Browse Source
This commit is contained in:
5803025001
2026-11-07 20:40:54 +07:00
parent 6200f1a02c
commit 46505cb35b
2 changed files with 48 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files
gallery.html
+45 -3
View File
@@ -8,10 +8,10 @@
</head>
<body>
<!-- Navigation menu untuk berpindah antar halaman website, semua halaman menggunakan navigation yang sama -->
<header class="header">
<header class="mx-auto max-w-7xl px-6 py-4">
<nav class="nav">
<ul class="nav-list">
<li><a href="index.html" target="_self" title="Home">Home</a></li>
<ul class="flex list-none items-center gap-6 p-0">
<li class="mr-auto"><a href="index.html" target="_self" title="Home">Home</a></li>
<li><a href="about.html" target="_self" title="About me">About</a></li>
<li><a href="hobbies.html" target="_self" title="Hobbies">Hobbies</a></li>
<li><a href="gallery.html" target="_self" title="Gallery">Gallery</a></li>
@@ -20,5 +20,47 @@
</nav>
</header>
<main class="mx-auto max-w-7xl px-6 pb-12">
<h1 class="mb-3 text-center text-3xl font-bold text-gray-800">
My Gallery
</h1>
<p class="mb-8 text-center text-gray-600">
A collection of my favorite moments.
</p>
<!-- Gallery section: menampilkan kumpulan foto dan caption -->
<section class="grid grid-cols-1 gap-6 sm:grid-cols-2 lg:grid-cols-3">
<figure class="rounded-xl border-gray-200 bg-white shadow-sm hover:shadow-lg">
<img src="images/foto1.jpg" alt="Deskripsi foto pertama" class="h-56 w-full object-cover">
<figcaption class="p-4 text-center font-medium text-gray-700">
Caption Foto Pertama
</figcaption>
</figure>
<figure class="rounded-xl border-gray-200 bg-white shadow-sm hover:shadow-lg">
<img src="images/foto1.jpg" alt="Deskripsi foto pertama" class="h-56 w-full object-cover">
<figcaption class="p-4 text-center font-medium text-gray-700">
Caption Foto Pertama
</figcaption>
</figure>
<figure class="rounded-xl border-gray-200 bg-white shadow-sm hover:shadow-lg">
<img src="images/foto1.jpg" alt="Deskripsi foto pertama" class="h-56 w-full object-cover">
<figcaption class="p-4 text-center font-medium text-gray-700">
Caption Foto Pertama
</figcaption>
</figure>
</section>
</main>
<footer class="mt-12 px-6 py-6 text-center text-gray-600">
<p>Author: Nathan Handoko</p>
<p>Email: nathan-h.inf25@ukwms.ac.id</p>
<p>Phone Number: 0851-0270-5905</p>
</footer>
</body>
</html>