Merge remote-tracking branch 'origin/main' into fix/divisi-kepengurusan-hover

Reviewed-on: #5

assets/global/localization.js

@@ -571,7 +571,7 @@ const translations = {
         kontrib_guideline_5: "Tim redaksi berhak menyunting konten untuk keperluan editorial.",
 
         grp_limaem_hero_badge: "KOMUNITAS & KEPEMIMPINAN",
-        grp_limaem_hero_title: "Kehidupan Mahasiswa & Himpunan (HMIF)",
+        grp_limaem_hero_title: "Kehidupan Mahasiswa & <span style=\"color:#f5c82f;\">Himpunan (HMIF)</span>",
         grp_limaem_hero_desc: "Membangun ekosistem kolaboratif di mana teknologi bertemu dengan kreativitas, membentuk calon pemimpin industri masa depan.",
         grp_limaem_hero_btn: "Lihat Struktur Kepengurusan",
 
@@ -581,9 +581,9 @@ const translations = {
         grp_limaem_about_stat_students: "Mahasiswa Aktif",
         grp_limaem_about_stat_partners: "MITRA",
         grp_limaem_about_badge: "Inklusivitas & Kolaborasi",
- 
+
         grp_limaem_partners_title: "Partner dan Kolaborator",
- 
+
         grp_limaem_divisi_title: "Divisi Kepengurusan HMIF",
         grp_limaem_divisi_desc: "Struktur organisasi yang dirancang untuk efisiensi dan pengembangan kapasitas anggota di berbagai bidang strategis.",
         grp_limaem_divisi_b1_label: "Bidang 1",
@@ -604,7 +604,7 @@ const translations = {
         grp_limaem_divisi_b6_label: "Bidang 6",
         grp_limaem_divisi_b6_title: "Kewirausahaan dan Kemitraan",
         grp_limaem_divisi_b6_desc: "Divisi ini mengembangkan unit usaha organisasi, merancang skema pendanaan kreatif, dan menjalin kemitraan strategis untuk mendukung keberlanjutan program HMIF. Unit kerjanya meliputi riset peluang usaha, penyusunan proposal kemitraan, dan pengelolaan sponsor untuk meningkatkan kemandirian finansial dan akses jaringan profesional.",
- 
+
         grp_limaem_kegiatan_title: "Kegiatan Unggulan",
         grp_limaem_kegiatan_subtitle: "Kegiatan tahunan yang menjadi ikon Informatika UNTAN.",
         grp_limaem_kegiatan_c1_title: "Silaturahmi Keluarga Besar Informatika",
@@ -617,9 +617,11 @@ const translations = {
         grp_limaem_kegiatan_c4_desc: "Program intensif pengembangan skill teknis mahasiswa Informatika bersama mentor profesional dari industri.",
         grp_limaem_kegiatan_c5_title: "UPC",
         grp_limaem_kegiatan_c5_desc: "Kompetisi Pemograman untuk mengasah skill coding mahasiswa Informatika.",
-        grp_limaem_kegiatan_c6_title: "INFORMERS",
-        grp_limaem_kegiatan_c6_desc: "Perayaan ulang tahun Informatika UNTAN, momen kebersamaan dan kebanggaan seluruh keluarga besar Informatika.",
- 
+        grp_limaem_kegiatan_c6_title: "Study Excursion",
+        grp_limaem_kegiatan_c6_desc: "Study Excursion menjadi pengalaman berharga bagi mahasiswa semester 5 untuk belajar di luar kampus, memperluas wawasan, mengenal suasana baru, serta menciptakan kenangan berkesan bersama selama perjalanan.",
+        grp_limaem_kegiatan_c7_title: "INFORMERS",
+        grp_limaem_kegiatan_c7_desc: "Perayaan ulang tahun Informatika UNTAN, momen kebersamaan dan kebanggaan seluruh keluarga besar Informatika.",
+
         grp_limaem_sc_title: "STUDY CLUB",
         grp_limaem_sc_arise_title: "ARISE",
         grp_limaem_sc_arise_desc: "Belajar logika dan algoritma bersama, di mana kalian bisa berkembang dan membuka peluang mengikuti kompetisi pemrograman di berbagai level.",
@@ -627,9 +629,9 @@ const translations = {
         grp_limaem_sc_minerva_desc: "Gali potensi tersembunyi dari tumpukan data! Di sini kita akan bereksplorasi dengan algoritma Machine Learning, membedah teknik klasifikasi, hingga melatih model prediktif untuk menghasilkan insight yang bermakna.",
         grp_limaem_sc_sd_title: "Software Development (Segera Hadir)",
         grp_limaem_sc_sd_desc: "Wujudkan idemu jadi produk digital yang nyata! Kita akan ngoding bareng dari merancang frontend yang interaktif, membangun backend yang tangguh, serta mengintegrasikan berbagai API untuk menciptakan aplikasi web masa kini.",
- 
+
         grp_limaem_galeri_title: "Galeri Keseruan",
- 
+
         grp_limaem_cta_title: "Ada yang Ingin Ditanyakan Seputar HMIF?",
         grp_limaem_cta_desc: "Bergabunglah dengan HMIF untuk memperluas jaringan, mengasah skill, dan menciptakan dampak nyata.",
         grp_limaem_cta_btn: "Hubungi Kami",
@@ -1207,7 +1209,7 @@ const translations = {
         kontrib_guideline_5: "The editorial team reserves the right to edit content for editorial purposes.",
 
         grp_limaem_hero_badge: "COMMUNITY & LEADERSHIP",
-        grp_limaem_hero_title: "Student Life & Student Association (HMIF)",
+        grp_limaem_hero_title: "Student Life & <span style=\"color:#f5c82f;\">Student Association (HMIF)</span>",
         grp_limaem_hero_desc: "Building a collaborative ecosystem where technology meets creativity, shaping the industry leaders of tomorrow.",
         grp_limaem_hero_btn: "View Organizational Structure",
 
@@ -1217,9 +1219,9 @@ const translations = {
         grp_limaem_about_stat_students: "Active Students",
         grp_limaem_about_stat_partners: "PARTNERS",
         grp_limaem_about_badge: "Inclusivity & Collaboration",
- 
+
         grp_limaem_partners_title: "Partners and Collaborators",
- 
+
         grp_limaem_divisi_title: "HMIF Organizational Divisions",
         grp_limaem_divisi_desc: "An organizational structure designed for efficiency and capacity building across various strategic fields.",
         grp_limaem_divisi_b1_label: "Division 1",
@@ -1240,7 +1242,7 @@ const translations = {
         grp_limaem_divisi_b6_label: "Division 6",
         grp_limaem_divisi_b6_title: "Entrepreneurship and Partnerships",
         grp_limaem_divisi_b6_desc: "This division develops organizational business units, designs creative funding schemes, and establishes strategic partnerships to support the sustainability of HMIF programs. Its work units include business opportunity research, partnership proposal development, and sponsorship management to enhance financial independence and professional networking access.",
- 
+
         grp_limaem_kegiatan_title: "Flagship Events",
         grp_limaem_kegiatan_subtitle: "Annual events that have become icons of Informatics UNTAN.",
         grp_limaem_kegiatan_c1_title: "Informatics Family Gathering",
@@ -1253,9 +1255,11 @@ const translations = {
         grp_limaem_kegiatan_c4_desc: "An intensive technical skill development program for Informatics students, guided by professional mentors from the industry.",
         grp_limaem_kegiatan_c5_title: "UPC",
         grp_limaem_kegiatan_c5_desc: "A Programming Competition to sharpen the coding skills of Informatics students.",
-        grp_limaem_kegiatan_c6_title: "INFORMERS",
-        grp_limaem_kegiatan_c6_desc: "The anniversary celebration of Informatics UNTAN, a moment of togetherness and pride for the entire Informatics family.",
- 
+        grp_limaem_kegiatan_c6_title: "Study Excursion",
+        grp_limaem_kegiatan_c6_desc: "Study Excursion is a valuable experience for 5th semester students to study outside the campus, broaden their horizons, get to know new atmospheres, and create memorable memories together during the trip.",
+        grp_limaem_kegiatan_c7_title: "INFORMERS",
+        grp_limaem_kegiatan_c7_desc: "The anniversary celebration of Informatics UNTAN, a moment of togetherness and pride for the entire Informatics family.",
+
         grp_limaem_sc_title: "STUDY CLUBS",
         grp_limaem_sc_arise_title: "ARISE",
         grp_limaem_sc_arise_desc: "Learn logic and algorithms together, where you can grow and open opportunities to participate in programming competitions at various levels.",
@@ -1263,9 +1267,9 @@ const translations = {
         grp_limaem_sc_minerva_desc: "Uncover hidden potential from mountains of data! Here we explore Machine Learning algorithms, dissect classification techniques, and train predictive models to generate meaningful insights.",
         grp_limaem_sc_sd_title: "Software Development (Coming Soon)",
         grp_limaem_sc_sd_desc: "Turn your ideas into real digital products! We will code together — from designing interactive frontends and building robust backends, to integrating various APIs to create modern web applications.",
- 
+
         grp_limaem_galeri_title: "Fun Gallery",
- 
+
         grp_limaem_cta_title: "Have Questions About HMIF?",
         grp_limaem_cta_desc: "Join HMIF to expand your network, sharpen your skills, and create real impact.",
         grp_limaem_cta_btn: "Contact Us",

groups/LimaEm/assets/js/main.js

@@ -16,7 +16,7 @@
 
 (function () {
     var mobileMenuButton = document.getElementById('mobile-menu-button');
-    var mobileMenu       = document.getElementById('mobile-menu');
+    var mobileMenu = document.getElementById('mobile-menu');
 
     if (!mobileMenuButton || !mobileMenu) return;
 
@@ -346,15 +346,15 @@
     var AUTO_DELAY_MS = 4000; // 4 detik per slide
     var GAP_PX = 16 * 2; // grid gap-4 = 1rem? but original used gap-4; keep reasonable spacing if needed
 
-    var track   = document.getElementById('galeri-track');
+    var track = document.getElementById('galeri-track');
     var viewport = document.getElementById('galeri-viewport');
-    var prevBtn  = document.getElementById('galeri-prev');
-    var nextBtn  = document.getElementById('galeri-next');
+    var prevBtn = document.getElementById('galeri-prev');
+    var nextBtn = document.getElementById('galeri-next');
     var dotsContainer = document.getElementById('galeri-dots');
 
     if (!track || !viewport || !prevBtn || !nextBtn) return;
 
-    var currentSlide  = 0;
+    var currentSlide = 0;
     var autoSlideTimer;
     var originalHTML = track.innerHTML;
 
@@ -395,7 +395,7 @@
             var btn = document.createElement('button');
             btn.className = 'galeri-dot h-2.5 rounded-full transition-all duration-300 ' + (i === 0 ? 'bg-hmif-primary w-6' : 'bg-gray-200 w-2.5');
             btn.setAttribute('data-index', String(i));
-            btn.setAttribute('aria-label', 'Slide ' + (i+1));
+            btn.setAttribute('aria-label', 'Slide ' + (i + 1));
             (function (idx) { btn.addEventListener('click', function () { goToSlide(idx); startAutoSlide(); }); })(i);
             dotsContainer.appendChild(btn);
         }
@@ -465,14 +465,14 @@
 // =============================================================================
 
 (function () {
-    var TOTAL_CARDS   = 6;
+    var TOTAL_CARDS = 7;
     var AUTO_DELAY_MS = 2000;
-    var GAP_PX        = 32; // gap-8 = 2rem = 32px (tailwind)
+    var GAP_PX = 32; // gap-8 = 2rem = 32px (tailwind)
 
-    var track    = document.getElementById('slider-track');
+    var track = document.getElementById('slider-track');
     var viewport = document.getElementById('slider-viewport');
-    var prevBtn  = document.getElementById('slider-prev');
-    var nextBtn  = document.getElementById('slider-next');
+    var prevBtn = document.getElementById('slider-prev');
+    var nextBtn = document.getElementById('slider-next');
     var dotsContainer = document.getElementById('slider-dots');
 
     if (!track || !viewport || !prevBtn || !nextBtn) return;
@@ -518,9 +518,10 @@
         dotsContainer.innerHTML = '';
         for (var i = 0; i < n; i++) {
             var btn = document.createElement('button');
-            btn.className = 'slider-dot h-2.5 rounded-full transition-all duration-300 ' + (i === 0 ? 'bg-hmif-primary w-6' : 'bg-gray-200 w-2.5');
+            btn.className = 'slider-dot h-2.5 w-2.5 rounded-full transition-all duration-300 bg-gray-200 cursor-pointer';
+            if (i === 0) { btn.classList.remove('w-2.5', 'bg-gray-200'); btn.classList.add('w-6', 'bg-hmif-primary'); }
             btn.setAttribute('data-index', String(i));
-            btn.setAttribute('aria-label', 'Slide ' + (i+1));
+            btn.setAttribute('aria-label', 'Slide ' + (i + 1));
             (function (idx) { btn.addEventListener('click', function () { goTo(idx); startAuto(); }); })(i);
             dotsContainer.appendChild(btn);
         }

groups/LimaEm/style.css

@@ -22,7 +22,27 @@ body { font-family: "Roboto", Arial, sans-serif; color: var(--text-main); backgr
 .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); } }
+@media (min-width: 1024px) { 
+    .layout { grid-template-columns: minmax(0, 3fr) minmax(260px, 1fr); } 
+    /* Fix tinggi grid Galeri Keseruan (Desktop) */
+    .galeri-grid {
+        height: 500px !important;
+    }
+}
+
+/* ===== Custom Layout Fixes (Menggantikan arbitrary Tailwind) ===== */
+@media (min-width: 768px) {
+
+    /* Fix ukuran 2 card per baris untuk Kegiatan Unggulan */
+    .md-card-half {
+        width: calc(50% - 16px) !important;
+    }
+
+    /* Fix tinggi grid Galeri Keseruan (Tablet) */
+    .galeri-grid {
+        height: 420px !important;
+    }
+}
 
 .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; }
@@ -45,3 +65,30 @@ body { font-family: "Roboto", Arial, sans-serif; color: var(--text-main); backgr
 .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; }
+
+/* ===== Slider Dot Indicators ===== */
+.slider-dot,
+.galeri-dot {
+    display: inline-block;
+    height: 10px;
+    width: 10px;
+    min-width: 10px;
+    border-radius: 9999px;
+    background-color: #d1d5db; /* gray-300 fallback */
+    cursor: pointer;
+    border: none;
+    padding: 0;
+    transition: width 0.3s ease, background-color 0.3s ease;
+    flex-shrink: 0;
+}
+
+.slider-dot.bg-hmif-primary,
+.galeri-dot.bg-hmif-primary {
+    background-color: #0b2f4c; /* --color-hmif-primary dari output.css */
+    width: 24px;
+}
+
+/* Fix: title divisi berubah kuning saat hover */
+#divisi .group:hover h3 {
+    color: #f5c82f !important;
+}

package-lock.json

@@ -917,7 +917,6 @@
       "integrity": "sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">=12"
       },