Taehoon/ITAM
2
0
Fork 0
Code Issues 24 Pull Requests Actions Packages Projects Releases Wiki Activity

feat(ui/ux): unify typography to Pretendard and enforce read-only view mode as default

Browse Source 
- Set global font-family to Pretendard and letter-spacing to -0.02em.
- Standardized table header font-size to var(--fs-sm).
- Fixed table clipping and sticky header behavior at 1920x1080.
- Implemented dynamic select options in search filters.
- Enforced 'view' mode as default for all asset modals (PC, Server, SW, etc.).
- Improved Modal logic to ensure all fields (including dynamic rows) are correctly locked.
- Updated Location View detail button from 'Edit' to 'View'.
- Updated design_rule.md to reflect new typography standards.
This commit is contained in:
이태훈
2026-06-18 11:13:16 +09:00
parent 2cb4b87c0a
commit 3db05f2939
14 changed files with 143 additions and 99 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
src/views/LocationView.ts
View File

@@ -38,39 +38,37 @@ export async function renderLocationView(container: HTMLElement) {
container.innerHTML = `
<div class="location-view-wrapper">
<!-- 상단 통합 바 (Vercel Style) -->
<div class="location-filter-bar">
<div class="filter-actions-group">
<div class="filter-group">
<label style="display: flex; align-items: center; gap: 8px; cursor: pointer; text-transform: none; font-weight: 500; color: var(--primary);">
<input type="checkbox" id="chk-list-view-loc" style="width: 16px; height: 16px; cursor: pointer;" />
목록보기
</label>
</div>
<div class="filter-group">
<label>건물/위치</label>
<select id="sel-loc-main" class="form-select-sm">
${Object.keys(LOCATION_DATA).map(loc => `<option value="${loc}" ${loc === currentLoc ? 'selected' : ''}>${loc}</option>`).join('')}
<!-- 상단 통합 바 (Unified Search Bar) -->
<div class="location-filter-bar search-bar">
<div class="search-item">
<label class="list-view-toggle-label">
<input type="checkbox" id="chk-list-view-loc" />
목록보기
</label>
</div>
<div class="search-item">
<label>건물/위치</label>
<select id="sel-loc-main">
${Object.keys(LOCATION_DATA).map(loc => `<option value="${loc}" ${loc === currentLoc ? 'selected' : ''}>${loc}</option>`).join('')}
</select>
</div>
<div class="search-item">
<label>상세 위치</label>
<div class="flex items-center gap-2">
<select id="sel-loc-detail">
${(LOCATION_DATA[currentLoc] || []).map(det => `<option value="${det}" ${det === currentDetail ? 'selected' : ''}>${det}</option>`).join('')}
</select>
</div>
<div class="filter-group">
<label>상세 위치</label>
<div class="filter-row">
<select id="sel-loc-detail" class="form-select-sm">
${(LOCATION_DATA[currentLoc] || []).map(det => `<option value="${det}" ${det === currentDetail ? 'selected' : ''}>${det}</option>`).join('')}
</select>
<!-- 페이지네이션 -->
${locImages.length > 1 ? `
<div class="map-pagination-group">
<div class="page-btns">
<button id="btn-prev-page" class="btn btn-outline btn-sm" ${currentPage === 0 ? 'disabled' : ''}>이전</button>
<button id="btn-next-page" class="btn btn-outline btn-sm" ${currentPage === locImages.length - 1 ? 'disabled' : ''}>다음</button>
</div>
<span class="page-info">(${currentPage + 1} / ${locImages.length})</span>
<!-- 페이지네이션 -->
${locImages.length > 1 ? `
<div class="map-pagination-group">
<div class="page-btns flex gap-1">
<button id="btn-prev-page" class="btn btn-outline btn-sm" ${currentPage === 0 ? 'disabled' : ''}>이전</button>
<button id="btn-next-page" class="btn btn-outline btn-sm" ${currentPage === locImages.length - 1 ? 'disabled' : ''}>다음</button>
</div>
` : ''}
<span class="page-info">(${currentPage + 1} / ${locImages.length})</span>
</div>
` : ''}
</div>
</div>
</div>
@@ -202,7 +200,7 @@ export async function renderLocationView(container: HTMLElement) {
<span class="service-type-badge">${asset.service_type || '운영'}</span>
<span class="asset-type-label">${asset.asset_type || 'PC'}</span>
</div>
<button id="btn-edit-from-loc" class="btn btn-primary btn-sm">수정</button>
<button id="btn-view-from-loc" class="btn btn-primary btn-sm">조회</button>
</div>
`;
@@ -243,8 +241,8 @@ export async function renderLocationView(container: HTMLElement) {
</div>
`;
container.querySelector('#btn-edit-from-loc')?.addEventListener('click', () => {
openHwModal(asset, 'edit');
container.querySelector('#btn-view-from-loc')?.addEventListener('click', () => {
openHwModal(asset, 'view');
});
};