모바일 상단 메뉴 수정 #1
This commit is contained in:
42
index.php
42
index.php
@@ -179,20 +179,20 @@
|
|||||||
<!-- Mobile Menu -->
|
<!-- Mobile Menu -->
|
||||||
<div id="mobile-menu" class="hidden md:hidden border-t border-slate-200 py-4">
|
<div id="mobile-menu" class="hidden md:hidden border-t border-slate-200 py-4">
|
||||||
<div class="flex flex-col gap-3">
|
<div class="flex flex-col gap-3">
|
||||||
<a href="sales_scenario/" class="text-sm font-medium text-slate-600 hover:text-brand-600 transition-colors px-2 py-2 hover:bg-slate-50 rounded-lg">영업 시나리오</a>
|
<a href="sales_scenario/" class="text-sm font-medium text-slate-600 hover:text-brand-600 transition-colors px-2 py-2 hover:bg-slate-50 rounded-lg" onclick="closeMobileMenu()">영업 시나리오</a>
|
||||||
<a href="sales_manager_scenario/" class="text-sm font-medium text-slate-600 hover:text-brand-600 transition-colors px-2 py-2 hover:bg-slate-50 rounded-lg">매니저 시나리오</a>
|
<a href="sales_manager_scenario/" class="text-sm font-medium text-slate-600 hover:text-brand-600 transition-colors px-2 py-2 hover:bg-slate-50 rounded-lg" onclick="closeMobileMenu()">매니저 시나리오</a>
|
||||||
<a href="salesmanagement/" class="text-sm font-medium text-slate-600 hover:text-brand-600 transition-colors px-2 py-2 hover:bg-slate-50 rounded-lg">영업관리</a>
|
<a href="salesmanagement/" class="text-sm font-medium text-slate-600 hover:text-brand-600 transition-colors px-2 py-2 hover:bg-slate-50 rounded-lg" onclick="closeMobileMenu()">영업관리</a>
|
||||||
<a href="corp/kodata.php" class="text-sm font-medium text-slate-600 hover:text-brand-600 transition-colors px-2 py-2 hover:bg-slate-50 rounded-lg">기업분석</a>
|
<a href="corp/kodata.php" class="text-sm font-medium text-slate-600 hover:text-brand-600 transition-colors px-2 py-2 hover:bg-slate-50 rounded-lg" onclick="closeMobileMenu()">기업분석</a>
|
||||||
<?php if (isset($_SESSION['userid']) && $_SESSION['userid'] != ''): ?>
|
<?php if (isset($_SESSION['userid']) && $_SESSION['userid'] != ''): ?>
|
||||||
<div class="flex items-center gap-2 px-2 py-2 border-t border-slate-200 mt-2 pt-3">
|
<div class="flex items-center gap-2 px-2 py-2 border-t border-slate-200 mt-2 pt-3">
|
||||||
<div class="w-8 h-8 rounded-full bg-slate-200 flex items-center justify-center text-slate-500 font-bold border border-slate-300">
|
<div class="w-8 h-8 rounded-full bg-slate-200 flex items-center justify-center text-slate-500 font-bold border border-slate-300">
|
||||||
<?= mb_substr($_SESSION['name'], 0, 1) ?>
|
<?= mb_substr($_SESSION['name'], 0, 1) ?>
|
||||||
</div>
|
</div>
|
||||||
<span class="text-sm font-medium text-slate-700 flex-1"><?= $_SESSION['name'] ?>님</span>
|
<span class="text-sm font-medium text-slate-700 flex-1"><?= $_SESSION['name'] ?>님</span>
|
||||||
<a href="login/logout.php" class="px-3 py-1.5 bg-slate-100 text-slate-600 text-xs font-bold rounded hover:bg-slate-200 transition-colors border border-slate-200">로그아웃</a>
|
<a href="login/logout.php" class="px-3 py-1.5 bg-slate-100 text-slate-600 text-xs font-bold rounded hover:bg-slate-200 transition-colors border border-slate-200" onclick="closeMobileMenu()">로그아웃</a>
|
||||||
</div>
|
</div>
|
||||||
<?php else: ?>
|
<?php else: ?>
|
||||||
<a href="login/login_form.php" class="px-4 py-2 bg-brand-600 text-white text-sm font-bold rounded-lg hover:bg-brand-700 transition-colors shadow-lg shadow-brand-200 text-center mt-2">
|
<a href="login/login_form.php" class="px-4 py-2 bg-brand-600 text-white text-sm font-bold rounded-lg hover:bg-brand-700 transition-colors shadow-lg shadow-brand-200 text-center mt-2" onclick="closeMobileMenu()">
|
||||||
로그인
|
로그인
|
||||||
</a>
|
</a>
|
||||||
<?php endif; ?>
|
<?php endif; ?>
|
||||||
@@ -477,7 +477,9 @@
|
|||||||
function init() {
|
function init() {
|
||||||
renderFilters();
|
renderFilters();
|
||||||
renderGrid();
|
renderGrid();
|
||||||
lucide.createIcons();
|
if (typeof lucide !== 'undefined') {
|
||||||
|
lucide.createIcons();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Filter Logic
|
// Filter Logic
|
||||||
@@ -881,12 +883,17 @@
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
// Mobile Menu Toggle
|
// Mobile Menu Functions
|
||||||
window.toggleMobileMenu = () => {
|
window.toggleMobileMenu = () => {
|
||||||
const mobileMenu = document.getElementById('mobile-menu');
|
const mobileMenu = document.getElementById('mobile-menu');
|
||||||
const menuIcon = document.getElementById('menu-icon');
|
const menuIcon = document.getElementById('menu-icon');
|
||||||
const closeIcon = document.getElementById('close-icon');
|
const closeIcon = document.getElementById('close-icon');
|
||||||
|
|
||||||
|
if (!mobileMenu || !menuIcon || !closeIcon) {
|
||||||
|
console.error('Mobile menu elements not found');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
if (mobileMenu.classList.contains('hidden')) {
|
if (mobileMenu.classList.contains('hidden')) {
|
||||||
mobileMenu.classList.remove('hidden');
|
mobileMenu.classList.remove('hidden');
|
||||||
menuIcon.classList.add('hidden');
|
menuIcon.classList.add('hidden');
|
||||||
@@ -897,7 +904,22 @@
|
|||||||
closeIcon.classList.add('hidden');
|
closeIcon.classList.add('hidden');
|
||||||
}
|
}
|
||||||
|
|
||||||
lucide.createIcons();
|
// 아이콘 재생성
|
||||||
|
if (typeof lucide !== 'undefined') {
|
||||||
|
lucide.createIcons();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
window.closeMobileMenu = () => {
|
||||||
|
const mobileMenu = document.getElementById('mobile-menu');
|
||||||
|
const menuIcon = document.getElementById('menu-icon');
|
||||||
|
const closeIcon = document.getElementById('close-icon');
|
||||||
|
|
||||||
|
if (mobileMenu && !mobileMenu.classList.contains('hidden')) {
|
||||||
|
mobileMenu.classList.add('hidden');
|
||||||
|
if (menuIcon) menuIcon.classList.remove('hidden');
|
||||||
|
if (closeIcon) closeIcon.classList.add('hidden');
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
// Close mobile menu when clicking outside
|
// Close mobile menu when clicking outside
|
||||||
@@ -909,7 +931,7 @@
|
|||||||
!mobileMenu.classList.contains('hidden') &&
|
!mobileMenu.classList.contains('hidden') &&
|
||||||
!mobileMenu.contains(e.target) &&
|
!mobileMenu.contains(e.target) &&
|
||||||
!mobileMenuButton.contains(e.target)) {
|
!mobileMenuButton.contains(e.target)) {
|
||||||
toggleMobileMenu();
|
closeMobileMenu();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user