Add storage key for sidebar state

Added the TS needed to store the sidebar state in the browsers local storage. This will store the state of the sidebar menu so that if it is collapsed or expanded, when the page is reloaded it will render in the same state the user wanted.
pull/5814/head
Walter Burditt 2025-01-24 18:26:20 -08:00
parent 199ca8a765
commit 5ec0831f3d
7 changed files with 107 additions and 247 deletions

232
dist/css/adminlte.css vendored
View File

@ -273,10 +273,8 @@ p {
}
abbr[title] {
-webkit-text-decoration: underline dotted;
text-decoration: underline dotted;
cursor: help;
-webkit-text-decoration-skip-ink: none;
text-decoration-skip-ink: none;
}
@ -565,11 +563,6 @@ legend + * {
padding: 0;
}
::-webkit-file-upload-button {
font: inherit;
-webkit-appearance: button;
}
::file-selector-button {
font: inherit;
-webkit-appearance: button;
@ -2122,8 +2115,6 @@ progress {
font-weight: 400;
line-height: 1.5;
color: var(--bs-body-color);
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background-color: var(--bs-body-bg);
background-clip: padding-box;
@ -2159,10 +2150,6 @@ progress {
display: block;
padding: 0;
}
.form-control::-moz-placeholder {
color: var(--bs-secondary-color);
opacity: 1;
}
.form-control::placeholder {
color: var(--bs-secondary-color);
opacity: 1;
@ -2171,26 +2158,9 @@ progress {
background-color: var(--bs-secondary-bg);
opacity: 1;
}
.form-control::-webkit-file-upload-button {
padding: 0.375rem 0.75rem;
margin: -0.375rem -0.75rem;
-webkit-margin-end: 0.75rem;
margin-inline-end: 0.75rem;
color: var(--bs-body-color);
background-color: var(--bs-tertiary-bg);
pointer-events: none;
border-color: inherit;
border-style: solid;
border-width: 0;
border-inline-end-width: var(--bs-border-width);
border-radius: 0;
-webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.form-control::file-selector-button {
padding: 0.375rem 0.75rem;
margin: -0.375rem -0.75rem;
-webkit-margin-end: 0.75rem;
margin-inline-end: 0.75rem;
color: var(--bs-body-color);
background-color: var(--bs-tertiary-bg);
@ -2203,17 +2173,10 @@ progress {
transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
@media (prefers-reduced-motion: reduce) {
.form-control::-webkit-file-upload-button {
-webkit-transition: none;
transition: none;
}
.form-control::file-selector-button {
transition: none;
}
}
.form-control:hover:not(:disabled):not([readonly])::-webkit-file-upload-button {
background-color: var(--bs-secondary-bg);
}
.form-control:hover:not(:disabled):not([readonly])::file-selector-button {
background-color: var(--bs-secondary-bg);
}
@ -2243,16 +2206,9 @@ progress {
font-size: 0.875rem;
border-radius: var(--bs-border-radius-sm);
}
.form-control-sm::-webkit-file-upload-button {
padding: 0.25rem 0.5rem;
margin: -0.25rem -0.5rem;
-webkit-margin-end: 0.5rem;
margin-inline-end: 0.5rem;
}
.form-control-sm::file-selector-button {
padding: 0.25rem 0.5rem;
margin: -0.25rem -0.5rem;
-webkit-margin-end: 0.5rem;
margin-inline-end: 0.5rem;
}
@ -2262,16 +2218,9 @@ progress {
font-size: 1.25rem;
border-radius: var(--bs-border-radius-lg);
}
.form-control-lg::-webkit-file-upload-button {
padding: 0.5rem 1rem;
margin: -0.5rem -1rem;
-webkit-margin-end: 1rem;
margin-inline-end: 1rem;
}
.form-control-lg::file-selector-button {
padding: 0.5rem 1rem;
margin: -0.5rem -1rem;
-webkit-margin-end: 1rem;
margin-inline-end: 1rem;
}
@ -2317,8 +2266,6 @@ textarea.form-control-lg {
font-weight: 400;
line-height: 1.5;
color: var(--bs-body-color);
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background-color: var(--bs-body-bg);
background-image: var(--bs-form-select-bg-img), var(--bs-form-select-bg-icon, none);
@ -2401,8 +2348,6 @@ textarea.form-control-lg {
height: 1em;
margin-top: 0.25em;
vertical-align: top;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background-color: var(--bs-form-check-bg);
background-image: var(--bs-form-check-bg-image);
@ -2410,8 +2355,6 @@ textarea.form-control-lg {
background-position: center;
background-size: contain;
border: var(--bs-border-width) solid var(--bs-border-color);
-webkit-print-color-adjust: exact;
color-adjust: exact;
print-color-adjust: exact;
}
.form-check-input[type=checkbox] {
@ -2510,8 +2453,6 @@ textarea.form-control-lg {
width: 100%;
height: 1.5rem;
padding: 0;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background-color: transparent;
}
@ -2531,18 +2472,15 @@ textarea.form-control-lg {
width: 1rem;
height: 1rem;
margin-top: -0.25rem;
-webkit-appearance: none;
appearance: none;
background-color: #0d6efd;
border: 0;
border-radius: 1rem;
box-shadow: 0 0.1rem 0.25rem rgba(0, 0, 0, 0.1);
-webkit-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
@media (prefers-reduced-motion: reduce) {
.form-range::-webkit-slider-thumb {
-webkit-transition: none;
transition: none;
}
}
@ -2562,18 +2500,15 @@ textarea.form-control-lg {
.form-range::-moz-range-thumb {
width: 1rem;
height: 1rem;
-moz-appearance: none;
appearance: none;
background-color: #0d6efd;
border: 0;
border-radius: 1rem;
box-shadow: 0 0.1rem 0.25rem rgba(0, 0, 0, 0.1);
-moz-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
@media (prefers-reduced-motion: reduce) {
.form-range::-moz-range-thumb {
-moz-transition: none;
transition: none;
}
}
@ -2635,17 +2570,10 @@ textarea.form-control-lg {
.form-floating > .form-control-plaintext {
padding: 1rem 0.75rem;
}
.form-floating > .form-control::-moz-placeholder, .form-floating > .form-control-plaintext::-moz-placeholder {
color: transparent;
}
.form-floating > .form-control::placeholder,
.form-floating > .form-control-plaintext::placeholder {
color: transparent;
}
.form-floating > .form-control:not(:-moz-placeholder-shown), .form-floating > .form-control-plaintext:not(:-moz-placeholder-shown) {
padding-top: 1.625rem;
padding-bottom: 0.625rem;
}
.form-floating > .form-control:focus, .form-floating > .form-control:not(:placeholder-shown),
.form-floating > .form-control-plaintext:focus,
.form-floating > .form-control-plaintext:not(:placeholder-shown) {
@ -2661,10 +2589,6 @@ textarea.form-control-lg {
padding-top: 1.625rem;
padding-bottom: 0.625rem;
}
.form-floating > .form-control:not(:-moz-placeholder-shown) ~ label {
color: rgba(var(--bs-body-color-rgb), 0.65);
transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem);
}
.form-floating > .form-control:focus ~ label,
.form-floating > .form-control:not(:placeholder-shown) ~ label,
.form-floating > .form-control-plaintext ~ label,
@ -2672,15 +2596,6 @@ textarea.form-control-lg {
color: rgba(var(--bs-body-color-rgb), 0.65);
transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem);
}
.form-floating > .form-control:not(:-moz-placeholder-shown) ~ label::after {
position: absolute;
inset: 1rem 0.375rem;
z-index: -1;
height: 1.5em;
content: "";
background-color: var(--bs-body-bg);
border-radius: var(--bs-border-radius);
}
.form-floating > .form-control:focus ~ label::after,
.form-floating > .form-control:not(:placeholder-shown) ~ label::after,
.form-floating > .form-control-plaintext ~ label::after,
@ -3007,8 +2922,6 @@ textarea.form-control-lg {
text-decoration: none;
vertical-align: middle;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
border: var(--bs-btn-border-width) solid var(--bs-btn-border-color);
border-radius: var(--bs-btn-border-radius);
@ -5413,8 +5326,6 @@ textarea.form-control-lg {
}
.btn-close:disabled, .btn-close.disabled {
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
opacity: var(--bs-btn-close-disabled-opacity);
}
@ -5465,8 +5376,6 @@ textarea.form-control-lg {
--bs-toast-zindex: 1090;
position: absolute;
z-index: var(--bs-toast-zindex);
width: -webkit-max-content;
width: -moz-max-content;
width: max-content;
max-width: 100%;
pointer-events: none;
@ -6072,7 +5981,6 @@ textarea.form-control-lg {
float: left;
width: 100%;
margin-right: -100%;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
transition: transform 0.6s ease-in-out;
}
@ -6857,16 +6765,13 @@ textarea.form-control-lg {
}
}
.placeholder-wave {
-webkit-mask-image: linear-gradient(130deg, #000 55%, rgba(0, 0, 0, 0.8) 75%, #000 95%);
mask-image: linear-gradient(130deg, #000 55%, rgba(0, 0, 0, 0.8) 75%, #000 95%);
-webkit-mask-size: 200% 100%;
mask-size: 200% 100%;
animation: placeholder-wave 2s linear infinite;
}
@keyframes placeholder-wave {
100% {
-webkit-mask-position: -200% 0%;
mask-position: -200% 0%;
}
}
@ -6918,100 +6823,82 @@ textarea.form-control-lg {
.link-primary {
color: RGBA(var(--bs-primary-rgb), var(--bs-link-opacity, 1)) !important;
-webkit-text-decoration-color: RGBA(var(--bs-primary-rgb), var(--bs-link-underline-opacity, 1)) !important;
text-decoration-color: RGBA(var(--bs-primary-rgb), var(--bs-link-underline-opacity, 1)) !important;
}
.link-primary:hover, .link-primary:focus {
color: RGBA(10, 88, 202, var(--bs-link-opacity, 1)) !important;
-webkit-text-decoration-color: RGBA(10, 88, 202, var(--bs-link-underline-opacity, 1)) !important;
text-decoration-color: RGBA(10, 88, 202, var(--bs-link-underline-opacity, 1)) !important;
}
.link-secondary {
color: RGBA(var(--bs-secondary-rgb), var(--bs-link-opacity, 1)) !important;
-webkit-text-decoration-color: RGBA(var(--bs-secondary-rgb), var(--bs-link-underline-opacity, 1)) !important;
text-decoration-color: RGBA(var(--bs-secondary-rgb), var(--bs-link-underline-opacity, 1)) !important;
}
.link-secondary:hover, .link-secondary:focus {
color: RGBA(86, 94, 100, var(--bs-link-opacity, 1)) !important;
-webkit-text-decoration-color: RGBA(86, 94, 100, var(--bs-link-underline-opacity, 1)) !important;
text-decoration-color: RGBA(86, 94, 100, var(--bs-link-underline-opacity, 1)) !important;
}
.link-success {
color: RGBA(var(--bs-success-rgb), var(--bs-link-opacity, 1)) !important;
-webkit-text-decoration-color: RGBA(var(--bs-success-rgb), var(--bs-link-underline-opacity, 1)) !important;
text-decoration-color: RGBA(var(--bs-success-rgb), var(--bs-link-underline-opacity, 1)) !important;
}
.link-success:hover, .link-success:focus {
color: RGBA(20, 108, 67, var(--bs-link-opacity, 1)) !important;
-webkit-text-decoration-color: RGBA(20, 108, 67, var(--bs-link-underline-opacity, 1)) !important;
text-decoration-color: RGBA(20, 108, 67, var(--bs-link-underline-opacity, 1)) !important;
}
.link-info {
color: RGBA(var(--bs-info-rgb), var(--bs-link-opacity, 1)) !important;
-webkit-text-decoration-color: RGBA(var(--bs-info-rgb), var(--bs-link-underline-opacity, 1)) !important;
text-decoration-color: RGBA(var(--bs-info-rgb), var(--bs-link-underline-opacity, 1)) !important;
}
.link-info:hover, .link-info:focus {
color: RGBA(61, 213, 243, var(--bs-link-opacity, 1)) !important;
-webkit-text-decoration-color: RGBA(61, 213, 243, var(--bs-link-underline-opacity, 1)) !important;
text-decoration-color: RGBA(61, 213, 243, var(--bs-link-underline-opacity, 1)) !important;
}
.link-warning {
color: RGBA(var(--bs-warning-rgb), var(--bs-link-opacity, 1)) !important;
-webkit-text-decoration-color: RGBA(var(--bs-warning-rgb), var(--bs-link-underline-opacity, 1)) !important;
text-decoration-color: RGBA(var(--bs-warning-rgb), var(--bs-link-underline-opacity, 1)) !important;
}
.link-warning:hover, .link-warning:focus {
color: RGBA(255, 205, 57, var(--bs-link-opacity, 1)) !important;
-webkit-text-decoration-color: RGBA(255, 205, 57, var(--bs-link-underline-opacity, 1)) !important;
text-decoration-color: RGBA(255, 205, 57, var(--bs-link-underline-opacity, 1)) !important;
}
.link-danger {
color: RGBA(var(--bs-danger-rgb), var(--bs-link-opacity, 1)) !important;
-webkit-text-decoration-color: RGBA(var(--bs-danger-rgb), var(--bs-link-underline-opacity, 1)) !important;
text-decoration-color: RGBA(var(--bs-danger-rgb), var(--bs-link-underline-opacity, 1)) !important;
}
.link-danger:hover, .link-danger:focus {
color: RGBA(176, 42, 55, var(--bs-link-opacity, 1)) !important;
-webkit-text-decoration-color: RGBA(176, 42, 55, var(--bs-link-underline-opacity, 1)) !important;
text-decoration-color: RGBA(176, 42, 55, var(--bs-link-underline-opacity, 1)) !important;
}
.link-light {
color: RGBA(var(--bs-light-rgb), var(--bs-link-opacity, 1)) !important;
-webkit-text-decoration-color: RGBA(var(--bs-light-rgb), var(--bs-link-underline-opacity, 1)) !important;
text-decoration-color: RGBA(var(--bs-light-rgb), var(--bs-link-underline-opacity, 1)) !important;
}
.link-light:hover, .link-light:focus {
color: RGBA(249, 250, 251, var(--bs-link-opacity, 1)) !important;
-webkit-text-decoration-color: RGBA(249, 250, 251, var(--bs-link-underline-opacity, 1)) !important;
text-decoration-color: RGBA(249, 250, 251, var(--bs-link-underline-opacity, 1)) !important;
}
.link-dark {
color: RGBA(var(--bs-dark-rgb), var(--bs-link-opacity, 1)) !important;
-webkit-text-decoration-color: RGBA(var(--bs-dark-rgb), var(--bs-link-underline-opacity, 1)) !important;
text-decoration-color: RGBA(var(--bs-dark-rgb), var(--bs-link-underline-opacity, 1)) !important;
}
.link-dark:hover, .link-dark:focus {
color: RGBA(26, 30, 33, var(--bs-link-opacity, 1)) !important;
-webkit-text-decoration-color: RGBA(26, 30, 33, var(--bs-link-underline-opacity, 1)) !important;
text-decoration-color: RGBA(26, 30, 33, var(--bs-link-underline-opacity, 1)) !important;
}
.link-body-emphasis {
color: RGBA(var(--bs-emphasis-color-rgb), var(--bs-link-opacity, 1)) !important;
-webkit-text-decoration-color: RGBA(var(--bs-emphasis-color-rgb), var(--bs-link-underline-opacity, 1)) !important;
text-decoration-color: RGBA(var(--bs-emphasis-color-rgb), var(--bs-link-underline-opacity, 1)) !important;
}
.link-body-emphasis:hover, .link-body-emphasis:focus {
color: RGBA(var(--bs-emphasis-color-rgb), var(--bs-link-opacity, 0.75)) !important;
-webkit-text-decoration-color: RGBA(var(--bs-emphasis-color-rgb), var(--bs-link-underline-opacity, 0.75)) !important;
text-decoration-color: RGBA(var(--bs-emphasis-color-rgb), var(--bs-link-underline-opacity, 0.75)) !important;
}
@ -7024,10 +6911,8 @@ textarea.form-control-lg {
display: inline-flex;
gap: 0.375rem;
align-items: center;
-webkit-text-decoration-color: rgba(var(--bs-link-color-rgb), var(--bs-link-opacity, 0.5));
text-decoration-color: rgba(var(--bs-link-color-rgb), var(--bs-link-opacity, 0.5));
text-underline-offset: 0.25em;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.icon-link > .bi {
@ -7097,14 +6982,12 @@ textarea.form-control-lg {
}
.sticky-top {
position: -webkit-sticky;
position: sticky;
top: 0;
z-index: 1020;
}
.sticky-bottom {
position: -webkit-sticky;
position: sticky;
bottom: 0;
z-index: 1020;
@ -7112,13 +6995,11 @@ textarea.form-control-lg {
@media (min-width: 576px) {
.sticky-sm-top {
position: -webkit-sticky;
position: sticky;
top: 0;
z-index: 1020;
}
.sticky-sm-bottom {
position: -webkit-sticky;
position: sticky;
bottom: 0;
z-index: 1020;
@ -7126,13 +7007,11 @@ textarea.form-control-lg {
}
@media (min-width: 768px) {
.sticky-md-top {
position: -webkit-sticky;
position: sticky;
top: 0;
z-index: 1020;
}
.sticky-md-bottom {
position: -webkit-sticky;
position: sticky;
bottom: 0;
z-index: 1020;
@ -7140,13 +7019,11 @@ textarea.form-control-lg {
}
@media (min-width: 992px) {
.sticky-lg-top {
position: -webkit-sticky;
position: sticky;
top: 0;
z-index: 1020;
}
.sticky-lg-bottom {
position: -webkit-sticky;
position: sticky;
bottom: 0;
z-index: 1020;
@ -7154,13 +7031,11 @@ textarea.form-control-lg {
}
@media (min-width: 1200px) {
.sticky-xl-top {
position: -webkit-sticky;
position: sticky;
top: 0;
z-index: 1020;
}
.sticky-xl-bottom {
position: -webkit-sticky;
position: sticky;
bottom: 0;
z-index: 1020;
@ -7168,13 +7043,11 @@ textarea.form-control-lg {
}
@media (min-width: 1400px) {
.sticky-xxl-top {
position: -webkit-sticky;
position: sticky;
top: 0;
z-index: 1020;
}
.sticky-xxl-bottom {
position: -webkit-sticky;
position: sticky;
bottom: 0;
z-index: 1020;
@ -7272,27 +7145,22 @@ textarea.form-control-lg {
}
.object-fit-contain {
-o-object-fit: contain !important;
object-fit: contain !important;
}
.object-fit-cover {
-o-object-fit: cover !important;
object-fit: cover !important;
}
.object-fit-fill {
-o-object-fit: fill !important;
object-fit: fill !important;
}
.object-fit-scale {
-o-object-fit: scale-down !important;
object-fit: scale-down !important;
}
.object-fit-none {
-o-object-fit: none !important;
object-fit: none !important;
}
@ -7473,7 +7341,6 @@ textarea.form-control-lg {
}
.position-sticky {
position: -webkit-sticky !important;
position: sticky !important;
}
@ -8524,32 +8391,26 @@ textarea.form-control-lg {
}
.column-gap-0 {
-moz-column-gap: 0 !important;
column-gap: 0 !important;
}
.column-gap-1 {
-moz-column-gap: 0.25rem !important;
column-gap: 0.25rem !important;
}
.column-gap-2 {
-moz-column-gap: 0.5rem !important;
column-gap: 0.5rem !important;
}
.column-gap-3 {
-moz-column-gap: 1rem !important;
column-gap: 1rem !important;
}
.column-gap-4 {
-moz-column-gap: 1.5rem !important;
column-gap: 1.5rem !important;
}
.column-gap-5 {
-moz-column-gap: 3rem !important;
column-gap: 3rem !important;
}
@ -8896,55 +8757,46 @@ textarea.form-control-lg {
.link-underline-primary {
--bs-link-underline-opacity: 1;
-webkit-text-decoration-color: rgba(var(--bs-primary-rgb), var(--bs-link-underline-opacity)) !important;
text-decoration-color: rgba(var(--bs-primary-rgb), var(--bs-link-underline-opacity)) !important;
}
.link-underline-secondary {
--bs-link-underline-opacity: 1;
-webkit-text-decoration-color: rgba(var(--bs-secondary-rgb), var(--bs-link-underline-opacity)) !important;
text-decoration-color: rgba(var(--bs-secondary-rgb), var(--bs-link-underline-opacity)) !important;
}
.link-underline-success {
--bs-link-underline-opacity: 1;
-webkit-text-decoration-color: rgba(var(--bs-success-rgb), var(--bs-link-underline-opacity)) !important;
text-decoration-color: rgba(var(--bs-success-rgb), var(--bs-link-underline-opacity)) !important;
}
.link-underline-info {
--bs-link-underline-opacity: 1;
-webkit-text-decoration-color: rgba(var(--bs-info-rgb), var(--bs-link-underline-opacity)) !important;
text-decoration-color: rgba(var(--bs-info-rgb), var(--bs-link-underline-opacity)) !important;
}
.link-underline-warning {
--bs-link-underline-opacity: 1;
-webkit-text-decoration-color: rgba(var(--bs-warning-rgb), var(--bs-link-underline-opacity)) !important;
text-decoration-color: rgba(var(--bs-warning-rgb), var(--bs-link-underline-opacity)) !important;
}
.link-underline-danger {
--bs-link-underline-opacity: 1;
-webkit-text-decoration-color: rgba(var(--bs-danger-rgb), var(--bs-link-underline-opacity)) !important;
text-decoration-color: rgba(var(--bs-danger-rgb), var(--bs-link-underline-opacity)) !important;
}
.link-underline-light {
--bs-link-underline-opacity: 1;
-webkit-text-decoration-color: rgba(var(--bs-light-rgb), var(--bs-link-underline-opacity)) !important;
text-decoration-color: rgba(var(--bs-light-rgb), var(--bs-link-underline-opacity)) !important;
}
.link-underline-dark {
--bs-link-underline-opacity: 1;
-webkit-text-decoration-color: rgba(var(--bs-dark-rgb), var(--bs-link-underline-opacity)) !important;
text-decoration-color: rgba(var(--bs-dark-rgb), var(--bs-link-underline-opacity)) !important;
}
.link-underline {
--bs-link-underline-opacity: 1;
-webkit-text-decoration-color: rgba(var(--bs-link-color-rgb), var(--bs-link-underline-opacity, 1)) !important;
text-decoration-color: rgba(var(--bs-link-color-rgb), var(--bs-link-underline-opacity, 1)) !important;
}
@ -9123,20 +8975,14 @@ textarea.form-control-lg {
}
.user-select-all {
-webkit-user-select: all !important;
-moz-user-select: all !important;
user-select: all !important;
}
.user-select-auto {
-webkit-user-select: auto !important;
-moz-user-select: auto !important;
user-select: auto !important;
}
.user-select-none {
-webkit-user-select: none !important;
-moz-user-select: none !important;
user-select: none !important;
}
@ -9403,23 +9249,18 @@ textarea.form-control-lg {
float: none !important;
}
.object-fit-sm-contain {
-o-object-fit: contain !important;
object-fit: contain !important;
}
.object-fit-sm-cover {
-o-object-fit: cover !important;
object-fit: cover !important;
}
.object-fit-sm-fill {
-o-object-fit: fill !important;
object-fit: fill !important;
}
.object-fit-sm-scale {
-o-object-fit: scale-down !important;
object-fit: scale-down !important;
}
.object-fit-sm-none {
-o-object-fit: none !important;
object-fit: none !important;
}
.d-sm-inline {
@ -10035,27 +9876,21 @@ textarea.form-control-lg {
row-gap: 3rem !important;
}
.column-gap-sm-0 {
-moz-column-gap: 0 !important;
column-gap: 0 !important;
}
.column-gap-sm-1 {
-moz-column-gap: 0.25rem !important;
column-gap: 0.25rem !important;
}
.column-gap-sm-2 {
-moz-column-gap: 0.5rem !important;
column-gap: 0.5rem !important;
}
.column-gap-sm-3 {
-moz-column-gap: 1rem !important;
column-gap: 1rem !important;
}
.column-gap-sm-4 {
-moz-column-gap: 1.5rem !important;
column-gap: 1.5rem !important;
}
.column-gap-sm-5 {
-moz-column-gap: 3rem !important;
column-gap: 3rem !important;
}
.text-sm-start {
@ -10079,23 +9914,18 @@ textarea.form-control-lg {
float: none !important;
}
.object-fit-md-contain {
-o-object-fit: contain !important;
object-fit: contain !important;
}
.object-fit-md-cover {
-o-object-fit: cover !important;
object-fit: cover !important;
}
.object-fit-md-fill {
-o-object-fit: fill !important;
object-fit: fill !important;
}
.object-fit-md-scale {
-o-object-fit: scale-down !important;
object-fit: scale-down !important;
}
.object-fit-md-none {
-o-object-fit: none !important;
object-fit: none !important;
}
.d-md-inline {
@ -10711,27 +10541,21 @@ textarea.form-control-lg {
row-gap: 3rem !important;
}
.column-gap-md-0 {
-moz-column-gap: 0 !important;
column-gap: 0 !important;
}
.column-gap-md-1 {
-moz-column-gap: 0.25rem !important;
column-gap: 0.25rem !important;
}
.column-gap-md-2 {
-moz-column-gap: 0.5rem !important;
column-gap: 0.5rem !important;
}
.column-gap-md-3 {
-moz-column-gap: 1rem !important;
column-gap: 1rem !important;
}
.column-gap-md-4 {
-moz-column-gap: 1.5rem !important;
column-gap: 1.5rem !important;
}
.column-gap-md-5 {
-moz-column-gap: 3rem !important;
column-gap: 3rem !important;
}
.text-md-start {
@ -10755,23 +10579,18 @@ textarea.form-control-lg {
float: none !important;
}
.object-fit-lg-contain {
-o-object-fit: contain !important;
object-fit: contain !important;
}
.object-fit-lg-cover {
-o-object-fit: cover !important;
object-fit: cover !important;
}
.object-fit-lg-fill {
-o-object-fit: fill !important;
object-fit: fill !important;
}
.object-fit-lg-scale {
-o-object-fit: scale-down !important;
object-fit: scale-down !important;
}
.object-fit-lg-none {
-o-object-fit: none !important;
object-fit: none !important;
}
.d-lg-inline {
@ -11387,27 +11206,21 @@ textarea.form-control-lg {
row-gap: 3rem !important;
}
.column-gap-lg-0 {
-moz-column-gap: 0 !important;
column-gap: 0 !important;
}
.column-gap-lg-1 {
-moz-column-gap: 0.25rem !important;
column-gap: 0.25rem !important;
}
.column-gap-lg-2 {
-moz-column-gap: 0.5rem !important;
column-gap: 0.5rem !important;
}
.column-gap-lg-3 {
-moz-column-gap: 1rem !important;
column-gap: 1rem !important;
}
.column-gap-lg-4 {
-moz-column-gap: 1.5rem !important;
column-gap: 1.5rem !important;
}
.column-gap-lg-5 {
-moz-column-gap: 3rem !important;
column-gap: 3rem !important;
}
.text-lg-start {
@ -11431,23 +11244,18 @@ textarea.form-control-lg {
float: none !important;
}
.object-fit-xl-contain {
-o-object-fit: contain !important;
object-fit: contain !important;
}
.object-fit-xl-cover {
-o-object-fit: cover !important;
object-fit: cover !important;
}
.object-fit-xl-fill {
-o-object-fit: fill !important;
object-fit: fill !important;
}
.object-fit-xl-scale {
-o-object-fit: scale-down !important;
object-fit: scale-down !important;
}
.object-fit-xl-none {
-o-object-fit: none !important;
object-fit: none !important;
}
.d-xl-inline {
@ -12063,27 +11871,21 @@ textarea.form-control-lg {
row-gap: 3rem !important;
}
.column-gap-xl-0 {
-moz-column-gap: 0 !important;
column-gap: 0 !important;
}
.column-gap-xl-1 {
-moz-column-gap: 0.25rem !important;
column-gap: 0.25rem !important;
}
.column-gap-xl-2 {
-moz-column-gap: 0.5rem !important;
column-gap: 0.5rem !important;
}
.column-gap-xl-3 {
-moz-column-gap: 1rem !important;
column-gap: 1rem !important;
}
.column-gap-xl-4 {
-moz-column-gap: 1.5rem !important;
column-gap: 1.5rem !important;
}
.column-gap-xl-5 {
-moz-column-gap: 3rem !important;
column-gap: 3rem !important;
}
.text-xl-start {
@ -12107,23 +11909,18 @@ textarea.form-control-lg {
float: none !important;
}
.object-fit-xxl-contain {
-o-object-fit: contain !important;
object-fit: contain !important;
}
.object-fit-xxl-cover {
-o-object-fit: cover !important;
object-fit: cover !important;
}
.object-fit-xxl-fill {
-o-object-fit: fill !important;
object-fit: fill !important;
}
.object-fit-xxl-scale {
-o-object-fit: scale-down !important;
object-fit: scale-down !important;
}
.object-fit-xxl-none {
-o-object-fit: none !important;
object-fit: none !important;
}
.d-xxl-inline {
@ -12739,27 +12536,21 @@ textarea.form-control-lg {
row-gap: 3rem !important;
}
.column-gap-xxl-0 {
-moz-column-gap: 0 !important;
column-gap: 0 !important;
}
.column-gap-xxl-1 {
-moz-column-gap: 0.25rem !important;
column-gap: 0.25rem !important;
}
.column-gap-xxl-2 {
-moz-column-gap: 0.5rem !important;
column-gap: 0.5rem !important;
}
.column-gap-xxl-3 {
-moz-column-gap: 1rem !important;
column-gap: 1rem !important;
}
.column-gap-xxl-4 {
-moz-column-gap: 1.5rem !important;
column-gap: 1.5rem !important;
}
.column-gap-xxl-5 {
-moz-column-gap: 3rem !important;
column-gap: 3rem !important;
}
.text-xxl-start {
@ -12925,7 +12716,6 @@ textarea.form-control-lg {
position: relative;
display: grid;
grid-template-areas: "lte-app-sidebar lte-app-header" "lte-app-sidebar lte-app-main" "lte-app-sidebar lte-app-footer";
grid-template-rows: -webkit-min-content 1fr -webkit-min-content;
grid-template-rows: min-content 1fr min-content;
grid-template-columns: auto 1fr;
grid-gap: 0;
@ -12968,6 +12758,12 @@ textarea.form-control-lg {
font-weight: 400;
}
.fixed-header .app-header {
position: sticky;
top: 0;
z-index: 1030;
}
.app-sidebar {
--lte-sidebar-hover-bg: rgba(0, 0, 0, 0.1);
--lte-sidebar-color: #343a40;
@ -13365,7 +13161,6 @@ textarea.form-control-lg {
overflow: auto;
}
.sidebar-expand-sm.layout-fixed .app-sidebar {
position: -webkit-sticky;
position: sticky;
top: 0;
bottom: 0;
@ -13434,7 +13229,6 @@ textarea.form-control-lg {
overflow: auto;
}
.sidebar-expand-md.layout-fixed .app-sidebar {
position: -webkit-sticky;
position: sticky;
top: 0;
bottom: 0;
@ -13503,7 +13297,6 @@ textarea.form-control-lg {
overflow: auto;
}
.sidebar-expand-lg.layout-fixed .app-sidebar {
position: -webkit-sticky;
position: sticky;
top: 0;
bottom: 0;
@ -13572,7 +13365,6 @@ textarea.form-control-lg {
overflow: auto;
}
.sidebar-expand-xl.layout-fixed .app-sidebar {
position: -webkit-sticky;
position: sticky;
top: 0;
bottom: 0;
@ -13641,7 +13433,6 @@ textarea.form-control-lg {
overflow: auto;
}
.sidebar-expand-xxl.layout-fixed .app-sidebar {
position: -webkit-sticky;
position: sticky;
top: 0;
bottom: 0;
@ -13709,7 +13500,6 @@ textarea.form-control-lg {
overflow: auto;
}
.sidebar-expand.layout-fixed .app-sidebar {
position: -webkit-sticky;
position: sticky;
top: 0;
bottom: 0;
@ -13893,6 +13683,12 @@ body:not(.app-loaded) .app-footer {
}
}
.fixed-footer .app-footer {
position: sticky;
bottom: 0;
z-index: 1030;
}
.fs-7 .dropdown-menu {
font-size: 0.875rem !important;
}
@ -13977,7 +13773,6 @@ body:not(.app-loaded) .app-footer {
.open:not(.dropup) > .animated-dropdown-menu {
animation: flipInX 0.7s both;
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important;
}
@ -14531,7 +14326,6 @@ html.maximized-card {
color: inherit;
}
.table.table-head-fixed thead tr:nth-child(1) th {
position: -webkit-sticky;
position: sticky;
top: 0;
z-index: 10;
@ -15376,4 +15170,4 @@ html.maximized-card {
width: 32px;
}
/*# sourceMappingURL=adminlte.css.map */
/*# sourceMappingURL=adminlte.css.map */

File diff suppressed because one or more lines are too long

View File

@ -12942,6 +12942,13 @@ textarea.form-control-lg {
font-weight: 400;
}
.fixed-header .app-header {
position: -webkit-sticky;
position: sticky;
top: 0;
z-index: 1030;
}
.app-sidebar {
--lte-sidebar-hover-bg: rgba(0, 0, 0, 0.1);
--lte-sidebar-color: #343a40;
@ -13867,6 +13874,13 @@ body:not(.app-loaded) .app-footer {
}
}
.fixed-footer .app-footer {
position: -webkit-sticky;
position: sticky;
bottom: 0;
z-index: 1030;
}
.fs-7 .dropdown-menu {
font-size: 0.875rem !important;
}
@ -15349,4 +15363,5 @@ html.maximized-card {
.img-size-32 {
width: 32px;
}
/*# sourceMappingURL=adminlte.rtl.css.map */

File diff suppressed because one or more lines are too long

74
dist/js/adminlte.js vendored
View File

@ -1,6 +1,6 @@
/*!
* AdminLTE v4.0.0-beta3 (https://adminlte.io)
* Copyright 2014-2024 Colorlib <https://colorlib.com>
* Copyright 2014-2025 Colorlib <https://colorlib.com>
* Licensed under MIT (https://github.com/ColorlibHQ/AdminLTE/blob/master/LICENSE)
*/
(function (global, factory) {
@ -155,6 +155,7 @@
const SELECTOR_APP_WRAPPER = '.app-wrapper';
const SELECTOR_SIDEBAR_EXPAND = `[class*="${CLASS_NAME_SIDEBAR_EXPAND}"]`;
const SELECTOR_SIDEBAR_TOGGLE = '[data-lte-toggle="sidebar"]';
const STORAGE_KEY_SIDEBAR_STATE = 'lte.sidebar.state';
const Defaults = {
sidebarBreakpoint: 992
};
@ -175,7 +176,7 @@
navTree.style.removeProperty('height');
});
const navSidebar = document.querySelector(SELECTOR_SIDEBAR_MENU);
const navItem = navSidebar === null || navSidebar === void 0 ? void 0 : navSidebar.querySelectorAll(SELECTOR_NAV_ITEM$1);
const navItem = navSidebar === null || navSidebar === undefined ? undefined : navSidebar.querySelectorAll(SELECTOR_NAV_ITEM$1);
if (navItem) {
navItem.forEach(navI => {
navI.classList.remove(CLASS_NAME_MENU_OPEN$1);
@ -196,8 +197,8 @@
}
addSidebarBreakPoint() {
var _a, _b, _c;
const sidebarExpandList = (_b = (_a = document.querySelector(SELECTOR_SIDEBAR_EXPAND)) === null || _a === void 0 ? void 0 : _a.classList) !== null && _b !== void 0 ? _b : [];
const sidebarExpand = (_c = Array.from(sidebarExpandList).find(className => className.startsWith(CLASS_NAME_SIDEBAR_EXPAND))) !== null && _c !== void 0 ? _c : '';
const sidebarExpandList = (_b = (_a = document.querySelector(SELECTOR_SIDEBAR_EXPAND)) === null || _a === undefined ? undefined : _a.classList) !== null && _b !== undefined ? _b : [];
const sidebarExpand = (_c = Array.from(sidebarExpandList).find(className => className.startsWith(CLASS_NAME_SIDEBAR_EXPAND))) !== null && _c !== undefined ? _c : '';
const sidebar = document.getElementsByClassName(sidebarExpand)[0];
const sidebarContent = window.getComputedStyle(sidebar, '::before').getPropertyValue('content');
this._config = Object.assign(Object.assign({}, this._config), { sidebarBreakpoint: Number(sidebarContent.replace(/[^\d.-]/g, '')) });
@ -213,16 +214,39 @@
}
}
}
saveSidebarState() {
if (document.body.classList.contains(CLASS_NAME_SIDEBAR_OPEN)) {
localStorage.setItem(STORAGE_KEY_SIDEBAR_STATE, CLASS_NAME_SIDEBAR_OPEN);
}
else {
localStorage.setItem(STORAGE_KEY_SIDEBAR_STATE, CLASS_NAME_SIDEBAR_COLLAPSE);
}
}
loadSidebarState() {
let storedSidebarState = localStorage.getItem(STORAGE_KEY_SIDEBAR_STATE);
if (storedSidebarState === null) {
storedSidebarState = CLASS_NAME_SIDEBAR_OPEN;
}
if (storedSidebarState === CLASS_NAME_SIDEBAR_COLLAPSE) {
this.collapse();
}
else {
this.expand();
}
}
toggle() {
if (document.body.classList.contains(CLASS_NAME_SIDEBAR_COLLAPSE)) {
this.expand();
this.saveSidebarState();
}
else {
this.collapse();
this.saveSidebarState();
}
}
init() {
this.addSidebarBreakPoint();
this.loadSidebarState();
}
}
/**
@ -232,7 +256,7 @@
*/
onDOMContentLoaded(() => {
var _a;
const sidebar = document === null || document === void 0 ? void 0 : document.querySelector(SELECTOR_APP_SIDEBAR);
const sidebar = document === null || document === undefined ? undefined : document.querySelector(SELECTOR_APP_SIDEBAR);
if (sidebar) {
const data = new PushMenu(sidebar, Defaults);
data.init();
@ -242,7 +266,7 @@
}
const sidebarOverlay = document.createElement('div');
sidebarOverlay.className = CLASS_NAME_SIDEBAR_OVERLAY;
(_a = document.querySelector(SELECTOR_APP_WRAPPER)) === null || _a === void 0 ? void 0 : _a.append(sidebarOverlay);
(_a = document.querySelector(SELECTOR_APP_WRAPPER)) === null || _a === undefined ? undefined : _a.append(sidebarOverlay);
sidebarOverlay.addEventListener('touchstart', event => {
event.preventDefault();
const target = event.currentTarget;
@ -260,11 +284,11 @@
btn.addEventListener('click', event => {
event.preventDefault();
let button = event.currentTarget;
if ((button === null || button === void 0 ? void 0 : button.dataset.lteToggle) !== 'sidebar') {
button = button === null || button === void 0 ? void 0 : button.closest(SELECTOR_SIDEBAR_TOGGLE);
if ((button === null || button === undefined ? undefined : button.dataset.lteToggle) !== 'sidebar') {
button = button === null || button === undefined ? undefined : button.closest(SELECTOR_SIDEBAR_TOGGLE);
}
if (button) {
event === null || event === void 0 ? void 0 : event.preventDefault();
event === null || event === undefined ? undefined : event.preventDefault();
const data = new PushMenu(button, Defaults);
data.toggle();
}
@ -312,11 +336,11 @@
var _a, _b;
const event = new Event(EVENT_EXPANDED$2);
if (this._config.accordion) {
const openMenuList = (_a = this._element.parentElement) === null || _a === void 0 ? void 0 : _a.querySelectorAll(`${SELECTOR_NAV_ITEM}.${CLASS_NAME_MENU_OPEN}`);
openMenuList === null || openMenuList === void 0 ? void 0 : openMenuList.forEach(openMenu => {
const openMenuList = (_a = this._element.parentElement) === null || _a === undefined ? undefined : _a.querySelectorAll(`${SELECTOR_NAV_ITEM}.${CLASS_NAME_MENU_OPEN}`);
openMenuList === null || openMenuList === undefined ? undefined : openMenuList.forEach(openMenu => {
if (openMenu !== this._element.parentElement) {
openMenu.classList.remove(CLASS_NAME_MENU_OPEN);
const childElement = openMenu === null || openMenu === void 0 ? void 0 : openMenu.querySelector(SELECTOR_TREEVIEW_MENU);
const childElement = openMenu === null || openMenu === undefined ? undefined : openMenu.querySelector(SELECTOR_TREEVIEW_MENU);
if (childElement) {
slideUp(childElement, this._config.animationSpeed);
}
@ -324,7 +348,7 @@
});
}
this._element.classList.add(CLASS_NAME_MENU_OPEN);
const childElement = (_b = this._element) === null || _b === void 0 ? void 0 : _b.querySelector(SELECTOR_TREEVIEW_MENU);
const childElement = (_b = this._element) === null || _b === undefined ? undefined : _b.querySelector(SELECTOR_TREEVIEW_MENU);
if (childElement) {
slideDown(childElement, this._config.animationSpeed);
}
@ -334,7 +358,7 @@
var _a;
const event = new Event(EVENT_COLLAPSED$2);
this._element.classList.remove(CLASS_NAME_MENU_OPEN);
const childElement = (_a = this._element) === null || _a === void 0 ? void 0 : _a.querySelector(SELECTOR_TREEVIEW_MENU);
const childElement = (_a = this._element) === null || _a === undefined ? undefined : _a.querySelector(SELECTOR_TREEVIEW_MENU);
if (childElement) {
slideUp(childElement, this._config.animationSpeed);
}
@ -361,7 +385,7 @@
const target = event.target;
const targetItem = target.closest(SELECTOR_NAV_ITEM);
const targetLink = target.closest(SELECTOR_NAV_LINK);
if ((target === null || target === void 0 ? void 0 : target.getAttribute('href')) === '#' || (targetLink === null || targetLink === void 0 ? void 0 : targetLink.getAttribute('href')) === '#') {
if ((target === null || target === undefined ? undefined : target.getAttribute('href')) === '#' || (targetLink === null || targetLink === undefined ? undefined : targetLink.getAttribute('href')) === '#') {
event.preventDefault();
}
if (targetItem) {
@ -481,7 +505,7 @@
const event = new Event(EVENT_COLLAPSED);
if (this._parent) {
this._parent.classList.add(CLASS_NAME_COLLAPSING);
const elm = (_a = this._parent) === null || _a === void 0 ? void 0 : _a.querySelectorAll(`${SELECTOR_CARD_BODY}, ${SELECTOR_CARD_FOOTER}`);
const elm = (_a = this._parent) === null || _a === undefined ? undefined : _a.querySelectorAll(`${SELECTOR_CARD_BODY}, ${SELECTOR_CARD_FOOTER}`);
elm.forEach(el => {
if (el instanceof HTMLElement) {
slideUp(el, this._config.animationSpeed);
@ -494,14 +518,14 @@
}
}, this._config.animationSpeed);
}
(_b = this._element) === null || _b === void 0 ? void 0 : _b.dispatchEvent(event);
(_b = this._element) === null || _b === undefined ? undefined : _b.dispatchEvent(event);
}
expand() {
var _a, _b;
const event = new Event(EVENT_EXPANDED);
if (this._parent) {
this._parent.classList.add(CLASS_NAME_EXPANDING);
const elm = (_a = this._parent) === null || _a === void 0 ? void 0 : _a.querySelectorAll(`${SELECTOR_CARD_BODY}, ${SELECTOR_CARD_FOOTER}`);
const elm = (_a = this._parent) === null || _a === undefined ? undefined : _a.querySelectorAll(`${SELECTOR_CARD_BODY}, ${SELECTOR_CARD_FOOTER}`);
elm.forEach(el => {
if (el instanceof HTMLElement) {
slideDown(el, this._config.animationSpeed);
@ -514,7 +538,7 @@
}
}, this._config.animationSpeed);
}
(_b = this._element) === null || _b === void 0 ? void 0 : _b.dispatchEvent(event);
(_b = this._element) === null || _b === undefined ? undefined : _b.dispatchEvent(event);
}
remove() {
var _a;
@ -522,11 +546,11 @@
if (this._parent) {
slideUp(this._parent, this._config.animationSpeed);
}
(_a = this._element) === null || _a === void 0 ? void 0 : _a.dispatchEvent(event);
(_a = this._element) === null || _a === undefined ? undefined : _a.dispatchEvent(event);
}
toggle() {
var _a;
if ((_a = this._parent) === null || _a === void 0 ? void 0 : _a.classList.contains(CLASS_NAME_COLLAPSED)) {
if ((_a = this._parent) === null || _a === undefined ? undefined : _a.classList.contains(CLASS_NAME_COLLAPSED)) {
this.expand();
return;
}
@ -552,7 +576,7 @@
}
}, 150);
}
(_a = this._element) === null || _a === void 0 ? void 0 : _a.dispatchEvent(event);
(_a = this._element) === null || _a === undefined ? undefined : _a.dispatchEvent(event);
}
minimize() {
var _a;
@ -569,17 +593,17 @@
}
if (this._parent) {
this._parent.classList.remove(CLASS_NAME_MAXIMIZED);
if ((_a = this._parent) === null || _a === void 0 ? void 0 : _a.classList.contains(CLASS_NAME_WAS_COLLAPSED)) {
if ((_a = this._parent) === null || _a === undefined ? undefined : _a.classList.contains(CLASS_NAME_WAS_COLLAPSED)) {
this._parent.classList.remove(CLASS_NAME_WAS_COLLAPSED);
}
}
}, 10);
}
(_a = this._element) === null || _a === void 0 ? void 0 : _a.dispatchEvent(event);
(_a = this._element) === null || _a === undefined ? undefined : _a.dispatchEvent(event);
}
toggleMaximize() {
var _a;
if ((_a = this._parent) === null || _a === void 0 ? void 0 : _a.classList.contains(CLASS_NAME_MAXIMIZED)) {
if ((_a = this._parent) === null || _a === undefined ? undefined : _a.classList.contains(CLASS_NAME_MAXIMIZED)) {
this.minimize();
return;
}

File diff suppressed because one or more lines are too long

View File

@ -37,6 +37,8 @@ const SELECTOR_APP_WRAPPER = '.app-wrapper'
const SELECTOR_SIDEBAR_EXPAND = `[class*="${CLASS_NAME_SIDEBAR_EXPAND}"]`
const SELECTOR_SIDEBAR_TOGGLE = '[data-lte-toggle="sidebar"]'
const STORAGE_KEY_SIDEBAR_STATE = 'lte.sidebar.state'
type Config = {
sidebarBreakpoint: number;
}
@ -116,16 +118,41 @@ class PushMenu {
}
}
saveSidebarState() {
if (document.body.classList.contains(CLASS_NAME_SIDEBAR_OPEN)) {
localStorage.setItem(STORAGE_KEY_SIDEBAR_STATE, CLASS_NAME_SIDEBAR_OPEN)
} else {
localStorage.setItem(STORAGE_KEY_SIDEBAR_STATE, CLASS_NAME_SIDEBAR_COLLAPSE)
}
}
loadSidebarState() {
let storedSidebarState = localStorage.getItem(STORAGE_KEY_SIDEBAR_STATE)
if (storedSidebarState === null) {
storedSidebarState = CLASS_NAME_SIDEBAR_OPEN
}
if (storedSidebarState === CLASS_NAME_SIDEBAR_COLLAPSE) {
this.collapse()
} else {
this.expand()
}
}
toggle() {
if (document.body.classList.contains(CLASS_NAME_SIDEBAR_COLLAPSE)) {
this.expand()
this.saveSidebarState()
} else {
this.collapse()
this.saveSidebarState()
}
}
init() {
this.addSidebarBreakPoint()
this.loadSidebarState()
}
}