|
18 | 18 | <meta property="og:description" content="A specialized technology powerhouse delivering PWA, open-source, and custom software solutions." /> |
19 | 19 | <meta property="og:image" content="/src/social.png" /> |
20 | 20 |
|
21 | | - |
22 | | - |
23 | 21 | <script> |
24 | 22 | if ('serviceWorker' in navigator) { window.addEventListener('load', () => { navigator.serviceWorker.register('/sw.js') .then(reg => { console.log('Core Service Worker Active. Scope:', reg.scope); }) .catch(err => { console.error('× Service Worker Registration Failed:', err); }); }); } |
25 | 23 | </script> |
|
44 | 42 | <link rel="stylesheet" href="/css/github-markdown.min.css"> |
45 | 43 |
|
46 | 44 | <!-- global css used every page --> |
47 | | - <link rel="stylesheet" href="/css/global.css"> |
48 | | - <!-- current page css --> |
49 | | - <link rel="stylesheet" href="/css/clog.css"> |
| 45 | + <link rel="stylesheet" href="/css/global.css"> |
| 46 | + <!-- current page css --> |
| 47 | + <link rel="stylesheet" href="/css/clog.css"> |
50 | 48 |
|
51 | 49 | </head> |
52 | 50 |
|
53 | 51 | <body> |
54 | 52 |
|
55 | | - |
56 | | - |
57 | 53 | <div id="loader" class="loader" style="pointer-events: none;"> |
58 | 54 | <img style="height: 120px; width: 120px; pointer-events: none;" src="/src/mrc-nuca-loading.svg" alt="mrc-nuca-loading"> |
59 | 55 | <div class="loader-text-wrapper"> |
|
84 | 80 |
|
85 | 81 | <div class="tech-grid"></div> |
86 | 82 |
|
87 | | - |
88 | 83 | <header class="header" id="navbar"> |
89 | 84 | <div class="nav-bar glass-panel"> |
90 | 85 | <a href="/" class="nav-logo"> |
|
114 | 109 | <a href="/CopyRight/">Brand Guidelines</a> |
115 | 110 | <a href="/Contact/">Contact</a> |
116 | 111 | <div class="mobile-menu-goto-id"> |
117 | | - <a href="#expertise">Expertise</a> |
118 | | - <a href="#workflow">Workflow</a> |
119 | | - <a href="#open-source">Open Source</a> |
| 112 | + <a href="#expertise">Expertise</a> |
| 113 | + <a href="#workflow">Workflow</a> |
| 114 | + <a href="#open-source">Open Source</a> |
120 | 115 | </div> |
121 | 116 | </div> |
122 | 117 | </header> |
|
133 | 128 | <use href="/src/global.svg#icon-sort"></use> |
134 | 129 | </svg> |
135 | 130 | </button> |
136 | | - <select class="sort-select" id="sort-select"> |
| 131 | + <select class="sort-select" id="sort-select" aria-label="Sort logs option"> |
137 | 132 | <option value="NameA">By Name Ascending</option> |
138 | 133 | <option value="NameD">By Name Descending</option> |
139 | 134 | <option value="DateA">By Date Ascending</option> |
140 | 135 | <option value="DateD">By Date Descending</option> |
141 | 136 | </select> |
142 | | - <svg class="clearSort icon" onclick="clearSort()"><use href="/src/global.svg#icon-close"></use></svg> |
| 137 | + <svg class="clearSort icon" onclick="clearSort()" tabindex="0" role="button" aria-label="Clear sort options" onkeydown="if(event.key === 'Enter' || event.key === ' ') { clearSort(); event.preventDefault(); }"> |
| 138 | + <use href="/src/global.svg#icon-close"></use> |
| 139 | + </svg> |
143 | 140 | </div> |
144 | 141 | <div class="search-wrapper glass-panel" id="search-wrapper"> |
145 | 142 | <button class="search-icon-btn" onclick="toggleSearch()" aria-label="Search"> |
146 | 143 | <svg class="icon"><use href="/src/global.svg#icon-search"></use></svg> |
147 | 144 | </button> |
148 | 145 | <input type="text" class="search-input" id="search-bar" placeholder="Type To Search..." oninput="handleSearchInput()" onblur="closeSearchIfEmpty()"> |
149 | | - <svg class="clearSearch icon" onclick="clearSearch()"><use href="/src/global.svg#icon-close"></use></svg> |
| 146 | + <svg class="clearSearch icon" onclick="clearSearch()" tabindex="0" role="button" aria-label="Clear search input" onkeydown="if(event.key === 'Enter' || event.key === ' ') { clearSearch(); event.preventDefault(); }"> |
| 147 | + <use href="/src/global.svg#icon-close"></use> |
| 148 | + </svg> |
150 | 149 | </div> |
151 | 150 | </div> |
152 | 151 |
|
153 | 152 | <div class="layout-grid"> |
154 | | - <aside> |
| 153 | + <aside class="filter-panel"> |
155 | 154 | <div class="glass-panel sidebar-card pad-2"> |
156 | | - <div class="sidebar-header" id="sidebar-header" onclick="toggleMobileCategories()"> |
| 155 | + <div class="sidebar-header" id="sidebar-header" onclick="toggleMobileCategories()" role="button" tabindex="0" aria-label="Toggle categories list" onkeydown="if(event.key === 'Enter' || event.key === ' ') { toggleMobileCategories(); event.preventDefault(); }"> |
157 | 156 | <div class="flex items-center gap-2"> |
158 | 157 | <svg class="icon txt-mrc"><use href="/src/global.svg#icon-category"></use></svg> Categories |
159 | 158 | </div> |
|
185 | 184 | <svg class="icon"><use href="/src/global.svg#icon-back"></use></svg> Back to Logs |
186 | 185 | </button> |
187 | 186 |
|
| 187 | + <!-- Table of Contents Section --> |
| 188 | + <div id="reader-toc-container" class="reader-toc-container glass-panel"> |
| 189 | + <div class="toggleToc" onclick="toggleToC()" role="button" tabindex="0" aria-label="table of contents" onkeydown="if(event.key === 'Enter' || event.key === ' ') { toggleToC(); event.preventDefault(); }"> |
| 190 | + <h4 style="margin: 0; font-size: 0.9rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; display: flex; align-items: center; gap: 0.5rem; color: #fff;"> |
| 191 | + <svg class="icon" style="width: 16px; height: 16px; color: var(--mrc);"><use href="/src/global.svg#icon-category"></use></svg> Table of Contents |
| 192 | + </h4> |
| 193 | + </div> |
| 194 | + <div id="reader-toc" style="max-height: 0; overflow: hidden; transition: max-height 0.3s ease-out; margin-top: 0.5rem;"></div> |
| 195 | + </div> |
188 | 196 | <article class="glass-panel reader-container"> |
189 | 197 | <img src="" alt="Banner" id="full-img" class="reader-banner" onerror="this.style.display='none'"> |
190 | 198 |
|
@@ -218,16 +226,6 @@ <h1 class="reader-title" id="full-title">Loading...</h1> |
218 | 226 | </div> |
219 | 227 | </div> |
220 | 228 |
|
221 | | - <!-- Table of Contents Section --> |
222 | | - <div id="reader-toc-container" class="glass-panel" style="display: none; margin-bottom: 2rem; padding: 1rem 1.25rem; border-radius: 12px;"> |
223 | | - <div class="toggleToc" onclick="toggleToC()"> |
224 | | - <h4 style="margin: 0; font-size: 0.9rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; display: flex; align-items: center; gap: 0.5rem; color: #fff;"> |
225 | | - <svg class="icon" style="width: 16px; height: 16px; color: var(--mrc);"><use href="/src/global.svg#icon-category"></use></svg> Table of Contents |
226 | | - </h4> |
227 | | - <svg id="toc-toggle-icon" class="icon" style="width: 16px; height: 16px; transition: transform 0.3s; color: var(--text-muted);"><use href="/src/global.svg#icon-chevron-down"></use></svg> |
228 | | - </div> |
229 | | - <div id="reader-toc" style="max-height: 0; overflow: hidden; transition: max-height 0.3s ease-out; margin-top: 0;"></div> |
230 | | - </div> |
231 | 229 |
|
232 | 230 | <div class="markdown-body" id="full-body"></div> |
233 | 231 | <div class="reader-meta-bottom"> |
@@ -318,9 +316,9 @@ <h4 class="uppercase flex txt-main txt-center gap-1 font-md pos-rel">Connect</h4 |
318 | 316 | </div> |
319 | 317 | </div> |
320 | 318 | </footer> |
321 | | - <!-- handle loader , copyright year, animation and etc --> |
| 319 | + <!-- handle loader , copyright year, animation,menu and etc --> |
322 | 320 | <script src="/js/global.js"></script> |
323 | | - <!-- curentpage js --> |
| 321 | + <!-- currentpage js --> |
324 | 322 | <script src="/js/clog.js"></script> |
325 | 323 |
|
326 | 324 | </body> |
|
0 commit comments