Merge pull request 'fix/divisi-kepengurusan-hover' (#6) from fix/divisi-kepengurusan-hover into main

Reviewed-on: #6

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",
 
@@ -617,8 +617,10 @@ 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_title: "Study Excursion",
-        grp_limaem_kegiatan_c6_desc: "Perayaan ulang tahun Informatika UNTAN, momen kebersamaan dan kebanggaan seluruh keluarga besar Informatika.",
+        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",
@@ -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",
 
@@ -1253,8 +1255,10 @@ 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_title: "Study Excursion",
-        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_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",

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 prevBtn = document.getElementById('galeri-prev');
-    var nextBtn  = document.getElementById('galeri-next');
+    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 prevBtn = document.getElementById('slider-prev');
-    var nextBtn  = document.getElementById('slider-next');
+    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"
       },