admin-lte 4.0.0-rc4 → 4.0.0-rc7

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 (81) hide show
  1. package/.browserslistrc +1 -0
  2. package/.claude/settings.local.json +27 -18
  3. package/CHANGELOG.md +143 -0
  4. package/CLAUDE.md +61 -88
  5. package/README.md +77 -20
  6. package/SECURITY.md +99 -0
  7. package/dist/UI/general.html +263 -72
  8. package/dist/UI/icons.html +94 -14
  9. package/dist/UI/timeline.html +108 -20
  10. package/dist/css/adminlte.css +162 -127
  11. package/dist/css/adminlte.css.map +1 -1
  12. package/dist/css/adminlte.min.css +2 -2
  13. package/dist/css/adminlte.min.css.map +1 -1
  14. package/dist/css/adminlte.rtl.css +162 -127
  15. package/dist/css/adminlte.rtl.css.map +1 -1
  16. package/dist/css/adminlte.rtl.min.css +2 -2
  17. package/dist/css/adminlte.rtl.min.css.map +1 -1
  18. package/dist/docs/browser-support.html +91 -13
  19. package/dist/docs/color-mode.html +96 -14
  20. package/dist/docs/components/main-header.html +111 -19
  21. package/dist/docs/components/main-sidebar.html +91 -13
  22. package/dist/docs/faq.html +91 -13
  23. package/dist/docs/how-to-contribute.html +91 -13
  24. package/dist/docs/introduction.html +97 -19
  25. package/dist/docs/javascript/accessibility.html +1055 -0
  26. package/dist/docs/javascript/card-widget.html +999 -0
  27. package/dist/docs/javascript/direct-chat.html +969 -0
  28. package/dist/docs/javascript/fullscreen.html +949 -0
  29. package/dist/docs/javascript/layout.html +975 -0
  30. package/dist/docs/javascript/pushmenu.html +1028 -0
  31. package/dist/docs/javascript/treeview.html +91 -13
  32. package/dist/docs/layout.html +93 -13
  33. package/dist/docs/license.html +91 -13
  34. package/dist/examples/lockscreen.html +23 -3
  35. package/dist/examples/login-v2.html +30 -5
  36. package/dist/examples/login.html +30 -5
  37. package/dist/examples/register-v2.html +30 -5
  38. package/dist/examples/register.html +30 -5
  39. package/dist/forms/general.html +114 -19
  40. package/dist/generate/theme.html +59 -15
  41. package/dist/index.html +127 -16
  42. package/dist/index2.html +195 -33
  43. package/dist/index3.html +138 -25
  44. package/dist/js/adminlte.js +179 -272
  45. package/dist/js/adminlte.js.map +1 -1
  46. package/dist/js/adminlte.min.js +3 -3
  47. package/dist/js/adminlte.min.js.map +1 -1
  48. package/dist/layout/collapsed-sidebar-without-hover.html +943 -0
  49. package/dist/layout/collapsed-sidebar.html +91 -12
  50. package/dist/layout/fixed-complete.html +93 -15
  51. package/dist/layout/fixed-footer.html +92 -13
  52. package/dist/layout/fixed-header.html +92 -13
  53. package/dist/layout/fixed-sidebar.html +93 -13
  54. package/dist/layout/layout-custom-area.html +102 -15
  55. package/dist/layout/layout-rtl.html +92 -13
  56. package/dist/layout/logo-switch.html +44 -11
  57. package/dist/layout/sidebar-mini.html +91 -12
  58. package/dist/layout/unfixed-sidebar.html +92 -13
  59. package/dist/tables/simple.html +163 -36
  60. package/dist/widgets/cards.html +106 -13
  61. package/dist/widgets/info-box.html +178 -30
  62. package/dist/widgets/small-box.html +95 -13
  63. package/index.html +1 -1
  64. package/package.json +28 -28
  65. package/release.md +75 -0
  66. package/src/scss/_accessibility.scss +44 -6
  67. package/src/scss/_app-footer.scss +9 -0
  68. package/src/scss/_app-sidebar.scss +55 -44
  69. package/src/scss/_bootstrap-variables.scss +1 -1
  70. package/src/scss/_cards.scss +6 -4
  71. package/src/scss/_dropdown.scss +5 -28
  72. package/src/scss/adminlte.scss +1 -1
  73. package/src/scss/pages/_login_and_register.scss +1 -1
  74. package/src/ts/accessibility.ts +22 -12
  75. package/src/ts/adminlte.ts +2 -14
  76. package/src/ts/card-widget.ts +4 -2
  77. package/src/ts/layout.ts +34 -16
  78. package/src/ts/push-menu.ts +238 -72
  79. package/src/ts/treeview.ts +19 -1
  80. package/src/ts/util/index.ts +10 -0
  81. package/README 2.md +0 -106
package/dist/layout/collapsed-sidebar.html CHANGED
@@ -4,12 +4,14 @@
4
4
  <head>
5
5
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
6
6
  <title>AdminLTE 4 | Sidebar Mini</title>
7
+
7
8
  <!--begin::Accessibility Meta Tags-->
8
9
  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
9
10
  <meta name="color-scheme" content="light dark" />
10
11
  <meta name="theme-color" content="#007bff" media="(prefers-color-scheme: light)" />
11
12
  <meta name="theme-color" content="#1a1a1a" media="(prefers-color-scheme: dark)" />
12
13
  <!--end::Accessibility Meta Tags-->
14
+
13
15
  <!--begin::Primary Meta Tags-->
14
16
  <meta name="title" content="AdminLTE 4 | Sidebar Mini" />
15
17
  <meta name="author" content="ColorlibHQ" />
@@ -22,11 +24,13 @@
22
24
  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"
23
25
  />
24
26
  <!--end::Primary Meta Tags-->
27
+
25
28
  <!--begin::Accessibility Features-->
26
29
  <!-- Skip links will be dynamically added by accessibility.js -->
27
30
  <meta name="supported-color-schemes" content="light dark" />
28
31
  <link rel="preload" href="../css/adminlte.css" as="style" />
29
32
  <!--end::Accessibility Features-->
33
+
30
34
  <!--begin::Fonts-->
31
35
  <link
32
36
  rel="stylesheet"
@@ -34,9 +38,10 @@
34
38
  integrity="sha256-tXJfXfp6Ewt1ilPzLDtQnJV4hclT9XuaZUKyUvmyr+Q="
35
39
  crossorigin="anonymous"
36
40
  media="print"
37
- onload="this.media='all'"
41
+ onload="this.media = 'all'"
38
42
  />
39
43
  <!--end::Fonts-->
44
+
40
45
  <!--begin::Third Party Plugin(OverlayScrollbars)-->
41
46
  <link
42
47
  rel="stylesheet"
@@ -44,6 +49,7 @@
44
49
  crossorigin="anonymous"
45
50
  />
46
51
  <!--end::Third Party Plugin(OverlayScrollbars)-->
52
+
47
53
  <!--begin::Third Party Plugin(Bootstrap Icons)-->
48
54
  <link
49
55
  rel="stylesheet"
@@ -51,6 +57,7 @@
51
57
  crossorigin="anonymous"
52
58
  />
53
59
  <!--end::Third Party Plugin(Bootstrap Icons)-->
60
+
54
61
  <!--begin::Required Plugin(AdminLTE)-->
55
62
  <link rel="stylesheet" href="../css/adminlte.css" />
56
63
  <!--end::Required Plugin(AdminLTE)-->
@@ -71,10 +78,15 @@
71
78
  <i class="bi bi-list"></i>
72
79
  </a>
73
80
  </li>
74
- <li class="nav-item d-none d-md-block"><a href="#" class="nav-link">Home</a></li>
75
- <li class="nav-item d-none d-md-block"><a href="#" class="nav-link">Contact</a></li>
81
+ <li class="nav-item d-none d-md-block">
82
+ <a href="#" class="nav-link">Home</a>
83
+ </li>
84
+ <li class="nav-item d-none d-md-block">
85
+ <a href="#" class="nav-link">Contact</a>
86
+ </li>
76
87
  </ul>
77
88
  <!--end::Start Navbar Links-->
89
+
78
90
  <!--begin::End Navbar Links-->
79
91
  <ul class="navbar-nav ms-auto">
80
92
  <!--begin::Navbar Search-->
@@ -84,6 +96,7 @@
84
96
  </a>
85
97
  </li>
86
98
  <!--end::Navbar Search-->
99
+
87
100
  <!--begin::Messages Dropdown Menu-->
88
101
  <li class="nav-item dropdown">
89
102
  <a class="nav-link" data-bs-toggle="dropdown" href="#">
@@ -173,6 +186,7 @@
173
186
  </div>
174
187
  </li>
175
188
  <!--end::Messages Dropdown Menu-->
189
+
176
190
  <!--begin::Notifications Dropdown Menu-->
177
191
  <li class="nav-item dropdown">
178
192
  <a class="nav-link" data-bs-toggle="dropdown" href="#">
@@ -201,6 +215,7 @@
201
215
  </div>
202
216
  </li>
203
217
  <!--end::Notifications Dropdown Menu-->
218
+
204
219
  <!--begin::Fullscreen Toggle-->
205
220
  <li class="nav-item">
206
221
  <a class="nav-link" href="#" data-lte-toggle="fullscreen">
@@ -209,6 +224,7 @@
209
224
  </a>
210
225
  </li>
211
226
  <!--end::Fullscreen Toggle-->
227
+
212
228
  <!--begin::User Menu Dropdown-->
213
229
  <li class="nav-item dropdown user-menu">
214
230
  <a href="#" class="nav-link dropdown-toggle" data-bs-toggle="dropdown">
@@ -237,17 +253,23 @@
237
253
  <li class="user-body">
238
254
  <!--begin::Row-->
239
255
  <div class="row">
240
- <div class="col-4 text-center"><a href="#">Followers</a></div>
241
- <div class="col-4 text-center"><a href="#">Sales</a></div>
242
- <div class="col-4 text-center"><a href="#">Friends</a></div>
256
+ <div class="col-4 text-center">
257
+ <a href="#">Followers</a>
258
+ </div>
259
+ <div class="col-4 text-center">
260
+ <a href="#">Sales</a>
261
+ </div>
262
+ <div class="col-4 text-center">
263
+ <a href="#">Friends</a>
264
+ </div>
243
265
  </div>
244
266
  <!--end::Row-->
245
267
  </li>
246
268
  <!--end::Menu Body-->
247
269
  <!--begin::Menu Footer-->
248
270
  <li class="user-footer">
249
- <a href="#" class="btn btn-default btn-flat">Profile</a>
250
- <a href="#" class="btn btn-default btn-flat float-end">Sign out</a>
271
+ <a href="#" class="btn btn-outline-secondary">Profile</a>
272
+ <a href="#" class="btn btn-outline-danger float-end">Sign out</a>
251
273
  </li>
252
274
  <!--end::Menu Footer-->
253
275
  </ul>
@@ -360,7 +382,7 @@
360
382
  <i class="nav-icon bi bi-clipboard-fill"></i>
361
383
  <p>
362
384
  Layout Options
363
- <span class="nav-badge badge text-bg-secondary me-3">6</span>
385
+ <span class="nav-badge badge text-bg-secondary me-3">7</span>
364
386
  <i class="nav-arrow bi bi-chevron-right"></i>
365
387
  </p>
366
388
  </a>
@@ -413,6 +435,12 @@
413
435
  <p>Sidebar Mini <small>+ Collapsed</small></p>
414
436
  </a>
415
437
  </li>
438
+ <li class="nav-item">
439
+ <a href="../layout/collapsed-sidebar-without-hover.html" class="nav-link">
440
+ <i class="nav-icon bi bi-circle"></i>
441
+ <p>Sidebar Mini <small>+ Collapsed + No Hover</small></p>
442
+ </a>
443
+ </li>
416
444
  <li class="nav-item">
417
445
  <a href="../layout/logo-switch.html" class="nav-link">
418
446
  <i class="nav-icon bi bi-circle"></i>
@@ -490,6 +518,7 @@
490
518
  </li>
491
519
  </ul>
492
520
  </li>
521
+
493
522
  <li class="nav-header">EXAMPLES</li>
494
523
  <li class="nav-item">
495
524
  <a href="#" class="nav-link">
@@ -554,6 +583,7 @@
554
583
  </li>
555
584
  </ul>
556
585
  </li>
586
+
557
587
  <li class="nav-header">DOCUMENTATIONS</li>
558
588
  <li class="nav-item">
559
589
  <a href="../docs/introduction.html" class="nav-link">
@@ -605,12 +635,48 @@
605
635
  </p>
606
636
  </a>
607
637
  <ul class="nav nav-treeview">
638
+ <li class="nav-item">
639
+ <a href="../docs/javascript/layout.html" class="nav-link">
640
+ <i class="nav-icon bi bi-circle"></i>
641
+ <p>Layout</p>
642
+ </a>
643
+ </li>
644
+ <li class="nav-item">
645
+ <a href="../docs/javascript/pushmenu.html" class="nav-link">
646
+ <i class="nav-icon bi bi-circle"></i>
647
+ <p>PushMenu</p>
648
+ </a>
649
+ </li>
608
650
  <li class="nav-item">
609
651
  <a href="../docs/javascript/treeview.html" class="nav-link">
610
652
  <i class="nav-icon bi bi-circle"></i>
611
653
  <p>Treeview</p>
612
654
  </a>
613
655
  </li>
656
+ <li class="nav-item">
657
+ <a href="../docs/javascript/card-widget.html" class="nav-link">
658
+ <i class="nav-icon bi bi-circle"></i>
659
+ <p>Card Widget</p>
660
+ </a>
661
+ </li>
662
+ <li class="nav-item">
663
+ <a href="../docs/javascript/direct-chat.html" class="nav-link">
664
+ <i class="nav-icon bi bi-circle"></i>
665
+ <p>Direct Chat</p>
666
+ </a>
667
+ </li>
668
+ <li class="nav-item">
669
+ <a href="../docs/javascript/fullscreen.html" class="nav-link">
670
+ <i class="nav-icon bi bi-circle"></i>
671
+ <p>Fullscreen</p>
672
+ </a>
673
+ </li>
674
+ <li class="nav-item">
675
+ <a href="../docs/javascript/accessibility.html" class="nav-link">
676
+ <i class="nav-icon bi bi-circle"></i>
677
+ <p>Accessibility</p>
678
+ </a>
679
+ </li>
614
680
  </ul>
615
681
  </li>
616
682
  <li class="nav-item">
@@ -637,6 +703,7 @@
637
703
  <p>License</p>
638
704
  </a>
639
705
  </li>
706
+
640
707
  <li class="nav-header">MULTI LEVEL EXAMPLE</li>
641
708
  <li class="nav-item">
642
709
  <a href="#" class="nav-link">
@@ -702,6 +769,7 @@
702
769
  <p>Level 1</p>
703
770
  </a>
704
771
  </li>
772
+
705
773
  <li class="nav-header">LABELS</li>
706
774
  <li class="nav-item">
707
775
  <a href="#" class="nav-link">
@@ -736,7 +804,9 @@
736
804
  <div class="container-fluid">
737
805
  <!--begin::Row-->
738
806
  <div class="row">
739
- <div class="col-sm-6"><h3 class="mb-0">Collapsed Sidebar</h3></div>
807
+ <div class="col-sm-6">
808
+ <h3 class="mb-0">Collapsed Sidebar</h3>
809
+ </div>
740
810
  <div class="col-sm-6">
741
811
  <ol class="breadcrumb float-sm-end">
742
812
  <li class="breadcrumb-item"><a href="#">Home</a></li>
@@ -760,6 +830,7 @@
760
830
  <div class="card">
761
831
  <div class="card-header">
762
832
  <h3 class="card-title">Title</h3>
833
+
763
834
  <div class="card-tools">
764
835
  <button
765
836
  type="button"
@@ -802,7 +873,7 @@
802
873
  <!--end::To the end-->
803
874
  <!--begin::Copyright-->
804
875
  <strong>
805
- Copyright &copy; 2014-2025&nbsp;
876
+ Copyright &copy; 2014-2026&nbsp;
806
877
  <a href="https://adminlte.io" class="text-decoration-none">AdminLTE.io</a>.
807
878
  </strong>
808
879
  All rights reserved.
@@ -839,7 +910,15 @@
839
910
  };
840
911
  document.addEventListener('DOMContentLoaded', function () {
841
912
  const sidebarWrapper = document.querySelector(SELECTOR_SIDEBAR_WRAPPER);
842
- if (sidebarWrapper && OverlayScrollbarsGlobal?.OverlayScrollbars !== undefined) {
913
+
914
+ // Disable OverlayScrollbars on mobile devices to prevent touch interference
915
+ const isMobile = window.innerWidth <= 992;
916
+
917
+ if (
918
+ sidebarWrapper &&
919
+ OverlayScrollbarsGlobal?.OverlayScrollbars !== undefined &&
920
+ !isMobile
921
+ ) {
843
922
  OverlayScrollbarsGlobal.OverlayScrollbars(sidebarWrapper, {
844
923
  scrollbars: {
845
924
  theme: Default.scrollbarTheme,
package/dist/layout/fixed-complete.html CHANGED
@@ -4,12 +4,14 @@
4
4
  <head>
5
5
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
6
6
  <title>AdminLTE 4 | Fixed Complete</title>
7
+
7
8
  <!--begin::Accessibility Meta Tags-->
8
9
  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
9
10
  <meta name="color-scheme" content="light dark" />
10
11
  <meta name="theme-color" content="#007bff" media="(prefers-color-scheme: light)" />
11
12
  <meta name="theme-color" content="#1a1a1a" media="(prefers-color-scheme: dark)" />
12
13
  <!--end::Accessibility Meta Tags-->
14
+
13
15
  <!--begin::Primary Meta Tags-->
14
16
  <meta name="title" content="AdminLTE 4 | Fixed Complete" />
15
17
  <meta name="author" content="ColorlibHQ" />
@@ -22,11 +24,13 @@
22
24
  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"
23
25
  />
24
26
  <!--end::Primary Meta Tags-->
27
+
25
28
  <!--begin::Accessibility Features-->
26
29
  <!-- Skip links will be dynamically added by accessibility.js -->
27
30
  <meta name="supported-color-schemes" content="light dark" />
28
31
  <link rel="preload" href="../css/adminlte.css" as="style" />
29
32
  <!--end::Accessibility Features-->
33
+
30
34
  <!--begin::Fonts-->
31
35
  <link
32
36
  rel="stylesheet"
@@ -34,9 +38,10 @@
34
38
  integrity="sha256-tXJfXfp6Ewt1ilPzLDtQnJV4hclT9XuaZUKyUvmyr+Q="
35
39
  crossorigin="anonymous"
36
40
  media="print"
37
- onload="this.media='all'"
41
+ onload="this.media = 'all'"
38
42
  />
39
43
  <!--end::Fonts-->
44
+
40
45
  <!--begin::Third Party Plugin(OverlayScrollbars)-->
41
46
  <link
42
47
  rel="stylesheet"
@@ -44,6 +49,7 @@
44
49
  crossorigin="anonymous"
45
50
  />
46
51
  <!--end::Third Party Plugin(OverlayScrollbars)-->
52
+
47
53
  <!--begin::Third Party Plugin(Bootstrap Icons)-->
48
54
  <link
49
55
  rel="stylesheet"
@@ -51,15 +57,14 @@
51
57
  crossorigin="anonymous"
52
58
  />
53
59
  <!--end::Third Party Plugin(Bootstrap Icons)-->
60
+
54
61
  <!--begin::Required Plugin(AdminLTE)-->
55
62
  <link rel="stylesheet" href="../css/adminlte.css" />
56
63
  <!--end::Required Plugin(AdminLTE)-->
57
64
  </head>
58
65
  <!--end::Head-->
59
66
  <!--begin::Body-->
60
- <body
61
- class="layout-fixed fixed-header fixed-footer sidebar-expand-lg sidebar-open bg-body-tertiary"
62
- >
67
+ <body class="layout-fixed fixed-header fixed-footer sidebar-expand-lg bg-body-tertiary">
63
68
  <!--begin::App Wrapper-->
64
69
  <div class="app-wrapper">
65
70
  <!--begin::Header-->
@@ -73,10 +78,15 @@
73
78
  <i class="bi bi-list"></i>
74
79
  </a>
75
80
  </li>
76
- <li class="nav-item d-none d-md-block"><a href="#" class="nav-link">Home</a></li>
77
- <li class="nav-item d-none d-md-block"><a href="#" class="nav-link">Contact</a></li>
81
+ <li class="nav-item d-none d-md-block">
82
+ <a href="#" class="nav-link">Home</a>
83
+ </li>
84
+ <li class="nav-item d-none d-md-block">
85
+ <a href="#" class="nav-link">Contact</a>
86
+ </li>
78
87
  </ul>
79
88
  <!--end::Start Navbar Links-->
89
+
80
90
  <!--begin::End Navbar Links-->
81
91
  <ul class="navbar-nav ms-auto">
82
92
  <!--begin::Navbar Search-->
@@ -86,6 +96,7 @@
86
96
  </a>
87
97
  </li>
88
98
  <!--end::Navbar Search-->
99
+
89
100
  <!--begin::Messages Dropdown Menu-->
90
101
  <li class="nav-item dropdown">
91
102
  <a class="nav-link" data-bs-toggle="dropdown" href="#">
@@ -175,6 +186,7 @@
175
186
  </div>
176
187
  </li>
177
188
  <!--end::Messages Dropdown Menu-->
189
+
178
190
  <!--begin::Notifications Dropdown Menu-->
179
191
  <li class="nav-item dropdown">
180
192
  <a class="nav-link" data-bs-toggle="dropdown" href="#">
@@ -203,6 +215,7 @@
203
215
  </div>
204
216
  </li>
205
217
  <!--end::Notifications Dropdown Menu-->
218
+
206
219
  <!--begin::Fullscreen Toggle-->
207
220
  <li class="nav-item">
208
221
  <a class="nav-link" href="#" data-lte-toggle="fullscreen">
@@ -211,6 +224,7 @@
211
224
  </a>
212
225
  </li>
213
226
  <!--end::Fullscreen Toggle-->
227
+
214
228
  <!--begin::User Menu Dropdown-->
215
229
  <li class="nav-item dropdown user-menu">
216
230
  <a href="#" class="nav-link dropdown-toggle" data-bs-toggle="dropdown">
@@ -239,17 +253,23 @@
239
253
  <li class="user-body">
240
254
  <!--begin::Row-->
241
255
  <div class="row">
242
- <div class="col-4 text-center"><a href="#">Followers</a></div>
243
- <div class="col-4 text-center"><a href="#">Sales</a></div>
244
- <div class="col-4 text-center"><a href="#">Friends</a></div>
256
+ <div class="col-4 text-center">
257
+ <a href="#">Followers</a>
258
+ </div>
259
+ <div class="col-4 text-center">
260
+ <a href="#">Sales</a>
261
+ </div>
262
+ <div class="col-4 text-center">
263
+ <a href="#">Friends</a>
264
+ </div>
245
265
  </div>
246
266
  <!--end::Row-->
247
267
  </li>
248
268
  <!--end::Menu Body-->
249
269
  <!--begin::Menu Footer-->
250
270
  <li class="user-footer">
251
- <a href="#" class="btn btn-default btn-flat">Profile</a>
252
- <a href="#" class="btn btn-default btn-flat float-end">Sign out</a>
271
+ <a href="#" class="btn btn-outline-secondary">Profile</a>
272
+ <a href="#" class="btn btn-outline-danger float-end">Sign out</a>
253
273
  </li>
254
274
  <!--end::Menu Footer-->
255
275
  </ul>
@@ -362,7 +382,7 @@
362
382
  <i class="nav-icon bi bi-clipboard-fill"></i>
363
383
  <p>
364
384
  Layout Options
365
- <span class="nav-badge badge text-bg-secondary me-3">6</span>
385
+ <span class="nav-badge badge text-bg-secondary me-3">7</span>
366
386
  <i class="nav-arrow bi bi-chevron-right"></i>
367
387
  </p>
368
388
  </a>
@@ -415,6 +435,12 @@
415
435
  <p>Sidebar Mini <small>+ Collapsed</small></p>
416
436
  </a>
417
437
  </li>
438
+ <li class="nav-item">
439
+ <a href="../layout/collapsed-sidebar-without-hover.html" class="nav-link">
440
+ <i class="nav-icon bi bi-circle"></i>
441
+ <p>Sidebar Mini <small>+ Collapsed + No Hover</small></p>
442
+ </a>
443
+ </li>
418
444
  <li class="nav-item">
419
445
  <a href="../layout/logo-switch.html" class="nav-link">
420
446
  <i class="nav-icon bi bi-circle"></i>
@@ -492,6 +518,7 @@
492
518
  </li>
493
519
  </ul>
494
520
  </li>
521
+
495
522
  <li class="nav-header">EXAMPLES</li>
496
523
  <li class="nav-item">
497
524
  <a href="#" class="nav-link">
@@ -556,6 +583,7 @@
556
583
  </li>
557
584
  </ul>
558
585
  </li>
586
+
559
587
  <li class="nav-header">DOCUMENTATIONS</li>
560
588
  <li class="nav-item">
561
589
  <a href="../docs/introduction.html" class="nav-link">
@@ -607,12 +635,48 @@
607
635
  </p>
608
636
  </a>
609
637
  <ul class="nav nav-treeview">
638
+ <li class="nav-item">
639
+ <a href="../docs/javascript/layout.html" class="nav-link">
640
+ <i class="nav-icon bi bi-circle"></i>
641
+ <p>Layout</p>
642
+ </a>
643
+ </li>
644
+ <li class="nav-item">
645
+ <a href="../docs/javascript/pushmenu.html" class="nav-link">
646
+ <i class="nav-icon bi bi-circle"></i>
647
+ <p>PushMenu</p>
648
+ </a>
649
+ </li>
610
650
  <li class="nav-item">
611
651
  <a href="../docs/javascript/treeview.html" class="nav-link">
612
652
  <i class="nav-icon bi bi-circle"></i>
613
653
  <p>Treeview</p>
614
654
  </a>
615
655
  </li>
656
+ <li class="nav-item">
657
+ <a href="../docs/javascript/card-widget.html" class="nav-link">
658
+ <i class="nav-icon bi bi-circle"></i>
659
+ <p>Card Widget</p>
660
+ </a>
661
+ </li>
662
+ <li class="nav-item">
663
+ <a href="../docs/javascript/direct-chat.html" class="nav-link">
664
+ <i class="nav-icon bi bi-circle"></i>
665
+ <p>Direct Chat</p>
666
+ </a>
667
+ </li>
668
+ <li class="nav-item">
669
+ <a href="../docs/javascript/fullscreen.html" class="nav-link">
670
+ <i class="nav-icon bi bi-circle"></i>
671
+ <p>Fullscreen</p>
672
+ </a>
673
+ </li>
674
+ <li class="nav-item">
675
+ <a href="../docs/javascript/accessibility.html" class="nav-link">
676
+ <i class="nav-icon bi bi-circle"></i>
677
+ <p>Accessibility</p>
678
+ </a>
679
+ </li>
616
680
  </ul>
617
681
  </li>
618
682
  <li class="nav-item">
@@ -639,6 +703,7 @@
639
703
  <p>License</p>
640
704
  </a>
641
705
  </li>
706
+
642
707
  <li class="nav-header">MULTI LEVEL EXAMPLE</li>
643
708
  <li class="nav-item">
644
709
  <a href="#" class="nav-link">
@@ -704,6 +769,7 @@
704
769
  <p>Level 1</p>
705
770
  </a>
706
771
  </li>
772
+
707
773
  <li class="nav-header">LABELS</li>
708
774
  <li class="nav-item">
709
775
  <a href="#" class="nav-link">
@@ -730,6 +796,7 @@
730
796
  <!--end::Sidebar Wrapper-->
731
797
  </aside>
732
798
  <!--end::Sidebar-->
799
+
733
800
  <!--begin::App Main-->
734
801
  <main class="app-main">
735
802
  <!--begin::App Content Header-->
@@ -738,7 +805,9 @@
738
805
  <div class="container-fluid">
739
806
  <!--begin::Row-->
740
807
  <div class="row">
741
- <div class="col-sm-6"><h3 class="mb-0">Fixed Complete</h3></div>
808
+ <div class="col-sm-6">
809
+ <h3 class="mb-0">Fixed Complete</h3>
810
+ </div>
742
811
  <div class="col-sm-6">
743
812
  <ol class="breadcrumb float-sm-end">
744
813
  <li class="breadcrumb-item"><a href="#">Home</a></li>
@@ -762,6 +831,7 @@
762
831
  <div class="card">
763
832
  <div class="card-header">
764
833
  <h3 class="card-title">Title</h3>
834
+
765
835
  <div class="card-tools">
766
836
  <button
767
837
  type="button"
@@ -804,7 +874,7 @@
804
874
  <!--end::To the end-->
805
875
  <!--begin::Copyright-->
806
876
  <strong>
807
- Copyright &copy; 2014-2025&nbsp;
877
+ Copyright &copy; 2014-2026&nbsp;
808
878
  <a href="https://adminlte.io" class="text-decoration-none">AdminLTE.io</a>.
809
879
  </strong>
810
880
  All rights reserved.
@@ -841,7 +911,15 @@
841
911
  };
842
912
  document.addEventListener('DOMContentLoaded', function () {
843
913
  const sidebarWrapper = document.querySelector(SELECTOR_SIDEBAR_WRAPPER);
844
- if (sidebarWrapper && OverlayScrollbarsGlobal?.OverlayScrollbars !== undefined) {
914
+
915
+ // Disable OverlayScrollbars on mobile devices to prevent touch interference
916
+ const isMobile = window.innerWidth <= 992;
917
+
918
+ if (
919
+ sidebarWrapper &&
920
+ OverlayScrollbarsGlobal?.OverlayScrollbars !== undefined &&
921
+ !isMobile
922
+ ) {
845
923
  OverlayScrollbarsGlobal.OverlayScrollbars(sidebarWrapper, {
846
924
  scrollbars: {
847
925
  theme: Default.scrollbarTheme,