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
@@ -4,50 +4,60 @@
4
4
  <head>
5
5
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
6
6
  <title>AdminLTE 4 | General UI Elements</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="AdminLTE 4 | General UI Elements" />
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
57
  </head>
48
58
  <!--end::Head-->
49
59
  <!--begin::Body-->
50
- <body class="layout-fixed sidebar-expand-lg bg-body-tertiary">
60
+ <body class="layout-fixed sidebar-expand-lg sidebar-open bg-body-tertiary">
51
61
  <!--begin::App Wrapper-->
52
62
  <div class="app-wrapper">
53
63
  <!--begin::Header-->
@@ -86,7 +96,7 @@
86
96
  <div class="d-flex">
87
97
  <div class="flex-shrink-0">
88
98
  <img
89
- src="../../../dist/assets/img/user1-128x128.jpg"
99
+ src="/assets/img/user1-128x128.jpg"
90
100
  alt="User Avatar"
91
101
  class="img-size-50 rounded-circle me-3"
92
102
  />
@@ -112,7 +122,7 @@
112
122
  <div class="d-flex">
113
123
  <div class="flex-shrink-0">
114
124
  <img
115
- src="../../../dist/assets/img/user8-128x128.jpg"
125
+ src="/assets/img/user8-128x128.jpg"
116
126
  alt="User Avatar"
117
127
  class="img-size-50 rounded-circle me-3"
118
128
  />
@@ -138,7 +148,7 @@
138
148
  <div class="d-flex">
139
149
  <div class="flex-shrink-0">
140
150
  <img
141
- src="../../../dist/assets/img/user3-128x128.jpg"
151
+ src="/assets/img/user3-128x128.jpg"
142
152
  alt="User Avatar"
143
153
  class="img-size-50 rounded-circle me-3"
144
154
  />
@@ -203,7 +213,7 @@
203
213
  <li class="nav-item dropdown user-menu">
204
214
  <a href="#" class="nav-link dropdown-toggle" data-bs-toggle="dropdown">
205
215
  <img
206
- src="../../../dist/assets/img/user2-160x160.jpg"
216
+ src="/assets/img/user2-160x160.jpg"
207
217
  class="user-image rounded-circle shadow"
208
218
  alt="User Image"
209
219
  />
@@ -213,7 +223,7 @@
213
223
  <!--begin::User Image-->
214
224
  <li class="user-header text-bg-primary">
215
225
  <img
216
- src="../../../dist/assets/img/user2-160x160.jpg"
226
+ src="/assets/img/user2-160x160.jpg"
217
227
  class="rounded-circle shadow"
218
228
  alt="User Image"
219
229
  />
@@ -257,7 +267,7 @@
257
267
  <a href="../index.html" class="brand-link">
258
268
  <!--begin::Brand Image-->
259
269
  <img
260
- src="../../../dist/assets/img/AdminLTELogo.png"
270
+ src="/assets/img/AdminLTELogo.png"
261
271
  alt="AdminLTE Logo"
262
272
  class="brand-image opacity-75 shadow"
263
273
  />
@@ -276,8 +286,10 @@
276
286
  <ul
277
287
  class="nav sidebar-menu flex-column"
278
288
  data-lte-toggle="treeview"
279
- role="menu"
289
+ role="navigation"
290
+ aria-label="Main navigation"
280
291
  data-accordion="false"
292
+ id="navigation"
281
293
  >
282
294
  <li class="nav-item">
283
295
  <a href="#" class="nav-link">
@@ -365,6 +377,24 @@
365
377
  <p>Fixed Sidebar</p>
366
378
  </a>
367
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>
368
398
  <li class="nav-item">
369
399
  <a href="../layout/layout-custom-area.html" class="nav-link">
370
400
  <i class="nav-icon bi bi-circle"></i>
@@ -1819,7 +1849,7 @@
1819
1849
  <!--end::To the end-->
1820
1850
  <!--begin::Copyright-->
1821
1851
  <strong>
1822
- Copyright &copy; 2014-2024&nbsp;
1852
+ Copyright &copy; 2014-2025&nbsp;
1823
1853
  <a href="https://adminlte.io" class="text-decoration-none">AdminLTE.io</a>.
1824
1854
  </strong>
1825
1855
  All rights reserved.
@@ -1831,24 +1861,21 @@
1831
1861
  <!--begin::Script-->
1832
1862
  <!--begin::Third Party Plugin(OverlayScrollbars)-->
1833
1863
  <script
1834
- src="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/browser/overlayscrollbars.browser.es6.min.js"
1835
- integrity="sha256-dghWARbRe2eLlIJ56wNB+b760ywulqK3DzZYEpsg2fQ="
1864
+ src="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.11.0/browser/overlayscrollbars.browser.es6.min.js"
1836
1865
  crossorigin="anonymous"
1837
1866
  ></script>
1838
1867
  <!--end::Third Party Plugin(OverlayScrollbars)--><!--begin::Required Plugin(popperjs for Bootstrap 5)-->
1839
1868
  <script
1840
1869
  src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js"
1841
- integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r"
1842
1870
  crossorigin="anonymous"
1843
1871
  ></script>
1844
1872
  <!--end::Required Plugin(popperjs for Bootstrap 5)--><!--begin::Required Plugin(Bootstrap 5)-->
1845
1873
  <script
1846
- src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js"
1847
- integrity="sha384-0pUGZvbkm6XF6gxjEnlmuGrJXVbNuzT9qBBavbLwCsOGabYfZo0T0to5eqruptLy"
1874
+ src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.7/dist/js/bootstrap.min.js"
1848
1875
  crossorigin="anonymous"
1849
1876
  ></script>
1850
1877
  <!--end::Required Plugin(Bootstrap 5)--><!--begin::Required Plugin(AdminLTE)-->
1851
- <script src="../../../dist/js/adminlte.js"></script>
1878
+ <script src="../js/adminlte.js"></script>
1852
1879
  <!--end::Required Plugin(AdminLTE)--><!--begin::OverlayScrollbars Configure-->
1853
1880
  <script>
1854
1881
  const SELECTOR_SIDEBAR_WRAPPER = '.sidebar-wrapper';
@@ -1859,7 +1886,7 @@
1859
1886
  };
1860
1887
  document.addEventListener('DOMContentLoaded', function () {
1861
1888
  const sidebarWrapper = document.querySelector(SELECTOR_SIDEBAR_WRAPPER);
1862
- if (sidebarWrapper && typeof OverlayScrollbarsGlobal?.OverlayScrollbars !== 'undefined') {
1889
+ if (sidebarWrapper && OverlayScrollbarsGlobal?.OverlayScrollbars !== undefined) {
1863
1890
  OverlayScrollbarsGlobal.OverlayScrollbars(sidebarWrapper, {
1864
1891
  scrollbars: {
1865
1892
  theme: Default.scrollbarTheme,
@@ -1870,13 +1897,37 @@
1870
1897
  }
1871
1898
  });
1872
1899
  </script>
1873
- <!--end::OverlayScrollbars Configure-->
1900
+ <!--end::OverlayScrollbars Configure--><!-- Image path runtime fix -->
1901
+ <script>
1902
+ document.addEventListener('DOMContentLoaded', () => {
1903
+ // Find the link tag for the main AdminLTE CSS file.
1904
+ const cssLink = document.querySelector('link[href*="css/adminlte.css"]');
1905
+ if (!cssLink) {
1906
+ return; // Exit if the link isn't found
1907
+ }
1908
+
1909
+ // Extract the base path from the CSS href.
1910
+ // e.g., from "../css/adminlte.css", we get "../"
1911
+ // e.g., from "./css/adminlte.css", we get "./"
1912
+ const cssHref = cssLink.getAttribute('href');
1913
+ const deploymentPath = cssHref.slice(0, cssHref.indexOf('css/adminlte.css'));
1914
+
1915
+ // Find all images with absolute paths and fix them.
1916
+ document.querySelectorAll('img[src^="/assets/"]').forEach((img) => {
1917
+ const originalSrc = img.getAttribute('src');
1918
+ if (originalSrc) {
1919
+ const relativeSrc = originalSrc.slice(1); // Remove leading '/'
1920
+ img.src = deploymentPath + relativeSrc;
1921
+ }
1922
+ });
1923
+ });
1924
+ </script>
1874
1925
  <!--begin::Bootstrap Tooltips-->
1875
1926
  <script>
1876
1927
  const tooltipTriggerList = document.querySelectorAll('[data-bs-toggle="tooltip"]');
1877
- const tooltipList = [...tooltipTriggerList].map(
1878
- (tooltipTriggerEl) => new bootstrap.Tooltip(tooltipTriggerEl),
1879
- );
1928
+ tooltipTriggerList.forEach((tooltipTriggerEl) => {
1929
+ new bootstrap.Tooltip(tooltipTriggerEl);
1930
+ });
1880
1931
  </script>
1881
1932
  <!--end::Bootstrap Tooltips-->
1882
1933
  <!--begin::Bootstrap Toasts-->
@@ -4,50 +4,60 @@
4
4
  <head>
5
5
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
6
6
  <title>AdminLTE 4 | Icons</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="AdminLTE 4 | Icons" />
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
57
  </head>
48
58
  <!--end::Head-->
49
59
  <!--begin::Body-->
50
- <body class="layout-fixed sidebar-expand-lg bg-body-tertiary">
60
+ <body class="layout-fixed sidebar-expand-lg sidebar-open bg-body-tertiary">
51
61
  <!--begin::App Wrapper-->
52
62
  <div class="app-wrapper">
53
63
  <!--begin::Header-->
@@ -86,7 +96,7 @@
86
96
  <div class="d-flex">
87
97
  <div class="flex-shrink-0">
88
98
  <img
89
- src="../../../dist/assets/img/user1-128x128.jpg"
99
+ src="/assets/img/user1-128x128.jpg"
90
100
  alt="User Avatar"
91
101
  class="img-size-50 rounded-circle me-3"
92
102
  />
@@ -112,7 +122,7 @@
112
122
  <div class="d-flex">
113
123
  <div class="flex-shrink-0">
114
124
  <img
115
- src="../../../dist/assets/img/user8-128x128.jpg"
125
+ src="/assets/img/user8-128x128.jpg"
116
126
  alt="User Avatar"
117
127
  class="img-size-50 rounded-circle me-3"
118
128
  />
@@ -138,7 +148,7 @@
138
148
  <div class="d-flex">
139
149
  <div class="flex-shrink-0">
140
150
  <img
141
- src="../../../dist/assets/img/user3-128x128.jpg"
151
+ src="/assets/img/user3-128x128.jpg"
142
152
  alt="User Avatar"
143
153
  class="img-size-50 rounded-circle me-3"
144
154
  />
@@ -203,7 +213,7 @@
203
213
  <li class="nav-item dropdown user-menu">
204
214
  <a href="#" class="nav-link dropdown-toggle" data-bs-toggle="dropdown">
205
215
  <img
206
- src="../../../dist/assets/img/user2-160x160.jpg"
216
+ src="/assets/img/user2-160x160.jpg"
207
217
  class="user-image rounded-circle shadow"
208
218
  alt="User Image"
209
219
  />
@@ -213,7 +223,7 @@
213
223
  <!--begin::User Image-->
214
224
  <li class="user-header text-bg-primary">
215
225
  <img
216
- src="../../../dist/assets/img/user2-160x160.jpg"
226
+ src="/assets/img/user2-160x160.jpg"
217
227
  class="rounded-circle shadow"
218
228
  alt="User Image"
219
229
  />
@@ -257,7 +267,7 @@
257
267
  <a href="../index.html" class="brand-link">
258
268
  <!--begin::Brand Image-->
259
269
  <img
260
- src="../../../dist/assets/img/AdminLTELogo.png"
270
+ src="/assets/img/AdminLTELogo.png"
261
271
  alt="AdminLTE Logo"
262
272
  class="brand-image opacity-75 shadow"
263
273
  />
@@ -276,8 +286,10 @@
276
286
  <ul
277
287
  class="nav sidebar-menu flex-column"
278
288
  data-lte-toggle="treeview"
279
- role="menu"
289
+ role="navigation"
290
+ aria-label="Main navigation"
280
291
  data-accordion="false"
292
+ id="navigation"
281
293
  >
282
294
  <li class="nav-item">
283
295
  <a href="#" class="nav-link">
@@ -365,6 +377,24 @@
365
377
  <p>Fixed Sidebar</p>
366
378
  </a>
367
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>
368
398
  <li class="nav-item">
369
399
  <a href="../layout/layout-custom-area.html" class="nav-link">
370
400
  <i class="nav-icon bi bi-circle"></i>
@@ -760,7 +790,7 @@
760
790
  <!--end::To the end-->
761
791
  <!--begin::Copyright-->
762
792
  <strong>
763
- Copyright &copy; 2014-2024&nbsp;
793
+ Copyright &copy; 2014-2025&nbsp;
764
794
  <a href="https://adminlte.io" class="text-decoration-none">AdminLTE.io</a>.
765
795
  </strong>
766
796
  All rights reserved.
@@ -772,24 +802,21 @@
772
802
  <!--begin::Script-->
773
803
  <!--begin::Third Party Plugin(OverlayScrollbars)-->
774
804
  <script
775
- src="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/browser/overlayscrollbars.browser.es6.min.js"
776
- integrity="sha256-dghWARbRe2eLlIJ56wNB+b760ywulqK3DzZYEpsg2fQ="
805
+ src="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.11.0/browser/overlayscrollbars.browser.es6.min.js"
777
806
  crossorigin="anonymous"
778
807
  ></script>
779
808
  <!--end::Third Party Plugin(OverlayScrollbars)--><!--begin::Required Plugin(popperjs for Bootstrap 5)-->
780
809
  <script
781
810
  src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js"
782
- integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r"
783
811
  crossorigin="anonymous"
784
812
  ></script>
785
813
  <!--end::Required Plugin(popperjs for Bootstrap 5)--><!--begin::Required Plugin(Bootstrap 5)-->
786
814
  <script
787
- src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js"
788
- integrity="sha384-0pUGZvbkm6XF6gxjEnlmuGrJXVbNuzT9qBBavbLwCsOGabYfZo0T0to5eqruptLy"
815
+ src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.7/dist/js/bootstrap.min.js"
789
816
  crossorigin="anonymous"
790
817
  ></script>
791
818
  <!--end::Required Plugin(Bootstrap 5)--><!--begin::Required Plugin(AdminLTE)-->
792
- <script src="../../../dist/js/adminlte.js"></script>
819
+ <script src="../js/adminlte.js"></script>
793
820
  <!--end::Required Plugin(AdminLTE)--><!--begin::OverlayScrollbars Configure-->
794
821
  <script>
795
822
  const SELECTOR_SIDEBAR_WRAPPER = '.sidebar-wrapper';
@@ -800,7 +827,7 @@
800
827
  };
801
828
  document.addEventListener('DOMContentLoaded', function () {
802
829
  const sidebarWrapper = document.querySelector(SELECTOR_SIDEBAR_WRAPPER);
803
- if (sidebarWrapper && typeof OverlayScrollbarsGlobal?.OverlayScrollbars !== 'undefined') {
830
+ if (sidebarWrapper && OverlayScrollbarsGlobal?.OverlayScrollbars !== undefined) {
804
831
  OverlayScrollbarsGlobal.OverlayScrollbars(sidebarWrapper, {
805
832
  scrollbars: {
806
833
  theme: Default.scrollbarTheme,
@@ -811,7 +838,31 @@
811
838
  }
812
839
  });
813
840
  </script>
814
- <!--end::OverlayScrollbars Configure-->
841
+ <!--end::OverlayScrollbars Configure--><!-- Image path runtime fix -->
842
+ <script>
843
+ document.addEventListener('DOMContentLoaded', () => {
844
+ // Find the link tag for the main AdminLTE CSS file.
845
+ const cssLink = document.querySelector('link[href*="css/adminlte.css"]');
846
+ if (!cssLink) {
847
+ return; // Exit if the link isn't found
848
+ }
849
+
850
+ // Extract the base path from the CSS href.
851
+ // e.g., from "../css/adminlte.css", we get "../"
852
+ // e.g., from "./css/adminlte.css", we get "./"
853
+ const cssHref = cssLink.getAttribute('href');
854
+ const deploymentPath = cssHref.slice(0, cssHref.indexOf('css/adminlte.css'));
855
+
856
+ // Find all images with absolute paths and fix them.
857
+ document.querySelectorAll('img[src^="/assets/"]').forEach((img) => {
858
+ const originalSrc = img.getAttribute('src');
859
+ if (originalSrc) {
860
+ const relativeSrc = originalSrc.slice(1); // Remove leading '/'
861
+ img.src = deploymentPath + relativeSrc;
862
+ }
863
+ });
864
+ });
865
+ </script>
815
866
  <!--end::Script-->
816
867
  </body>
817
868
  <!--end::Body-->