fix hamburger

This commit is contained in:
Tazyeuu
2026-06-04 22:03:30 +07:00
parent 91136a58a1
commit 30091e68cc
3 changed files with 1994 additions and 1331 deletions
+1173 -494
View File
File diff suppressed because it is too large Load Diff
+29 -50
View File
@@ -133,9 +133,8 @@
class="hover:text-untan-yellow transition-colors font-medium">SATU UNTAN</a>
</div>
<div class="pl-5 border-l border-white/20 flex items-center gap-3">
<button id="lang-toggle-btn"
class="language-toggle-btn text-xs hover:text-untan-yellow transition-colors flex items-center gap-1"
onclick="setLanguage(currentLang === 'id' ? 'en' : 'id')">
<button
class="language-toggle-btn text-xs hover:text-untan-yellow transition-colors flex items-center gap-1">
<span class="font-bold">ID</span> <span class="text-white/40">|</span> EN
</button>
<button
@@ -439,10 +438,9 @@
role="dialog" aria-modal="true" aria-label="Menu navigasi mobile">
<div class="p-4 flex justify-between items-center border-b border-white/10 bg-untan-navy">
<div class="flex items-center gap-4">
<span class="font-bold text-lg text-white font-serif">Menu Utama</span>
<button id="lang-toggle-mobile"
<span class="font-bold text-lg text-white font-sans">Menu Utama</span>
<button
class="language-toggle-btn px-2 py-1 rounded-sm border border-white/20 text-xs text-white hover:bg-white/10 transition-colors flex items-center gap-2"
onclick="setLanguage(currentLang === 'id' ? 'en' : 'id')"
aria-label="Ganti bahasa">
<span class="font-bold">ID</span> <span class="text-white/40" aria-hidden="true">|</span> EN
</button>
@@ -465,7 +463,7 @@
<!-- Tentang Kami -->
<div class="pt-2">
<span class="text-xs font-bold text-slate-400 uppercase font-serif" data-i18n="nav_about">Tentang
<span class="text-xs font-bold text-slate-400 uppercase font-sans" data-i18n="nav_about">Tentang
Kami</span>
<div class="pl-2 border-l-2 border-slate-100 mt-1 space-y-1">
<a href="content.html?type=berita" class="block py-1.5 text-sm text-slate-700 hover:text-untan-blue"
@@ -481,7 +479,7 @@
<!-- Program -->
<div class="pt-2 border-t border-slate-200">
<span class="text-xs font-bold text-slate-400 uppercase font-serif"
<span class="text-xs font-bold text-slate-400 uppercase font-sans"
data-i18n="nav_program">Program</span>
<div class="pl-2 border-l-2 border-slate-100 mt-1 space-y-1">
<a href="subject-and-courses.html" class="block py-1.5 text-sm text-slate-700 hover:text-untan-blue"
@@ -501,7 +499,7 @@
<!-- SDM -->
<div class="pt-2 border-t border-slate-200">
<span class="text-xs font-bold text-slate-400 uppercase font-serif" data-i18n="nav_sdm">SDM</span>
<span class="text-xs font-bold text-slate-400 uppercase font-sans" data-i18n="nav_sdm">SDM</span>
<div class="pl-2 border-l-2 border-slate-100 mt-1 space-y-1">
<a href="people-based-on-kk.html"
class="block py-1.5 text-sm text-slate-700 hover:text-untan-blue font-medium"
@@ -519,7 +517,7 @@
<!-- Fasilitas -->
<div class="pt-2 border-t border-slate-200">
<span class="text-xs font-bold text-slate-400 uppercase font-serif"
<span class="text-xs font-bold text-slate-400 uppercase font-sans"
data-i18n="nav_facilities">Fasilitas</span>
<div class="pl-2 border-l-2 border-slate-100 mt-1 space-y-1">
<a href="content.html?type=rubrik" class="block py-1.5 text-sm text-slate-700 hover:text-untan-blue"
@@ -535,7 +533,7 @@
<!-- Karya & Agenda -->
<div class="pt-2 border-t border-slate-200">
<span class="text-xs font-bold text-slate-400 uppercase font-serif" data-i18n="nav_works">Karya &
<span class="text-xs font-bold text-slate-400 uppercase font-sans" data-i18n="nav_works">Karya &
Agenda</span>
<div class="pl-2 border-l-2 border-slate-100 mt-1 space-y-1">
<a href="karya.html" class="block py-1.5 text-sm text-slate-700 hover:text-untan-blue"
@@ -552,7 +550,7 @@
<!-- Kontak -->
<div class="pt-2 border-t border-slate-200 pb-8">
<span class="text-xs font-bold text-slate-400 uppercase font-serif"
<span class="text-xs font-bold text-slate-400 uppercase font-sans"
data-i18n="nav_contact">Kontak</span>
<div class="pl-2 border-l-2 border-slate-100 mt-1 space-y-1">
<a href="content.html?type=berita" class="block py-1.5 text-sm text-slate-700 hover:text-untan-blue"
@@ -1328,7 +1326,7 @@
}
};
const translations = {
const rodaTranslations = {
id: {
info: 'INFO TERBARU',
tickerItem1: 'Selamat datang di antarmuka situs web Informatika terbaru!',
@@ -1449,7 +1447,7 @@
}
};
let currentLang = 'id';
let currentFilter = 'all';
let currentQuery = '';
let currentKbkInsight = 'ai';
@@ -1700,35 +1698,7 @@
}
function updateLangButton() {
const desktopButton = document.getElementById('lang-toggle-btn');
if (desktopButton) {
desktopButton.innerHTML = currentLang === 'id'
? '<span class="font-bold text-white">ID</span> <span class="text-white/40 mx-2">|</span> <span class="font-normal text-white">EN</span>'
: '<span class="font-normal text-white">ID</span> <span class="text-white/40 mx-2">|</span> <span class="font-bold text-white">EN</span>';
}
const mobileButton = document.getElementById('mobile-lang-toggle-btn');
if (mobileButton) {
mobileButton.textContent = currentLang === 'id' ? 'Bahasa: ID' : 'Language: EN';
}
}
function applyTranslation(lang) {
document.querySelectorAll('[data-i18n]').forEach((element) => {
const key = element.getAttribute('data-i18n');
if (translations[lang][key]) {
element.innerText = translations[lang][key];
}
});
document.querySelectorAll('[data-i18n-placeholder]').forEach((element) => {
const key = element.getAttribute('data-i18n-placeholder');
if (translations[lang][key]) {
element.setAttribute('placeholder', translations[lang][key]);
}
});
}
// Global localization.js handles translations and language toggle
function matchesQuery(item, query) {
const haystack = [item.title_id, item.title_en, item.authors, item.venue, item.year].join(' ').toLowerCase();
@@ -1968,19 +1938,17 @@
revealElements.forEach((element) => observer.observe(element));
}
window.setLanguage = function (lang) {
currentLang = lang;
updateLangButton();
applyTranslation(lang);
document.addEventListener('languageChanged', (e) => {
currentLang = e.detail.lang;
renderKbkInsight();
renderRisetCards();
renderDosenCards();
const lastUpdatedEl = document.getElementById("last-updated");
if (lastUpdatedEl) {
lastUpdatedEl.innerHTML = new Date(document.lastModified).toLocaleString(lang === 'id' ? 'id-ID' : 'en-US');
lastUpdatedEl.innerHTML = new Date(document.lastModified).toLocaleString(currentLang === 'id' ? 'id-ID' : 'en-US');
}
};
});
window.addEventListener('error', (event) => {
logAppError('window-error', event.error || new Error(event.message));
@@ -2050,7 +2018,16 @@
});
setupRevealAnimations();
setLanguage(currentLang);
if (typeof translations !== 'undefined') {
Object.assign(translations.id, rodaTranslations.id);
Object.assign(translations.en, rodaTranslations.en);
if (typeof applyLang === 'function') applyLang();
} else {
currentLang = 'id';
renderKbkInsight();
renderRisetCards();
renderDosenCards();
}
openKbkInsight(currentKbkInsight, false);
filterRiset(currentFilter);
searchRiset('');
@@ -2227,6 +2204,8 @@
if (section) observer.observe(section.closest('section'));
})();
</script>
<script src="../../assets/global/localization.js"></script>
</body>
</html>
+6 -1
View File
@@ -1,4 +1,4 @@
.bg-pattern {
.bg-pattern {
background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
@@ -173,6 +173,11 @@ html {
display: flex !important;
}
/* Hide hamburger button on desktop (aligns with ACAAB lg:1024px) */
#mobile-menu-button {
display: none !important;
}
#kbk-card-grid {
grid-template-columns: repeat(4, minmax(0, 1fr));
}