admin-lte 4.0.0-beta3 → 4.0.0-rc3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (76) hide show
  1. package/.browserslistrc +9 -4
  2. package/ACCESSIBILITY-COMPLIANCE.md +369 -0
  3. package/CHANGELOG.md +460 -0
  4. package/README.md +50 -7
  5. package/dist/{pages/UI → UI}/general.html +79 -28
  6. package/dist/{pages/UI → UI}/icons.html +76 -25
  7. package/dist/{pages/UI → UI}/timeline.html +80 -29
  8. package/dist/css/adminlte.css +516 -332
  9. package/dist/css/adminlte.css.map +1 -1
  10. package/dist/css/adminlte.min.css +1 -1
  11. package/dist/css/adminlte.min.css.map +1 -1
  12. package/dist/css/adminlte.rtl.css +516 -332
  13. package/dist/css/adminlte.rtl.css.map +1 -1
  14. package/dist/css/adminlte.rtl.min.css +1 -1
  15. package/dist/css/adminlte.rtl.min.css.map +1 -1
  16. package/dist/{pages/docs → docs}/browser-support.html +77 -44
  17. package/dist/{pages/docs → docs}/color-mode.html +82 -50
  18. package/dist/{pages/docs → docs}/components/main-header.html +82 -49
  19. package/dist/{pages/docs → docs}/components/main-sidebar.html +78 -46
  20. package/dist/{pages/docs → docs}/faq.html +76 -42
  21. package/dist/{pages/docs → docs}/how-to-contribute.html +77 -44
  22. package/dist/{pages/docs → docs}/introduction.html +82 -54
  23. package/dist/{pages/docs → docs}/javascript/treeview.html +77 -44
  24. package/dist/{pages/docs → docs}/layout.html +76 -25
  25. package/dist/{pages/docs → docs}/license.html +76 -42
  26. package/dist/{pages/examples → examples}/lockscreen.html +49 -18
  27. package/dist/{pages/examples → examples}/login-v2.html +47 -16
  28. package/dist/{pages/examples → examples}/login.html +47 -16
  29. package/dist/{pages/examples → examples}/register-v2.html +47 -16
  30. package/dist/{pages/examples → examples}/register.html +47 -16
  31. package/dist/{pages/forms → forms}/general.html +76 -25
  32. package/dist/{pages/generate → generate}/theme.html +193 -24
  33. package/dist/{pages/index.html → index.html} +90 -57
  34. package/dist/{pages/index2.html → index2.html} +99 -48
  35. package/dist/{pages/index3.html → index3.html} +80 -29
  36. package/dist/js/adminlte.js +795 -345
  37. package/dist/js/adminlte.js.map +1 -1
  38. package/dist/js/adminlte.min.js +3 -3
  39. package/dist/js/adminlte.min.js.map +1 -1
  40. package/dist/{pages/layout → layout}/collapsed-sidebar.html +75 -24
  41. package/dist/layout/fixed-complete.html +883 -0
  42. package/dist/layout/fixed-footer.html +880 -0
  43. package/dist/layout/fixed-header.html +880 -0
  44. package/dist/{pages/layout → layout}/fixed-sidebar.html +76 -25
  45. package/dist/{pages/layout → layout}/layout-custom-area.html +76 -25
  46. package/dist/{pages/layout → layout}/layout-rtl.html +76 -25
  47. package/dist/{pages/layout → layout}/logo-switch.html +55 -24
  48. package/dist/{pages/layout → layout}/sidebar-mini.html +75 -24
  49. package/dist/{pages/layout → layout}/unfixed-sidebar.html +76 -25
  50. package/dist/{pages/tables → tables}/simple.html +76 -25
  51. package/dist/{pages/widgets → widgets}/cards.html +76 -25
  52. package/dist/{pages/widgets → widgets}/info-box.html +76 -25
  53. package/dist/{pages/widgets → widgets}/small-box.html +76 -25
  54. package/eslint.config.js +82 -0
  55. package/package.json +42 -37
  56. package/src/scss/_accessibility.scss +292 -0
  57. package/src/scss/_app-footer.scss +8 -0
  58. package/src/scss/_app-header.scss +8 -0
  59. package/src/scss/_app-sidebar.scss +12 -0
  60. package/src/scss/_table.scss +1 -9
  61. package/src/scss/_variables.scss +2 -1
  62. package/src/scss/adminlte.scss +3 -0
  63. package/src/ts/accessibility.ts +533 -0
  64. package/src/ts/adminlte.ts +48 -9
  65. package/src/ts/card-widget.ts +1 -2
  66. package/src/ts/push-menu.ts +1 -2
  67. package/src/ts/treeview.ts +13 -2
  68. package/src/ts/util/index.ts +39 -7
  69. package/.astro/content-assets.mjs +0 -1
  70. package/.astro/content-modules.mjs +0 -1
  71. package/.astro/content.d.ts +0 -166
  72. package/.astro/data-store.json +0 -1
  73. package/.astro/settings.json +0 -5
  74. package/.astro/types.d.ts +0 -2
  75. package/adminlte-v4.0.0-beta1-with-dist.zip +0 -0
  76. package/adminlte-v4.0.0-beta3.zip +0 -0
package/dist/{pages/docs → docs}/components/main-header.html RENAMED
@@ -4,67 +4,60 @@
4
4
  <head>
5
5
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
6
6
  <title>Main Header Component | AdminLTE 4</title>
7
+ <!--begin::Accessibility Meta Tags-->
8
+ <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
9
+ <meta name="color-scheme" content="light dark" />
10
+ <meta name="theme-color" content="#007bff" media="(prefers-color-scheme: light)" />
11
+ <meta name="theme-color" content="#1a1a1a" media="(prefers-color-scheme: dark)" />
12
+ <!--end::Accessibility Meta Tags-->
7
13
  <!--begin::Primary Meta Tags-->
8
- <meta name="viewport" content="width=device-width, initial-scale=1.0" />
9
14
  <meta name="title" content="Main Header Component | AdminLTE 4" />
10
15
  <meta name="author" content="ColorlibHQ" />
11
16
  <meta
12
17
  name="description"
13
- content="AdminLTE is a Free Bootstrap 5 Admin Dashboard, 30 example pages using Vanilla JS."
18
+ content="AdminLTE is a Free Bootstrap 5 Admin Dashboard, 30 example pages using Vanilla JS. Fully accessible with WCAG 2.1 AA compliance."
14
19
  />
15
20
  <meta
16
21
  name="keywords"
17
- content="bootstrap 5, bootstrap, bootstrap 5 admin dashboard, bootstrap 5 dashboard, bootstrap 5 charts, bootstrap 5 calendar, bootstrap 5 datepicker, bootstrap 5 tables, bootstrap 5 datatable, vanilla js datatable, colorlibhq, colorlibhq dashboard, colorlibhq admin dashboard"
22
+ content="bootstrap 5, bootstrap, bootstrap 5 admin dashboard, bootstrap 5 dashboard, bootstrap 5 charts, bootstrap 5 calendar, bootstrap 5 datepicker, bootstrap 5 tables, bootstrap 5 datatable, vanilla js datatable, colorlibhq, colorlibhq dashboard, colorlibhq admin dashboard, accessible admin panel, WCAG compliant"
18
23
  />
19
24
  <!--end::Primary Meta Tags-->
25
+ <!--begin::Accessibility Features-->
26
+ <!-- Skip links will be dynamically added by accessibility.js -->
27
+ <meta name="supported-color-schemes" content="light dark" />
28
+ <link rel="preload" href="../../css/adminlte.css" as="style" />
29
+ <!--end::Accessibility Features-->
20
30
  <!--begin::Fonts-->
21
31
  <link
22
32
  rel="stylesheet"
23
33
  href="https://cdn.jsdelivr.net/npm/@fontsource/source-sans-3@5.0.12/index.css"
24
34
  integrity="sha256-tXJfXfp6Ewt1ilPzLDtQnJV4hclT9XuaZUKyUvmyr+Q="
25
35
  crossorigin="anonymous"
36
+ media="print"
37
+ onload="this.media='all'"
26
38
  />
27
39
  <!--end::Fonts-->
28
40
  <!--begin::Third Party Plugin(OverlayScrollbars)-->
29
41
  <link
30
42
  rel="stylesheet"
31
- href="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/styles/overlayscrollbars.min.css"
32
- integrity="sha256-tZHrRjVqNSRyWg2wbppGnT833E/Ys0DHWGwT04GiqQg="
43
+ href="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.11.0/styles/overlayscrollbars.min.css"
33
44
  crossorigin="anonymous"
34
45
  />
35
46
  <!--end::Third Party Plugin(OverlayScrollbars)-->
36
47
  <!--begin::Third Party Plugin(Bootstrap Icons)-->
37
48
  <link
38
49
  rel="stylesheet"
39
- href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"
40
- integrity="sha256-9kPW/n5nn53j4WMRYAxe9c1rCY96Oogo/MKSVdKzPmI="
50
+ href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css"
41
51
  crossorigin="anonymous"
42
52
  />
43
53
  <!--end::Third Party Plugin(Bootstrap Icons)-->
44
54
  <!--begin::Required Plugin(AdminLTE)-->
45
- <link rel="stylesheet" href="../../../../dist/css/adminlte.css" />
55
+ <link rel="stylesheet" href="../../css/adminlte.css" />
46
56
  <!--end::Required Plugin(AdminLTE)-->
47
- <style>
48
- [data-astro-image] {
49
- width: 100%;
50
- height: auto;
51
- object-fit: var(--fit);
52
- object-position: var(--pos);
53
- aspect-ratio: var(--w) / var(--h);
54
- }
55
- [data-astro-image='responsive'] {
56
- max-width: calc(var(--w) * 1px);
57
- max-height: calc(var(--h) * 1px);
58
- }
59
- [data-astro-image='fixed'] {
60
- width: calc(var(--w) * 1px);
61
- height: calc(var(--h) * 1px);
62
- }
63
- </style>
64
57
  </head>
65
58
  <!--end::Head-->
66
59
  <!--begin::Body-->
67
- <body class="layout-fixed sidebar-expand-lg bg-body-tertiary">
60
+ <body class="layout-fixed sidebar-expand-lg sidebar-open bg-body-tertiary">
68
61
  <!--begin::App Wrapper-->
69
62
  <div class="app-wrapper">
70
63
  <!--begin::Header-->
@@ -103,7 +96,7 @@
103
96
  <div class="d-flex">
104
97
  <div class="flex-shrink-0">
105
98
  <img
106
- src="../../../../dist/assets/img/user1-128x128.jpg"
99
+ src="/assets/img/user1-128x128.jpg"
107
100
  alt="User Avatar"
108
101
  class="img-size-50 rounded-circle me-3"
109
102
  />
@@ -129,7 +122,7 @@
129
122
  <div class="d-flex">
130
123
  <div class="flex-shrink-0">
131
124
  <img
132
- src="../../../../dist/assets/img/user8-128x128.jpg"
125
+ src="/assets/img/user8-128x128.jpg"
133
126
  alt="User Avatar"
134
127
  class="img-size-50 rounded-circle me-3"
135
128
  />
@@ -155,7 +148,7 @@
155
148
  <div class="d-flex">
156
149
  <div class="flex-shrink-0">
157
150
  <img
158
- src="../../../../dist/assets/img/user3-128x128.jpg"
151
+ src="/assets/img/user3-128x128.jpg"
159
152
  alt="User Avatar"
160
153
  class="img-size-50 rounded-circle me-3"
161
154
  />
@@ -220,7 +213,7 @@
220
213
  <li class="nav-item dropdown user-menu">
221
214
  <a href="#" class="nav-link dropdown-toggle" data-bs-toggle="dropdown">
222
215
  <img
223
- src="../../../../dist/assets/img/user2-160x160.jpg"
216
+ src="/assets/img/user2-160x160.jpg"
224
217
  class="user-image rounded-circle shadow"
225
218
  alt="User Image"
226
219
  />
@@ -230,7 +223,7 @@
230
223
  <!--begin::User Image-->
231
224
  <li class="user-header text-bg-primary">
232
225
  <img
233
- src="../../../../dist/assets/img/user2-160x160.jpg"
226
+ src="/assets/img/user2-160x160.jpg"
234
227
  class="rounded-circle shadow"
235
228
  alt="User Image"
236
229
  />
@@ -274,7 +267,7 @@
274
267
  <a href="../../index.html" class="brand-link">
275
268
  <!--begin::Brand Image-->
276
269
  <img
277
- src="../../../../dist/assets/img/AdminLTELogo.png"
270
+ src="/assets/img/AdminLTELogo.png"
278
271
  alt="AdminLTE Logo"
279
272
  class="brand-image opacity-75 shadow"
280
273
  />
@@ -293,8 +286,10 @@
293
286
  <ul
294
287
  class="nav sidebar-menu flex-column"
295
288
  data-lte-toggle="treeview"
296
- role="menu"
289
+ role="navigation"
290
+ aria-label="Main navigation"
297
291
  data-accordion="false"
292
+ id="navigation"
298
293
  >
299
294
  <li class="nav-item">
300
295
  <a href="#" class="nav-link">
@@ -382,6 +377,24 @@
382
377
  <p>Fixed Sidebar</p>
383
378
  </a>
384
379
  </li>
380
+ <li class="nav-item">
381
+ <a href="../../layout/fixed-header.html" class="nav-link">
382
+ <i class="nav-icon bi bi-circle"></i>
383
+ <p>Fixed Header</p>
384
+ </a>
385
+ </li>
386
+ <li class="nav-item">
387
+ <a href="../../layout/fixed-footer.html" class="nav-link">
388
+ <i class="nav-icon bi bi-circle"></i>
389
+ <p>Fixed Footer</p>
390
+ </a>
391
+ </li>
392
+ <li class="nav-item">
393
+ <a href="../../layout/fixed-complete.html" class="nav-link">
394
+ <i class="nav-icon bi bi-circle"></i>
395
+ <p>Fixed Complete</p>
396
+ </a>
397
+ </li>
385
398
  <li class="nav-item">
386
399
  <a href="../../layout/layout-custom-area.html" class="nav-link">
387
400
  <i class="nav-icon bi bi-circle"></i>
@@ -800,7 +813,7 @@
800
813
  <div class="d-flex">
801
814
  <div class="flex-shrink-0">
802
815
  <img
803
- src="../../../../dist/assets/img/user1-128x128.jpg"
816
+ src="/assets/img/user1-128x128.jpg"
804
817
  alt="User Avatar"
805
818
  class="img-size-50 rounded-circle me-3"
806
819
  />
@@ -826,7 +839,7 @@
826
839
  <div class="d-flex">
827
840
  <div class="flex-shrink-0">
828
841
  <img
829
- src="../../../../dist/assets/img/user8-128x128.jpg"
842
+ src="/assets/img/user8-128x128.jpg"
830
843
  alt="User Avatar"
831
844
  class="img-size-50 rounded-circle me-3"
832
845
  />
@@ -852,7 +865,7 @@
852
865
  <div class="d-flex">
853
866
  <div class="flex-shrink-0">
854
867
  <img
855
- src="../../../../dist/assets/img/user3-128x128.jpg"
868
+ src="/assets/img/user3-128x128.jpg"
856
869
  alt="User Avatar"
857
870
  class="img-size-50 rounded-circle me-3"
858
871
  />
@@ -906,7 +919,7 @@
906
919
  <li class="nav-item dropdown user-menu">
907
920
  <a href="#" class="nav-link dropdown-toggle" data-bs-toggle="dropdown">
908
921
  <img
909
- src="../../../../dist/assets/img/user2-160x160.jpg"
922
+ src="/assets/img/user2-160x160.jpg"
910
923
  class="user-image rounded-circle shadow"
911
924
  alt="User Image"
912
925
  />
@@ -916,7 +929,7 @@
916
929
  <!-- User image -->
917
930
  <li class="user-header text-bg-primary">
918
931
  <img
919
- src="../../../../dist/assets/img/user2-160x160.jpg"
932
+ src="/assets/img/user2-160x160.jpg"
920
933
  class="rounded-circle shadow"
921
934
  alt="User Image"
922
935
  />
@@ -1147,8 +1160,7 @@
1147
1160
  <span class="line"><span style="color:#808080"> &lt;/</span><span style="color:#569CD6">div</span><span style="color:#808080">&gt;</span></span>
1148
1161
  <span class="line"><span style="color:#6A9955"> &lt;!--end::Container--&gt;</span></span>
1149
1162
  <span class="line"><span style="color:#808080">&lt;/</span><span style="color:#569CD6">nav</span><span style="color:#808080">&gt;</span></span>
1150
- <span class="line"><span style="color:#6A9955">&lt;!-- /.navbar --&gt;</span></span>
1151
- <span class="line"></span></code></pre>
1163
+ <span class="line"><span style="color:#6A9955">&lt;!-- /.navbar --&gt;</span></span></code></pre>
1152
1164
  </div>
1153
1165
  <!--end::Container-->
1154
1166
  </div>
@@ -1162,7 +1174,7 @@
1162
1174
  <!--end::To the end-->
1163
1175
  <!--begin::Copyright-->
1164
1176
  <strong>
1165
- Copyright &copy; 2014-2024&nbsp;
1177
+ Copyright &copy; 2014-2025&nbsp;
1166
1178
  <a href="https://adminlte.io" class="text-decoration-none">AdminLTE.io</a>.
1167
1179
  </strong>
1168
1180
  All rights reserved.
@@ -1174,24 +1186,21 @@
1174
1186
  <!--begin::Script-->
1175
1187
  <!--begin::Third Party Plugin(OverlayScrollbars)-->
1176
1188
  <script
1177
- src="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/browser/overlayscrollbars.browser.es6.min.js"
1178
- integrity="sha256-dghWARbRe2eLlIJ56wNB+b760ywulqK3DzZYEpsg2fQ="
1189
+ src="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.11.0/browser/overlayscrollbars.browser.es6.min.js"
1179
1190
  crossorigin="anonymous"
1180
1191
  ></script>
1181
1192
  <!--end::Third Party Plugin(OverlayScrollbars)--><!--begin::Required Plugin(popperjs for Bootstrap 5)-->
1182
1193
  <script
1183
1194
  src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js"
1184
- integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r"
1185
1195
  crossorigin="anonymous"
1186
1196
  ></script>
1187
1197
  <!--end::Required Plugin(popperjs for Bootstrap 5)--><!--begin::Required Plugin(Bootstrap 5)-->
1188
1198
  <script
1189
- src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js"
1190
- integrity="sha384-0pUGZvbkm6XF6gxjEnlmuGrJXVbNuzT9qBBavbLwCsOGabYfZo0T0to5eqruptLy"
1199
+ src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.7/dist/js/bootstrap.min.js"
1191
1200
  crossorigin="anonymous"
1192
1201
  ></script>
1193
1202
  <!--end::Required Plugin(Bootstrap 5)--><!--begin::Required Plugin(AdminLTE)-->
1194
- <script src="../../../../dist/js/adminlte.js"></script>
1203
+ <script src="../../js/adminlte.js"></script>
1195
1204
  <!--end::Required Plugin(AdminLTE)--><!--begin::OverlayScrollbars Configure-->
1196
1205
  <script>
1197
1206
  const SELECTOR_SIDEBAR_WRAPPER = '.sidebar-wrapper';
@@ -1202,7 +1211,7 @@
1202
1211
  };
1203
1212
  document.addEventListener('DOMContentLoaded', function () {
1204
1213
  const sidebarWrapper = document.querySelector(SELECTOR_SIDEBAR_WRAPPER);
1205
- if (sidebarWrapper && typeof OverlayScrollbarsGlobal?.OverlayScrollbars !== 'undefined') {
1214
+ if (sidebarWrapper && OverlayScrollbarsGlobal?.OverlayScrollbars !== undefined) {
1206
1215
  OverlayScrollbarsGlobal.OverlayScrollbars(sidebarWrapper, {
1207
1216
  scrollbars: {
1208
1217
  theme: Default.scrollbarTheme,
@@ -1213,7 +1222,31 @@
1213
1222
  }
1214
1223
  });
1215
1224
  </script>
1216
- <!--end::OverlayScrollbars Configure-->
1225
+ <!--end::OverlayScrollbars Configure--><!-- Image path runtime fix -->
1226
+ <script>
1227
+ document.addEventListener('DOMContentLoaded', () => {
1228
+ // Find the link tag for the main AdminLTE CSS file.
1229
+ const cssLink = document.querySelector('link[href*="css/adminlte.css"]');
1230
+ if (!cssLink) {
1231
+ return; // Exit if the link isn't found
1232
+ }
1233
+
1234
+ // Extract the base path from the CSS href.
1235
+ // e.g., from "../css/adminlte.css", we get "../"
1236
+ // e.g., from "./css/adminlte.css", we get "./"
1237
+ const cssHref = cssLink.getAttribute('href');
1238
+ const deploymentPath = cssHref.slice(0, cssHref.indexOf('css/adminlte.css'));
1239
+
1240
+ // Find all images with absolute paths and fix them.
1241
+ document.querySelectorAll('img[src^="/assets/"]').forEach((img) => {
1242
+ const originalSrc = img.getAttribute('src');
1243
+ if (originalSrc) {
1244
+ const relativeSrc = originalSrc.slice(1); // Remove leading '/'
1245
+ img.src = deploymentPath + relativeSrc;
1246
+ }
1247
+ });
1248
+ });
1249
+ </script>
1217
1250
  <!--end::Script-->
1218
1251
  </body>
1219
1252
  <!--end::Body-->
package/dist/{pages/docs → docs}/components/main-sidebar.html RENAMED
@@ -4,67 +4,60 @@
4
4
  <head>
5
5
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
6
6
  <title>Main Sidebar Component | AdminLTE 4</title>
7
+ <!--begin::Accessibility Meta Tags-->
8
+ <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
9
+ <meta name="color-scheme" content="light dark" />
10
+ <meta name="theme-color" content="#007bff" media="(prefers-color-scheme: light)" />
11
+ <meta name="theme-color" content="#1a1a1a" media="(prefers-color-scheme: dark)" />
12
+ <!--end::Accessibility Meta Tags-->
7
13
  <!--begin::Primary Meta Tags-->
8
- <meta name="viewport" content="width=device-width, initial-scale=1.0" />
9
14
  <meta name="title" content="Main Sidebar Component | AdminLTE 4" />
10
15
  <meta name="author" content="ColorlibHQ" />
11
16
  <meta
12
17
  name="description"
13
- content="AdminLTE is a Free Bootstrap 5 Admin Dashboard, 30 example pages using Vanilla JS."
18
+ content="AdminLTE is a Free Bootstrap 5 Admin Dashboard, 30 example pages using Vanilla JS. Fully accessible with WCAG 2.1 AA compliance."
14
19
  />
15
20
  <meta
16
21
  name="keywords"
17
- content="bootstrap 5, bootstrap, bootstrap 5 admin dashboard, bootstrap 5 dashboard, bootstrap 5 charts, bootstrap 5 calendar, bootstrap 5 datepicker, bootstrap 5 tables, bootstrap 5 datatable, vanilla js datatable, colorlibhq, colorlibhq dashboard, colorlibhq admin dashboard"
22
+ content="bootstrap 5, bootstrap, bootstrap 5 admin dashboard, bootstrap 5 dashboard, bootstrap 5 charts, bootstrap 5 calendar, bootstrap 5 datepicker, bootstrap 5 tables, bootstrap 5 datatable, vanilla js datatable, colorlibhq, colorlibhq dashboard, colorlibhq admin dashboard, accessible admin panel, WCAG compliant"
18
23
  />
19
24
  <!--end::Primary Meta Tags-->
25
+ <!--begin::Accessibility Features-->
26
+ <!-- Skip links will be dynamically added by accessibility.js -->
27
+ <meta name="supported-color-schemes" content="light dark" />
28
+ <link rel="preload" href="../../css/adminlte.css" as="style" />
29
+ <!--end::Accessibility Features-->
20
30
  <!--begin::Fonts-->
21
31
  <link
22
32
  rel="stylesheet"
23
33
  href="https://cdn.jsdelivr.net/npm/@fontsource/source-sans-3@5.0.12/index.css"
24
34
  integrity="sha256-tXJfXfp6Ewt1ilPzLDtQnJV4hclT9XuaZUKyUvmyr+Q="
25
35
  crossorigin="anonymous"
36
+ media="print"
37
+ onload="this.media='all'"
26
38
  />
27
39
  <!--end::Fonts-->
28
40
  <!--begin::Third Party Plugin(OverlayScrollbars)-->
29
41
  <link
30
42
  rel="stylesheet"
31
- href="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/styles/overlayscrollbars.min.css"
32
- integrity="sha256-tZHrRjVqNSRyWg2wbppGnT833E/Ys0DHWGwT04GiqQg="
43
+ href="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.11.0/styles/overlayscrollbars.min.css"
33
44
  crossorigin="anonymous"
34
45
  />
35
46
  <!--end::Third Party Plugin(OverlayScrollbars)-->
36
47
  <!--begin::Third Party Plugin(Bootstrap Icons)-->
37
48
  <link
38
49
  rel="stylesheet"
39
- href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"
40
- integrity="sha256-9kPW/n5nn53j4WMRYAxe9c1rCY96Oogo/MKSVdKzPmI="
50
+ href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css"
41
51
  crossorigin="anonymous"
42
52
  />
43
53
  <!--end::Third Party Plugin(Bootstrap Icons)-->
44
54
  <!--begin::Required Plugin(AdminLTE)-->
45
- <link rel="stylesheet" href="../../../../dist/css/adminlte.css" />
55
+ <link rel="stylesheet" href="../../css/adminlte.css" />
46
56
  <!--end::Required Plugin(AdminLTE)-->
47
- <style>
48
- [data-astro-image] {
49
- width: 100%;
50
- height: auto;
51
- object-fit: var(--fit);
52
- object-position: var(--pos);
53
- aspect-ratio: var(--w) / var(--h);
54
- }
55
- [data-astro-image='responsive'] {
56
- max-width: calc(var(--w) * 1px);
57
- max-height: calc(var(--h) * 1px);
58
- }
59
- [data-astro-image='fixed'] {
60
- width: calc(var(--w) * 1px);
61
- height: calc(var(--h) * 1px);
62
- }
63
- </style>
64
57
  </head>
65
58
  <!--end::Head-->
66
59
  <!--begin::Body-->
67
- <body class="layout-fixed sidebar-expand-lg bg-body-tertiary">
60
+ <body class="layout-fixed sidebar-expand-lg sidebar-open bg-body-tertiary">
68
61
  <!--begin::App Wrapper-->
69
62
  <div class="app-wrapper">
70
63
  <!--begin::Header-->
@@ -103,7 +96,7 @@
103
96
  <div class="d-flex">
104
97
  <div class="flex-shrink-0">
105
98
  <img
106
- src="../../../../dist/assets/img/user1-128x128.jpg"
99
+ src="/assets/img/user1-128x128.jpg"
107
100
  alt="User Avatar"
108
101
  class="img-size-50 rounded-circle me-3"
109
102
  />
@@ -129,7 +122,7 @@
129
122
  <div class="d-flex">
130
123
  <div class="flex-shrink-0">
131
124
  <img
132
- src="../../../../dist/assets/img/user8-128x128.jpg"
125
+ src="/assets/img/user8-128x128.jpg"
133
126
  alt="User Avatar"
134
127
  class="img-size-50 rounded-circle me-3"
135
128
  />
@@ -155,7 +148,7 @@
155
148
  <div class="d-flex">
156
149
  <div class="flex-shrink-0">
157
150
  <img
158
- src="../../../../dist/assets/img/user3-128x128.jpg"
151
+ src="/assets/img/user3-128x128.jpg"
159
152
  alt="User Avatar"
160
153
  class="img-size-50 rounded-circle me-3"
161
154
  />
@@ -220,7 +213,7 @@
220
213
  <li class="nav-item dropdown user-menu">
221
214
  <a href="#" class="nav-link dropdown-toggle" data-bs-toggle="dropdown">
222
215
  <img
223
- src="../../../../dist/assets/img/user2-160x160.jpg"
216
+ src="/assets/img/user2-160x160.jpg"
224
217
  class="user-image rounded-circle shadow"
225
218
  alt="User Image"
226
219
  />
@@ -230,7 +223,7 @@
230
223
  <!--begin::User Image-->
231
224
  <li class="user-header text-bg-primary">
232
225
  <img
233
- src="../../../../dist/assets/img/user2-160x160.jpg"
226
+ src="/assets/img/user2-160x160.jpg"
234
227
  class="rounded-circle shadow"
235
228
  alt="User Image"
236
229
  />
@@ -274,7 +267,7 @@
274
267
  <a href="../../index.html" class="brand-link">
275
268
  <!--begin::Brand Image-->
276
269
  <img
277
- src="../../../../dist/assets/img/AdminLTELogo.png"
270
+ src="/assets/img/AdminLTELogo.png"
278
271
  alt="AdminLTE Logo"
279
272
  class="brand-image opacity-75 shadow"
280
273
  />
@@ -293,8 +286,10 @@
293
286
  <ul
294
287
  class="nav sidebar-menu flex-column"
295
288
  data-lte-toggle="treeview"
296
- role="menu"
289
+ role="navigation"
290
+ aria-label="Main navigation"
297
291
  data-accordion="false"
292
+ id="navigation"
298
293
  >
299
294
  <li class="nav-item">
300
295
  <a href="#" class="nav-link">
@@ -382,6 +377,24 @@
382
377
  <p>Fixed Sidebar</p>
383
378
  </a>
384
379
  </li>
380
+ <li class="nav-item">
381
+ <a href="../../layout/fixed-header.html" class="nav-link">
382
+ <i class="nav-icon bi bi-circle"></i>
383
+ <p>Fixed Header</p>
384
+ </a>
385
+ </li>
386
+ <li class="nav-item">
387
+ <a href="../../layout/fixed-footer.html" class="nav-link">
388
+ <i class="nav-icon bi bi-circle"></i>
389
+ <p>Fixed Footer</p>
390
+ </a>
391
+ </li>
392
+ <li class="nav-item">
393
+ <a href="../../layout/fixed-complete.html" class="nav-link">
394
+ <i class="nav-icon bi bi-circle"></i>
395
+ <p>Fixed Complete</p>
396
+ </a>
397
+ </li>
385
398
  <li class="nav-item">
386
399
  <a href="../../layout/layout-custom-area.html" class="nav-link">
387
400
  <i class="nav-icon bi bi-circle"></i>
@@ -852,8 +865,7 @@
852
865
  <span class="line"><span style="color:#808080"> &lt;/</span><span style="color:#569CD6">div</span><span style="color:#808080">&gt;</span></span>
853
866
  <span class="line"><span style="color:#6A9955"> &lt;!--end::Sidebar Wrapper--&gt;</span></span>
854
867
  <span class="line"><span style="color:#808080">&lt;/</span><span style="color:#569CD6">aside</span><span style="color:#808080">&gt;</span></span>
855
- <span class="line"><span style="color:#6A9955">&lt;!--end::Sidebar--&gt;</span></span>
856
- <span class="line"></span></code></pre>
868
+ <span class="line"><span style="color:#6A9955">&lt;!--end::Sidebar--&gt;</span></span></code></pre>
857
869
  <h2 id="alternate-logo">Alternate Logo</h2>
858
870
  <p>
859
871
  You can use two logo images instead of logo with text, you only need to change the
@@ -877,8 +889,7 @@
877
889
  <span class="line"><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">&quot;brand-image-xs logo-xl opacity-75&quot;</span></span>
878
890
  <span class="line"><span style="color:#808080"> /&gt;</span></span>
879
891
  <span class="line"><span style="color:#808080"> &lt;/</span><span style="color:#569CD6">a</span><span style="color:#808080">&gt;</span></span>
880
- <span class="line"><span style="color:#808080">&lt;/</span><span style="color:#569CD6">div</span><span style="color:#808080">&gt;</span></span>
881
- <span class="line"></span></code></pre>
892
+ <span class="line"><span style="color:#808080">&lt;/</span><span style="color:#569CD6">div</span><span style="color:#808080">&gt;</span></span></code></pre>
882
893
  </div>
883
894
  <!--end::Container-->
884
895
  </div>
@@ -892,7 +903,7 @@
892
903
  <!--end::To the end-->
893
904
  <!--begin::Copyright-->
894
905
  <strong>
895
- Copyright &copy; 2014-2024&nbsp;
906
+ Copyright &copy; 2014-2025&nbsp;
896
907
  <a href="https://adminlte.io" class="text-decoration-none">AdminLTE.io</a>.
897
908
  </strong>
898
909
  All rights reserved.
@@ -904,24 +915,21 @@
904
915
  <!--begin::Script-->
905
916
  <!--begin::Third Party Plugin(OverlayScrollbars)-->
906
917
  <script
907
- src="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/browser/overlayscrollbars.browser.es6.min.js"
908
- integrity="sha256-dghWARbRe2eLlIJ56wNB+b760ywulqK3DzZYEpsg2fQ="
918
+ src="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.11.0/browser/overlayscrollbars.browser.es6.min.js"
909
919
  crossorigin="anonymous"
910
920
  ></script>
911
921
  <!--end::Third Party Plugin(OverlayScrollbars)--><!--begin::Required Plugin(popperjs for Bootstrap 5)-->
912
922
  <script
913
923
  src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js"
914
- integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r"
915
924
  crossorigin="anonymous"
916
925
  ></script>
917
926
  <!--end::Required Plugin(popperjs for Bootstrap 5)--><!--begin::Required Plugin(Bootstrap 5)-->
918
927
  <script
919
- src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js"
920
- integrity="sha384-0pUGZvbkm6XF6gxjEnlmuGrJXVbNuzT9qBBavbLwCsOGabYfZo0T0to5eqruptLy"
928
+ src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.7/dist/js/bootstrap.min.js"
921
929
  crossorigin="anonymous"
922
930
  ></script>
923
931
  <!--end::Required Plugin(Bootstrap 5)--><!--begin::Required Plugin(AdminLTE)-->
924
- <script src="../../../../dist/js/adminlte.js"></script>
932
+ <script src="../../js/adminlte.js"></script>
925
933
  <!--end::Required Plugin(AdminLTE)--><!--begin::OverlayScrollbars Configure-->
926
934
  <script>
927
935
  const SELECTOR_SIDEBAR_WRAPPER = '.sidebar-wrapper';
@@ -932,7 +940,7 @@
932
940
  };
933
941
  document.addEventListener('DOMContentLoaded', function () {
934
942
  const sidebarWrapper = document.querySelector(SELECTOR_SIDEBAR_WRAPPER);
935
- if (sidebarWrapper && typeof OverlayScrollbarsGlobal?.OverlayScrollbars !== 'undefined') {
943
+ if (sidebarWrapper && OverlayScrollbarsGlobal?.OverlayScrollbars !== undefined) {
936
944
  OverlayScrollbarsGlobal.OverlayScrollbars(sidebarWrapper, {
937
945
  scrollbars: {
938
946
  theme: Default.scrollbarTheme,
@@ -943,7 +951,31 @@
943
951
  }
944
952
  });
945
953
  </script>
946
- <!--end::OverlayScrollbars Configure-->
954
+ <!--end::OverlayScrollbars Configure--><!-- Image path runtime fix -->
955
+ <script>
956
+ document.addEventListener('DOMContentLoaded', () => {
957
+ // Find the link tag for the main AdminLTE CSS file.
958
+ const cssLink = document.querySelector('link[href*="css/adminlte.css"]');
959
+ if (!cssLink) {
960
+ return; // Exit if the link isn't found
961
+ }
962
+
963
+ // Extract the base path from the CSS href.
964
+ // e.g., from "../css/adminlte.css", we get "../"
965
+ // e.g., from "./css/adminlte.css", we get "./"
966
+ const cssHref = cssLink.getAttribute('href');
967
+ const deploymentPath = cssHref.slice(0, cssHref.indexOf('css/adminlte.css'));
968
+
969
+ // Find all images with absolute paths and fix them.
970
+ document.querySelectorAll('img[src^="/assets/"]').forEach((img) => {
971
+ const originalSrc = img.getAttribute('src');
972
+ if (originalSrc) {
973
+ const relativeSrc = originalSrc.slice(1); // Remove leading '/'
974
+ img.src = deploymentPath + relativeSrc;
975
+ }
976
+ });
977
+ });
978
+ </script>
947
979
  <!--end::Script-->
948
980
  </body>
949
981
  <!--end::Body-->