MuhammadFarras/student-web-if-development-kit
1
0
Fork 0
forked from izu/student-web-if-development-kit
Code Pull Requests 1 Activity

fix(LimaEm): perfect full-width layout matching max-w-7xl standard container and precise gradient inline style

Browse Source
This commit is contained in:
Bayu
2026-06-04 21:02:58 +07:00
parent 3e87d77b04
commit 3076c922e3
1 changed files with 17 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
groups/LimaEm/index.html
+17 -11
View File
@@ -1,4 +1,4 @@
<!DOCTYPE html>
<!DOCTYPE html>
<html lang="id" class="scroll-smooth">
<head>
<meta charset="UTF-8">
@@ -1158,22 +1158,23 @@
</div>
</div>
<main id="main-content" class="pt-[88px] lg:pt-[160px] min-h-screen bg-white">
<div class="container mx-auto px-4 lg:px-8 py-12">
<main id="main-content" class="min-h-screen bg-white">
<div class="container mx-auto px-4 lg:px-8" style="padding-top: calc(88px + 3rem);">
<div class="mb-8 pb-8 border-b border-slate-200">
<span class="bg-untan-yellow text-slate-900 text-[10px] font-bold uppercase tracking-widest px-2 py-0.5 inline-block mb-3">Tugas Halaman Statis</span>
<h1 class="text-3xl lg:text-4xl font-bold text-slate-900 mb-2">Kehidupan Mahasiswa &amp; Himpunan (HMIF)</h1>
<p class="text-slate-500 text-sm">Kelompok 07 &mdash; LIMA EM &nbsp;&middot;&nbsp; Informatika UNTAN 2026</p>
</div>
<div id="assignment-body" class="prose prose-slate max-w-none">
</div>
<div id="assignment-body" class="w-full">
<!-- ================= START: BAGIAN YANG DIEDIT KELOMPOK ================= -->
<!-- Hero Section -->
<header class="relative w-full min-h-screen flex items-center overflow-hidden pt-[92px] lg:pt-[118px]">
<header class="relative w-full min-h-screen flex items-center overflow-hidden" style="padding-top: 92px;">
<img id="api-hero-bg" src="./assets/images/bg-kehidupan-mahasiswa.png" alt="Foto Kegiatan Mahasiswa"
class="absolute inset-0 w-full h-full object-cover z-0" />
<div class="absolute inset-0 bg-gradient-to-r from-hmif-primary via-hmif-primary/80 to-transparent z-0"></div>
<div class="absolute inset-0 z-0" style="background: linear-gradient(to right, #003150 0%, rgba(0, 49, 80, 0.8) 50%, transparent 100%);"></div>
<div class="relative z-10 max-w-7xl 2xl:max-w-[1440px] mx-auto px-6 lg:px-12 py-16 lg:py-24 w-full">
@@ -1182,12 +1183,15 @@
<div class="flex flex-col items-start text-left space-y-6">
<div data-i18n="grp_limaem_hero_badge"
class="bg-hmif-secondary/15 text-hmif-secondary font-bold text-xs md:text-sm px-3 py-1 rounded-full">
class="font-bold text-xs md:text-sm px-3 py-1 rounded-full ring-1 backdrop-blur-sm cursor-default"
style="background-color: rgba(254, 180, 1, 0.15); color: #feb401; --tw-ring-color: rgba(254, 180, 1, 0.3); transition: background-color 300ms ease;"
onmouseover="this.style.backgroundColor='rgba(254, 180, 1, 0.25)'"
onmouseout="this.style.backgroundColor='rgba(254, 180, 1, 0.15)'">
COMMUNITY & LEADERSHIP
</div>
<h1 data-i18n="grp_limaem_hero_title" class="text-3xl md:text-4xl lg:text-5xl font-bold text-white leading-tight">
Kehidupan Mahasiswa & <span class="text-hmif-secondary" style="color:var(--color-hmif-secondary)">Himpunan (HMIF)</span>
Kehidupan Mahasiswa & <span style="color:#feb401;">Himpunan (HMIF)</span>
</h1>
<p data-i18n="grp_limaem_hero_desc" class="text-base md:text-lg text-gray-300 font-light leading-relaxed max-w-xl">
@@ -1195,8 +1199,11 @@
kreativitas, membentuk calon pemimpin industri masa depan.
</p>
<button data-i18n="grp_limaem_hero_btn"
class="mt-4 bg-transparent border-2 border-white text-white font-bold text-sm md:text-base px-6 py-3 rounded-md hover:bg-hmif-secondary hover:text-hmif-primary hover:border-hmif-secondary transition-all hover:cursor-pointer">
<button data-i18n="grp_limaem_hero_btn" onclick="document.getElementById('divisi')?.scrollIntoView({behavior:'smooth'})"
class="mt-4 bg-transparent border-2 border-white text-white font-bold text-sm md:text-base px-6 py-3 rounded-md transition-all hover:cursor-pointer"
style="transition: all 0.25s ease;"
onmouseover="this.style.backgroundColor='#feb401'; this.style.color='#003150'; this.style.borderColor='#feb401';"
onmouseout="this.style.backgroundColor='transparent'; this.style.color='white'; this.style.borderColor='white';">
Lihat Struktur Kepengurusan
</button>
@@ -1988,7 +1995,6 @@
</div>
</section>
<!-- ================= END: BAGIAN YANG DIEDIT KELOMPOK ================= -->
</div>
</div>
</main>