112 lines
4.1 KiB
HTML
112 lines
4.1 KiB
HTML
<div class="app-container">
|
|
$if(toc)$
|
|
<!-- Sidebar Navigation -->
|
|
<aside id="sidebar" role="complementary" aria-label="Table of contents">
|
|
<header class="sidebar-header">
|
|
<div class="toc-header-row">
|
|
<div class="sidebar-title">Table Of Contents</div>
|
|
<div class="toc-level-selector">
|
|
<select id="toc-level" aria-label="Filter table of contents levels">
|
|
<option value="1">1</option>
|
|
<option value="2">2</option>
|
|
<option value="3" selected>3</option>
|
|
<option value="4">4</option>
|
|
<option value="5">5</option>
|
|
<option value="6">6</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<div class="toc-container">
|
|
$if(toc)$
|
|
<nav class="toc" role="navigation" aria-label="Table of contents">
|
|
$toc$
|
|
</nav>
|
|
$endif$
|
|
</div>
|
|
</aside>
|
|
$endif$
|
|
<!-- Main Content Area -->
|
|
<main class="content-wrapper" role="main">
|
|
<div class="content-page">
|
|
<!-- Document Header -->
|
|
<header class="document-header">
|
|
$if(toc)$
|
|
<div class="mobile-menu-container">
|
|
<button class="mobile-menu-toggle" type="button" aria-label="Toggle navigation menu" aria-expanded="false">
|
|
<span aria-hidden="true">☰</span>
|
|
</button>
|
|
</div>
|
|
$endif$
|
|
<div class="header-content">
|
|
$if(client)$$if(project)$
|
|
<div class="header-line client-project">
|
|
$client$ - $project$$if(project_number)$ ($project_number$)$endif$
|
|
</div>
|
|
$endif$$endif$
|
|
$if(title)$
|
|
<div class="document-title">$title$</div>
|
|
$endif$
|
|
<div class="document-meta">
|
|
$if(tracking_number)$<span class="tracking-number">$tracking_number$</span>$endif$
|
|
$if(revision)$<span class="revision">Revision: $revision$</span>$endif$
|
|
$if(status)$<span class="status">Status: $status$</span>$endif$
|
|
$if(revision_comparison)$<span class="revision-comparison">$revision_comparison$</span>$endif$
|
|
</div>
|
|
$if(is_draft)$
|
|
$if(generation_time)$
|
|
<div class="draft-line">
|
|
<span class="draft-status">[DRAFT Generated at $generation_time$]</span>
|
|
</div>
|
|
$endif$
|
|
$endif$
|
|
</div>
|
|
</header>
|
|
|
|
<!-- Scroll Progress Bar -->
|
|
<div class="scroll-progress" role="progressbar" aria-label="Reading progress">
|
|
<div class="scroll-progress-bar"></div>
|
|
</div>
|
|
|
|
<!-- Print-only header -->
|
|
<div class="print-header">
|
|
$if(custom_header)$
|
|
$custom_header$
|
|
$else$
|
|
$if(client)$$if(project)$
|
|
<div class="header-line client-project">
|
|
$client$ - $project$$if(project_number)$ ($project_number$)$endif$
|
|
</div>
|
|
$endif$$endif$
|
|
$if(title)$
|
|
<div class="header-line document-title">$title$</div>
|
|
$endif$
|
|
$if(tracking_number)$<div class="header-line">$tracking_number$$if(revision)$ Revision: $revision$$endif$$if(status)$ Status: $status$$endif$</div>$endif$
|
|
$if(revision_comparison)$<div class="header-line revision-comparison">$revision_comparison$</div>$endif$
|
|
$endif$
|
|
$if(generation_time)$
|
|
<div class="header-line metadata-line draft-line">
|
|
<span class="draft-status">Generated: $generation_time$</span>
|
|
</div>
|
|
$endif$
|
|
</div>
|
|
|
|
<!-- Print-only footer -->
|
|
<div class="print-footer">
|
|
<div class="footer-left">
|
|
$if(tracking_number)$$tracking_number$$endif$$if(revision)$ Revision: $revision$$endif$$if(status)$ Status: $status$$endif$
|
|
</div>
|
|
<div class="footer-right">
|
|
Page <span class="page-number"></span>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<!-- Document Content -->
|
|
<article class="document-content">
|
|
$body$
|
|
</article>
|
|
</div>
|
|
</main>
|
|
</div>
|