change folder to vendor name

This commit is contained in:
Power BI Dev
2026-05-03 19:42:40 +07:00
parent 63118c0fd0
commit b8fbc7c769
10 changed files with 0 additions and 0 deletions

View File

@@ -0,0 +1,60 @@
<!DOCTYPE html>
<html lang="id">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Group 02 - Tugas Halaman Statis</title>
<link rel="stylesheet" href="./style.css">
</head>
<body>
<header class="nav">
<div class="container">
<div class="brand">Informatika UNTAN — Static Assignment</div>
</div>
</header>
<section class="hero">
<img class="hero-bg" src="../../assets/global/hero.webp" alt="Hero">
<div class="container hero-inner">
<span class="badge">Halaman Statis</span>
<h1>Judul Halaman Group 02</h1>
</div>
</section>
<main class="container layout">
<article>
<div class="meta">
<span>Kelompok 02</span>
<span>2026</span>
</div>
<figure class="cover">
<img src="https://placehold.co/1200x675/e2e8f0/94a3b8?text=Header+Image" alt="Header halaman">
</figure>
<div id="assignment-body" class="article-body">
<!-- ================= START: BAGIAN YANG DIEDIT KELOMPOK ================= -->
<p>Tulis konten halaman kelompok di sini.</p>
<h3>Subjudul</h3>
<p>Gunakan paragraf, list, tabel, gambar, dan elemen konten lainnya.</p>
<!-- ================= END: BAGIAN YANG DIEDIT KELOMPOK ================= -->
</div>
</article>
<aside>
<div class="note">
<h3>Catatan Tugas</h3>
<p>Ubah hanya area <code>#assignment-body</code>. Jangan ubah shell layout.</p>
</div>
</aside>
</main>
<footer class="footer">
<div class="container footer-inner">
<img src="../../assets/global/logo.png" alt="Logo" class="footer-logo">
<p>© Informatika UNTAN — Group 02</p>
</div>
<img src="../../assets/global/footer.png" alt="Footer ornament" class="footer-ornament">
</footer>
</body>
</html>

View File

@@ -0,0 +1,47 @@
:root {
--brand-navy: #003150;
--brand-yellow: #feb401;
--text-main: #1e293b;
--text-soft: #64748b;
--bg-soft: #f8fafc;
--line: #e2e8f0;
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body { font-family: "Roboto", Arial, sans-serif; color: var(--text-main); background: #fff; line-height: 1.6; }
.container { width: min(1100px, 92%); margin-inline: auto; }
.nav { background: var(--brand-navy); color: #fff; border-bottom: 4px solid var(--brand-yellow); padding: 14px 0; }
.brand { font-size: 1.1rem; font-weight: 700; letter-spacing: .02em; }
.hero { position: relative; color: #fff; min-height: 220px; display: flex; align-items: flex-end; overflow: hidden; }
.hero-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: brightness(0.45); }
.hero-inner { position: relative; z-index: 1; padding: 36px 0; }
.badge { display: inline-block; background: var(--brand-yellow); color: #111827; font-size: .68rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; padding: .2rem .45rem; margin-bottom: 12px; }
.hero h1 { margin: 0; font-size: clamp(1.6rem, 3.2vw, 2.8rem); line-height: 1.2; }
.layout { display: grid; grid-template-columns: 1fr; gap: 2rem; padding: 2rem 0 4rem; }
@media (min-width: 1024px) { .layout { grid-template-columns: minmax(0, 3fr) minmax(260px, 1fr); } }
.meta { font-size: .78rem; text-transform: uppercase; color: #475569; display: flex; flex-wrap: wrap; gap: .75rem 1rem; margin-bottom: 1rem; }
.cover { background: var(--bg-soft); border: 1px solid var(--line); margin-bottom: 1.5rem; }
.cover img { width: 100%; height: auto; display: block; }
.article-body > * + * { margin-top: 1.1em; }
.article-body h2 { font-size: 1.35rem; margin: 1.6em 0 .5em; }
.article-body h3 { font-size: 1.1rem; margin: 1.4em 0 .4em; }
.article-body p { margin: 0 0 1em; }
.article-body ul, .article-body ol { padding-left: 1.4rem; }
.article-body blockquote { border-left: 4px solid #005eb8; background: #eef6ff; padding: .8rem 1rem; color: #334155; }
.article-body a { color: #005eb8; }
.article-body img { max-width: 100%; border-radius: 8px; }
.article-body code { background: #f1f5f9; padding: .1em .35em; border-radius: 4px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.note { border: 1px solid var(--line); background: var(--bg-soft); padding: 1rem; }
.note h3 { margin: 0 0 .5rem; font-size: .76rem; text-transform: uppercase; letter-spacing: .12em; color: #475569; }
.footer { margin-top: 2rem; background: var(--brand-navy); color: #fff; border-top: 4px solid var(--brand-yellow); }
.footer-inner { display: flex; align-items: center; justify-content: center; gap: .75rem; padding: 1rem 0; }
.footer-logo { height: 28px; width: auto; }
.footer-ornament { width: 100%; display: block; opacity: .9; }