diff --git a/A00_Common/app_shell.ts b/A00_Common/app_shell.ts index 99356d58..cd37da17 100644 --- a/A00_Common/app_shell.ts +++ b/A00_Common/app_shell.ts @@ -184,16 +184,20 @@ function buildFooter(): HTMLElement { } /* ----------------------------------------------------------------------------- - * 셸 렌더 — #app 안에 헤더 + outlet + 푸터를 구성하고 outlet 반환 + * 셸 렌더 — #app 안에 헤더 + outlet 및 선택적 푸터를 구성하고 outlet 반환 * -------------------------------------------------------------------------- */ -export function renderShell(appRoot: HTMLElement): HTMLElement { +export function renderShell(appRoot: HTMLElement, showFooter = true): HTMLElement { appRoot.innerHTML = ""; const header = buildHeader(); const outlet = document.createElement("main"); outlet.className = "app-outlet"; outlet.id = "app-outlet"; - const footer = buildFooter(); - appRoot.append(header, outlet, footer); + appRoot.append(header, outlet); + if (showFooter) { + appRoot.append(buildFooter()); + } else { + outlet.classList.add("app-outlet--without-footer"); + } return outlet; } @@ -250,6 +254,9 @@ const SHELL_CSS = ` .app-outlet { min-height: calc(100vh - 64px - 56px); } +.app-outlet--without-footer { + min-height: calc(100vh - 64px); +} .app-footer { height: 56px; display: flex; diff --git a/A00_Common/main.ts b/A00_Common/main.ts index 33baaa29..90c3e00b 100644 --- a/A00_Common/main.ts +++ b/A00_Common/main.ts @@ -10,8 +10,18 @@ import "@ui/ui_template_theme.css"; import { injectBaseStyles } from "@ui/ui_template_elements"; +import { ROUTES, type RoutePath } from "@config/config_frontend"; import { initThemeAndLang, injectShellStyles, renderShell } from "./app_shell"; -import { renderCurrentRoute, ensureInitialHash } from "./router"; +import { currentRoute, renderCurrentRoute, ensureInitialHash } from "./router"; + +const FOOTERLESS_ROUTES: readonly RoutePath[] = [ + ROUTES.B04_WF1_SURFACE, + ROUTES.B05_WF2_ROUTE, + ROUTES.B06_WF3_PROFILE_CROSS, + ROUTES.B07_WF4_DESIGN_DETAIL, + ROUTES.B08_WF5_QUANTITY, + ROUTES.B09_WF6_ESTIMATION, +]; function bootstrap(): void { const appRoot = document.getElementById("app"); @@ -28,7 +38,8 @@ function bootstrap(): void { // 3. 셸 렌더 + 현재 라우트 렌더를 함께 수행하는 헬퍼 const renderAll = (): void => { - const outlet = renderShell(appRoot); // 헤더/푸터(로그인·언어 반영) 갱신 + const showFooter = !FOOTERLESS_ROUTES.includes(currentRoute()); + const outlet = renderShell(appRoot, showFooter); // 헤더/푸터(로그인·언어 반영) 갱신 void renderCurrentRoute(outlet); // 아울렛에 페이지 렌더 };