Files
TK-FB-Project/web-ui/templates/work-layout.html
Hyungi Ahn 9998d9df96 fix: 헤더/사이드바 레이아웃 개선 및 템플릿 표준화
- 헤더를 fixed로 변경하고 z-index를 200으로 높여 사이드바와 겹침 방지
- 대시보드에서 빠른 작업 섹션 제거 (사이드바로 대체)
- 모든 템플릿(4개)에 사이드바 네비게이션 추가
- 템플릿 README에 사이드바 설명 추가

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2026-02-02 14:30:47 +09:00

132 lines
4.0 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>작업 관리 | 테크니컬코리아</title>
<!-- 모던 디자인 시스템 -->
<link rel="stylesheet" href="/css/design-system.css">
<link rel="stylesheet" href="/css/common.css">
<link rel="stylesheet" href="/css/modern-dashboard.css">
<!-- 페이지별 CSS 추가 -->
<!-- <link rel="stylesheet" href="/css/your-page.css"> -->
<!-- 필수 스크립트 (순서 중요) -->
<script type="module" src="/js/api-config.js"></script>
<script type="module" src="/js/auth-check.js"></script>
<script type="module" src="/js/load-navbar.js"></script>
<script type="module" src="/js/load-sidebar.js"></script>
<!-- 페이지별 스크립트 추가 -->
<!-- <script type="module" src="/js/your-page.js" defer></script> -->
</head>
<body>
<!-- 사이드바 네비게이션 (자동 로드됨) -->
<div id="sidebar-container"></div>
<!-- 네비게이션 헤더 (자동 로드됨) -->
<div id="navbar-container"></div>
<!-- 메인 콘텐츠 -->
<main class="dashboard-main">
<div class="work-page-container">
<!-- 페이지 제목 섹션 -->
<div class="page-title-section">
<h2 class="page-title">📋 페이지 제목</h2>
<p class="page-subtitle">페이지 설명을 여기에 작성하세요</p>
</div>
<!-- 작업 콘텐츠 카드 -->
<div class="work-card">
<!-- 필터/검색 영역 (선택사항) -->
<div class="work-filters">
<div class="filter-group">
<label class="filter-label">검색</label>
<input type="text" class="filter-input" placeholder="검색어 입력">
</div>
<div class="filter-group">
<label class="filter-label">필터</label>
<select class="filter-select">
<option value="all">전체</option>
<option value="active">활성</option>
<option value="inactive">비활성</option>
</select>
</div>
<button class="btn btn-primary">
<span>🔍</span>
검색
</button>
</div>
<!-- 작업 콘텐츠 영역 -->
<div class="work-content">
<p>여기에 작업 관련 콘텐츠를 추가하세요.</p>
<!-- 예시: 데이터 테이블 -->
<!--
<table class="data-table">
<thead>
<tr>
<th>컬럼1</th>
<th>컬럼2</th>
<th>작업</th>
</tr>
</thead>
<tbody>
<tr>
<td>데이터1</td>
<td>데이터2</td>
<td>
<button class="btn btn-sm btn-secondary">수정</button>
</td>
</tr>
</tbody>
</table>
-->
</div>
<!-- 액션 버튼 영역 (선택사항) -->
<div class="work-actions">
<button class="btn btn-secondary">취소</button>
<button class="btn btn-primary">저장</button>
</div>
</div>
</div>
</main>
<!-- 로딩 스피너 (선택사항) -->
<div id="loadingSpinner" class="loading-overlay" style="display: none;">
<div class="loading-content">
<div class="spinner"></div>
<p>데이터를 불러오는 중...</p>
</div>
</div>
<!-- 모달 (선택사항) -->
<!--
<div id="modal" class="modal-overlay" style="display: none;">
<div class="modal-container">
<div class="modal-header">
<h2 id="modalTitle">모달 제목</h2>
<button class="modal-close-btn" onclick="closeModal()">×</button>
</div>
<div class="modal-body">
모달 콘텐츠
</div>
<div class="modal-footer">
<button class="btn btn-secondary" onclick="closeModal()">취소</button>
<button class="btn btn-primary">확인</button>
</div>
</div>
</div>
-->
</body>
</html>