WIP(style): UI 컴포넌트 하드코딩 제거 및 CSS 통합 (진행 중)

- 작업 상태: 진행 중 (Work In Progress)
- 주요 변경 사항:
  1. CSS 파일 통합: HWModal, SWModal, ListFactory 등에서 인라인 스타일(style 속성) 전면 제거 및 클래스 기반으로 재작성
  2. 폰트/타이포그래피 스케일업: 최소 폰트 14px 기준으로 전체 텍스트 크기 상향 및 굵기(font-weight) 상향 조정
  3. GNB(상단바) 레이아웃 개편: 2단 구조(로고 라인 / 메뉴 라인)로 변경 및 카테고리 텍스트 라벨 생략을 통한 간결화
  4. 로고 이미지 교체: image 92.png로 업데이트 및 경로 정리
  5. 디자인 가이드 분리: README에서 design_rule.md로 디자인 정책 문서 독립

* 참고: 현재 디자인 검토를 위한 중간 반영 상태이며, 피드백에 따라 추가 수정 예정임.

src/main.ts

@@ -17,21 +17,23 @@ import { createIcons, Plus, X, LayoutDashboard, Monitor, Server, Database, Lapto
 
 
 // 화면 갱신 통합 핸들러
-function refreshView() {
+function refreshView(tab?: string) {
   const mainContent = document.getElementById('main-content')!;
   if (!mainContent) return;
 
-  if (state.activeSubTab === '대시보드') {
+  const activeTab = tab || state.activeSubTab;
+
+  if (activeTab === '대시보드') {
     renderDashboard(mainContent);
     return;
   }
 
   // 서버 탭이 아닐 경우 '자산현황(위치)' 뷰 진입 방지 및 강제 리스트 모드 전환
-  if (state.activeSubTab !== '서버' && state.viewMode === 'location') {
+  if (activeTab !== '서버' && state.viewMode === 'location') {
     state.viewMode = 'list';
   }
 
-  const isServerTab = state.activeSubTab === '서버';
+  const isServerTab = activeTab === '서버';
   
   mainContent.innerHTML = `
     <div class="view-header">
@@ -206,35 +208,19 @@ function initRoleSwitcher() {
 function initializeAppDirectly() {
   const loginContainer = document.getElementById('login-container');
   const appLayout = document.getElementById('app-layout');
-  const checkbox = document.getElementById('role-toggle-checkbox') as HTMLInputElement;
-  const userLabel = document.querySelector('.role-label.user');
-  const adminLabel = document.querySelector('.role-label.admin');
 
   // 기본 권한 설정: 실무자 (User)
   state.currentUserRole = 'user';
   state.activeCategory = 'hw';
   state.activeSubTab = '서버'; // 실무자 기본 탭
 
-  // UI 상태 동기화
-  if (checkbox) checkbox.checked = false;
-  if (userLabel) userLabel.classList.add('active');
-  if (adminLabel) adminLabel.classList.remove('active');
-  document.body.classList.remove('admin-mode');
-
   // 화면 전환
   if (loginContainer) loginContainer.style.display = 'none';
   if (appLayout) appLayout.style.display = 'flex';
 
-  // 앱 초기화
-  initRoleSwitcher();
+  // 앱 초기화 및 내비게이션(헤더 포함) 렌더링
   initApp();
-
-  // 로고 클릭 시 새로고침 (초기 화면 복귀 효과)
-  const brand = document.querySelector('.brand') as HTMLElement;
-  if (brand) {
-    brand.style.cursor = 'pointer';
-    brand.onclick = () => location.reload();
-  }
+  renderNavigation((tab) => refreshView(tab));
 }
 
 document.addEventListener('DOMContentLoaded', initializeAppDirectly);