Compare commits
No commits in common. "master" and "0.1.4-2" have entirely different histories.
@ -6,14 +6,7 @@ SMEServer Koozali developed git repo for smeserver-manager-AdminLTE smecontribs
|
|||||||
<br />https://wiki.koozali.org/
|
<br />https://wiki.koozali.org/
|
||||||
|
|
||||||
## Bugzilla
|
## Bugzilla
|
||||||
Show list of outstanding bugs:
|
Show list of outstanding bugs: [here](https://bugs.koozali.org/buglist.cgi?component=smeserver-manager-AdminLTE&product=SME%20Contribs&query_format=advanced&limit=0&bug_status=UNCONFIRMED&bug_status=NEW&bug_status=ASSIGNED&bug_status=REOPENED&bug_status=CONFIRMED)
|
||||||
[All](https://bugs.koozali.org/buglist.cgi?action=wrap&bug_status=UNCONFIRMED&bug_status=CONFIRMED&bug_status=NEEDINFO&bug_status=IN_PROGRESS&bug_status=RESOLVED&bug_status=VERIFIED&classification=Contribs&component=smeserver-manager-AdminLTE&list_id=105781&order=changeddate+DESC%2Ccomponent%2Cpriority%2Cbug_severity&product=SME+Contribs&query_format=advanced)
|
|
||||||
[Confirmed](https://bugs.koozali.org/buglist.cgi?action=wrap&bug_status=CONFIRMED&classification=Contribs&component=smeserver-manager-AdminLTE&list_id=105781&order=changeddate+DESC%2Ccomponent%2Cpriority%2Cbug_severity&product=SME+Contribs&query_format=advanced)
|
|
||||||
[Unconfirmed](https://bugs.koozali.org/buglist.cgi?action=wrap&bug_status=UNCONFIRMED&classification=Contribs&component=smeserver-manager-AdminLTE&list_id=105781&order=changeddate+DESC%2Ccomponent%2Cpriority%2Cbug_severity&product=SME+Contribs&query_format=advanced)
|
|
||||||
[Need Info](https://bugs.koozali.org/buglist.cgi?action=wrap&bug_status=NEEDINFO&classification=Contribs&component=smeserver-manager-AdminLTE&list_id=105781&order=changeddate+DESC%2Ccomponent%2Cpriority%2Cbug_severity&product=SME+Contribs&query_format=advanced)
|
|
||||||
[In Progress](https://bugs.koozali.org/buglist.cgi?action=wrap&bug_status=IN_PROGRESS&classification=Contribs&component=smeserver-manager-AdminLTE&list_id=105781&order=changeddate+DESC%2Ccomponent%2Cpriority%2Cbug_severity&product=SME+Contribs&query_format=advanced)
|
|
||||||
[Verified](https://bugs.koozali.org/buglist.cgi?action=wrap&bug_status=VERIFIED&classification=Contribs&component=smeserver-manager-AdminLTE&list_id=105781&order=changeddate+DESC%2Ccomponent%2Cpriority%2Cbug_severity&product=SME+Contribs&query_format=advanced)
|
|
||||||
[Resolved](https://bugs.koozali.org/buglist.cgi?action=wrap&bug_status=RESOLVED&classification=Contribs&component=smeserver-manager-AdminLTE&list_id=105781&order=changeddate+DESC%2Ccomponent%2Cpriority%2Cbug_severity&product=SME+Contribs&query_format=advanced)
|
|
||||||
|
|
||||||
## Description
|
## Description
|
||||||
|
|
||||||
|
@ -0,0 +1,5 @@
|
|||||||
|
modules_dir => 'lib/SrvMngr/Controller',
|
||||||
|
webapp => 'smanager',
|
||||||
|
mode => 'development',
|
||||||
|
debug => 0,
|
||||||
|
\}
|
@ -0,0 +1,147 @@
|
|||||||
|
.sme-border {
|
||||||
|
border:0.07em solid lightgrey;
|
||||||
|
padding:5px;
|
||||||
|
}
|
||||||
|
table.sme-border {
|
||||||
|
margin-top:2.5em;
|
||||||
|
}
|
||||||
|
.table-striped>tr:nth-child(odd){
|
||||||
|
background-color:#c2e8a8;
|
||||||
|
}
|
||||||
|
.action {
|
||||||
|
background-color:#bee6a2;
|
||||||
|
border-width:1px;
|
||||||
|
border-radius:11px;
|
||||||
|
color:black;
|
||||||
|
}
|
||||||
|
.label {
|
||||||
|
display:inline-block;
|
||||||
|
width:50%;
|
||||||
|
filter:opacity(70%);
|
||||||
|
background-color:#bee6a2;
|
||||||
|
margin-bottom:4px;
|
||||||
|
}
|
||||||
|
.data {
|
||||||
|
display:inline-block;
|
||||||
|
margin-left:2px;
|
||||||
|
font-weight:normal!important;
|
||||||
|
float: left;
|
||||||
|
width: 49%;
|
||||||
|
height:80%;
|
||||||
|
}
|
||||||
|
.input {
|
||||||
|
width:auto;
|
||||||
|
margin-bottom:5px;
|
||||||
|
max-width:100%;
|
||||||
|
}
|
||||||
|
.wrapper {
|
||||||
|
background:#ecf0f5;
|
||||||
|
}
|
||||||
|
h1 {
|
||||||
|
font-size:2.5em;
|
||||||
|
}
|
||||||
|
h2 {
|
||||||
|
font-size:1.5em;
|
||||||
|
}
|
||||||
|
.card-subtitle {
|
||||||
|
margin-top: 0.625rem;
|
||||||
|
float:left;
|
||||||
|
margin-bottom:0.625rem;
|
||||||
|
}
|
||||||
|
h3 {
|
||||||
|
font-size:1.5em;
|
||||||
|
}
|
||||||
|
h4,h5 {
|
||||||
|
font-size:1em;
|
||||||
|
color:inherit;
|
||||||
|
}
|
||||||
|
.success {
|
||||||
|
color:green;
|
||||||
|
}
|
||||||
|
.sme-warning {
|
||||||
|
color:amber;
|
||||||
|
}
|
||||||
|
.sme-error {
|
||||||
|
color:red;
|
||||||
|
}
|
||||||
|
.active {
|
||||||
|
background-color:#c2e8a8;
|
||||||
|
color:black;
|
||||||
|
}
|
||||||
|
.button {
|
||||||
|
display: block;
|
||||||
|
width: 115px;
|
||||||
|
height: 25px;
|
||||||
|
background: darkgreen;
|
||||||
|
padding: 0.1rem;
|
||||||
|
text-align: center;
|
||||||
|
border-radius: 5px;
|
||||||
|
color: white;
|
||||||
|
font-weight: bold;
|
||||||
|
line-height: auto;
|
||||||
|
}
|
||||||
|
a.button:hover {
|
||||||
|
color:lightgrey;
|
||||||
|
}
|
||||||
|
form p {
|
||||||
|
padding : 0;
|
||||||
|
margin : 0;
|
||||||
|
}
|
||||||
|
.login-box {
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.review-panel td.label{
|
||||||
|
width:100%;
|
||||||
|
}
|
||||||
|
.review-panel p{
|
||||||
|
margin-bottom:0.3em;
|
||||||
|
}
|
||||||
|
.review-panel span.label {
|
||||||
|
margin-right:1%;
|
||||||
|
width:52%;
|
||||||
|
padding-left:0.75rem;
|
||||||
|
padding-top:0;
|
||||||
|
}
|
||||||
|
.review-panel td,th {
|
||||||
|
border-top:none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.review-panel table {
|
||||||
|
width:109%
|
||||||
|
}
|
||||||
|
|
||||||
|
.review-panel.table th,td {
|
||||||
|
width:52.3%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-header {
|
||||||
|
margin-bottom:0.625rem;
|
||||||
|
}
|
||||||
|
.module span.label {
|
||||||
|
margin-right:0.3em;
|
||||||
|
}
|
||||||
|
h2,h3,h4,h5 {
|
||||||
|
margin-top:1.5em;
|
||||||
|
}
|
||||||
|
.datetime-panel span.label {
|
||||||
|
float:none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card.sme-error {
|
||||||
|
margin-top:1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.datetime-set-ntp {
|
||||||
|
margin-left:1.9rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.action {
|
||||||
|
margin-top:1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode .label {
|
||||||
|
color:black;
|
||||||
|
background-color:lightgrey;
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,60 @@
|
|||||||
|
div#swt_theme select {
|
||||||
|
width: 55%;
|
||||||
|
}
|
||||||
|
.main-header {
|
||||||
|
position: relative;
|
||||||
|
padding-right: 7.5px;
|
||||||
|
padding-left: 7.5px;
|
||||||
|
}
|
||||||
|
hr.sme-copyrightbar {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.layout-boxed {
|
||||||
|
background: url("/smanager/dist/img/boxed-bg.jpg") repeat fixed;
|
||||||
|
}
|
||||||
|
#h2e11 img {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
#h2l1, #h2l2 {
|
||||||
|
margin-left: 2px;
|
||||||
|
}
|
||||||
|
#h2l2 {
|
||||||
|
height: 4px;
|
||||||
|
}
|
||||||
|
#swttheme {
|
||||||
|
padding-left: 0.5rem;
|
||||||
|
padding-top: 0.3rem;
|
||||||
|
}
|
||||||
|
#swtsize {
|
||||||
|
padding-left: 0.5rem;
|
||||||
|
padding-top: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
#darkmodeswt {
|
||||||
|
padding-left: 0.5rem;
|
||||||
|
padding-top: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sm2-footer {
|
||||||
|
width:100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode container-fluid {
|
||||||
|
background-color:lightblue;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode div .mb-2 {
|
||||||
|
background-color:#454d55;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode .navbar-white {
|
||||||
|
background-image: linear-gradient(to right, lightgrey,#454d55);
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode .active {
|
||||||
|
background-color:lightgrey;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode .button {
|
||||||
|
background:darkgrey;
|
||||||
|
}
|
@ -0,0 +1,98 @@
|
|||||||
|
.navbar-white {
|
||||||
|
background-image: linear-gradient(to right, #edf9e5,#bee6a2);
|
||||||
|
}
|
||||||
|
div.section {
|
||||||
|
color:blue;
|
||||||
|
}
|
||||||
|
div.mb-2 {
|
||||||
|
background-color:#98d36e;
|
||||||
|
}
|
||||||
|
.sidebar a.accent {
|
||||||
|
color: brown;
|
||||||
|
}
|
||||||
|
#h2e12 img {
|
||||||
|
width:100%;
|
||||||
|
}
|
||||||
|
#h2e11 img {
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
#h2l2 {
|
||||||
|
height:34px;
|
||||||
|
}
|
||||||
|
p.menu-title {
|
||||||
|
margin-top:0;
|
||||||
|
margin-bottom:0;
|
||||||
|
}
|
||||||
|
.menu-title {
|
||||||
|
color:green!important;
|
||||||
|
font-weight:bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-title {
|
||||||
|
color:blue!important;
|
||||||
|
}
|
||||||
|
|
||||||
|
a#toguser.menu-title {
|
||||||
|
color:blue!important;
|
||||||
|
font-weight:normal;
|
||||||
|
}
|
||||||
|
.brand-image {
|
||||||
|
margin-bottom:1.75rem!important;
|
||||||
|
}
|
||||||
|
div.menu-cell a {
|
||||||
|
font-size:inherit!important;
|
||||||
|
margin-top:0.1em!important;
|
||||||
|
margin-bottom:0.1em!important;
|
||||||
|
line-height:1em!important;
|
||||||
|
padding-top:0.1rem;
|
||||||
|
padding-bottom:0.1rem;
|
||||||
|
margin-left:0.2rem;
|
||||||
|
padding-right:0.05rem;
|
||||||
|
width: calc(250px - 0.5rem * 3)!important;
|
||||||
|
}
|
||||||
|
.nav {
|
||||||
|
margin-bottom:0.7rem;
|
||||||
|
}
|
||||||
|
.brand-link {
|
||||||
|
margin-bottom:4rem;
|
||||||
|
}
|
||||||
|
td a:link, td a:visited {
|
||||||
|
color:blue;
|
||||||
|
}
|
||||||
|
td a:hover {
|
||||||
|
color:red;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode .main-sidebar {
|
||||||
|
background-color:#343a40;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode [class*="sidebar-light-"] .sidebar a {
|
||||||
|
color:inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode .login-page input[type="text"] {
|
||||||
|
background-color:#343a40;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode input:-webkit-autofill,
|
||||||
|
.dark-mode input:-webkit-autofill,
|
||||||
|
.dark-mode input:-webkit-autofill:hover,
|
||||||
|
.dark-mode input:-webkit-autofill:focus,
|
||||||
|
.dark-mode textarea:-webkit-autofill,
|
||||||
|
.dark-mode textarea:-webkit-autofill:hover,
|
||||||
|
.dark-mode textarea:-webkit-autofill:focus,
|
||||||
|
.dark-mode select:-webkit-autofill,
|
||||||
|
.dark-mode select:-webkit-autofill:hover,
|
||||||
|
.dark-mode select:-webkit-autofill:focus {
|
||||||
|
-webkit-text-fill-color:#343a40;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-sm .nav-link {
|
||||||
|
padding: 0;
|
||||||
|
padding-left:10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
Before Width: | Height: | Size: 2.9 KiB |
12194
root/usr/share/smanager/themes/AdminLTE/public/dist/css/alt/adminlte.components.css
vendored
Normal file
1
root/usr/share/smanager/themes/AdminLTE/public/dist/css/alt/adminlte.components.css.map
vendored
Normal file
8
root/usr/share/smanager/themes/AdminLTE/public/dist/css/alt/adminlte.components.min.css
vendored
Normal file
1
root/usr/share/smanager/themes/AdminLTE/public/dist/css/alt/adminlte.components.min.css.map
vendored
Normal file
29991
root/usr/share/smanager/themes/AdminLTE/public/dist/css/alt/adminlte.core.css
vendored
Normal file
1
root/usr/share/smanager/themes/AdminLTE/public/dist/css/alt/adminlte.core.css.map
vendored
Normal file
13
root/usr/share/smanager/themes/AdminLTE/public/dist/css/alt/adminlte.core.min.css
vendored
Normal file
1
root/usr/share/smanager/themes/AdminLTE/public/dist/css/alt/adminlte.core.min.css.map
vendored
Normal file
1756
root/usr/share/smanager/themes/AdminLTE/public/dist/css/alt/adminlte.extra-components.css
vendored
Normal file
36864
root/usr/share/smanager/themes/AdminLTE/public/dist/css/alt/adminlte.light.css
vendored
Normal file
1
root/usr/share/smanager/themes/AdminLTE/public/dist/css/alt/adminlte.light.css.map
vendored
Normal file
18
root/usr/share/smanager/themes/AdminLTE/public/dist/css/alt/adminlte.light.min.css
vendored
Normal file
1
root/usr/share/smanager/themes/AdminLTE/public/dist/css/alt/adminlte.light.min.css.map
vendored
Normal file
960
root/usr/share/smanager/themes/AdminLTE/public/dist/css/alt/adminlte.pages.css
vendored
Normal file
@ -0,0 +1,960 @@
|
|||||||
|
/*!
|
||||||
|
* AdminLTE v3.2.0
|
||||||
|
* Only Pages
|
||||||
|
* Author: Colorlib
|
||||||
|
* Website: AdminLTE.io <https://adminlte.io>
|
||||||
|
* License: Open source - MIT <https://opensource.org/licenses/MIT>
|
||||||
|
*/
|
||||||
|
.close, .mailbox-attachment-close {
|
||||||
|
float: right;
|
||||||
|
font-size: 1.5rem;
|
||||||
|
font-weight: 700;
|
||||||
|
line-height: 1;
|
||||||
|
color: #000;
|
||||||
|
text-shadow: 0 1px 0 #fff;
|
||||||
|
opacity: .5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.close:hover, .mailbox-attachment-close:hover {
|
||||||
|
color: #000;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.close:not(:disabled):not(.disabled):hover, .mailbox-attachment-close:not(:disabled):not(.disabled):hover, .close:not(:disabled):not(.disabled):focus, .mailbox-attachment-close:not(:disabled):not(.disabled):focus {
|
||||||
|
opacity: .75;
|
||||||
|
}
|
||||||
|
|
||||||
|
button.close, button.mailbox-attachment-close {
|
||||||
|
padding: 0;
|
||||||
|
background-color: transparent;
|
||||||
|
border: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
a.close.disabled, a.disabled.mailbox-attachment-close {
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
@-webkit-keyframes flipInX {
|
||||||
|
0% {
|
||||||
|
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
|
||||||
|
transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
|
||||||
|
transition-timing-function: ease-in;
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
40% {
|
||||||
|
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
|
||||||
|
transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
|
||||||
|
transition-timing-function: ease-in;
|
||||||
|
}
|
||||||
|
60% {
|
||||||
|
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
|
||||||
|
transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
80% {
|
||||||
|
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
|
||||||
|
transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
-webkit-transform: perspective(400px);
|
||||||
|
transform: perspective(400px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes flipInX {
|
||||||
|
0% {
|
||||||
|
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
|
||||||
|
transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
|
||||||
|
transition-timing-function: ease-in;
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
40% {
|
||||||
|
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
|
||||||
|
transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
|
||||||
|
transition-timing-function: ease-in;
|
||||||
|
}
|
||||||
|
60% {
|
||||||
|
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
|
||||||
|
transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
80% {
|
||||||
|
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
|
||||||
|
transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
-webkit-transform: perspective(400px);
|
||||||
|
transform: perspective(400px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@-webkit-keyframes fadeIn {
|
||||||
|
from {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
to {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes fadeIn {
|
||||||
|
from {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
to {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@-webkit-keyframes fadeOut {
|
||||||
|
from {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
to {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes fadeOut {
|
||||||
|
from {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
to {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@-webkit-keyframes shake {
|
||||||
|
0% {
|
||||||
|
-webkit-transform: translate(2px, 1px) rotate(0deg);
|
||||||
|
transform: translate(2px, 1px) rotate(0deg);
|
||||||
|
}
|
||||||
|
10% {
|
||||||
|
-webkit-transform: translate(-1px, -2px) rotate(-2deg);
|
||||||
|
transform: translate(-1px, -2px) rotate(-2deg);
|
||||||
|
}
|
||||||
|
20% {
|
||||||
|
-webkit-transform: translate(-3px, 0) rotate(3deg);
|
||||||
|
transform: translate(-3px, 0) rotate(3deg);
|
||||||
|
}
|
||||||
|
30% {
|
||||||
|
-webkit-transform: translate(0, 2px) rotate(0deg);
|
||||||
|
transform: translate(0, 2px) rotate(0deg);
|
||||||
|
}
|
||||||
|
40% {
|
||||||
|
-webkit-transform: translate(1px, -1px) rotate(1deg);
|
||||||
|
transform: translate(1px, -1px) rotate(1deg);
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
-webkit-transform: translate(-1px, 2px) rotate(-1deg);
|
||||||
|
transform: translate(-1px, 2px) rotate(-1deg);
|
||||||
|
}
|
||||||
|
60% {
|
||||||
|
-webkit-transform: translate(-3px, 1px) rotate(0deg);
|
||||||
|
transform: translate(-3px, 1px) rotate(0deg);
|
||||||
|
}
|
||||||
|
70% {
|
||||||
|
-webkit-transform: translate(2px, 1px) rotate(-2deg);
|
||||||
|
transform: translate(2px, 1px) rotate(-2deg);
|
||||||
|
}
|
||||||
|
80% {
|
||||||
|
-webkit-transform: translate(-1px, -1px) rotate(4deg);
|
||||||
|
transform: translate(-1px, -1px) rotate(4deg);
|
||||||
|
}
|
||||||
|
90% {
|
||||||
|
-webkit-transform: translate(2px, 2px) rotate(0deg);
|
||||||
|
transform: translate(2px, 2px) rotate(0deg);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
-webkit-transform: translate(1px, -2px) rotate(-1deg);
|
||||||
|
transform: translate(1px, -2px) rotate(-1deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes shake {
|
||||||
|
0% {
|
||||||
|
-webkit-transform: translate(2px, 1px) rotate(0deg);
|
||||||
|
transform: translate(2px, 1px) rotate(0deg);
|
||||||
|
}
|
||||||
|
10% {
|
||||||
|
-webkit-transform: translate(-1px, -2px) rotate(-2deg);
|
||||||
|
transform: translate(-1px, -2px) rotate(-2deg);
|
||||||
|
}
|
||||||
|
20% {
|
||||||
|
-webkit-transform: translate(-3px, 0) rotate(3deg);
|
||||||
|
transform: translate(-3px, 0) rotate(3deg);
|
||||||
|
}
|
||||||
|
30% {
|
||||||
|
-webkit-transform: translate(0, 2px) rotate(0deg);
|
||||||
|
transform: translate(0, 2px) rotate(0deg);
|
||||||
|
}
|
||||||
|
40% {
|
||||||
|
-webkit-transform: translate(1px, -1px) rotate(1deg);
|
||||||
|
transform: translate(1px, -1px) rotate(1deg);
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
-webkit-transform: translate(-1px, 2px) rotate(-1deg);
|
||||||
|
transform: translate(-1px, 2px) rotate(-1deg);
|
||||||
|
}
|
||||||
|
60% {
|
||||||
|
-webkit-transform: translate(-3px, 1px) rotate(0deg);
|
||||||
|
transform: translate(-3px, 1px) rotate(0deg);
|
||||||
|
}
|
||||||
|
70% {
|
||||||
|
-webkit-transform: translate(2px, 1px) rotate(-2deg);
|
||||||
|
transform: translate(2px, 1px) rotate(-2deg);
|
||||||
|
}
|
||||||
|
80% {
|
||||||
|
-webkit-transform: translate(-1px, -1px) rotate(4deg);
|
||||||
|
transform: translate(-1px, -1px) rotate(4deg);
|
||||||
|
}
|
||||||
|
90% {
|
||||||
|
-webkit-transform: translate(2px, 2px) rotate(0deg);
|
||||||
|
transform: translate(2px, 2px) rotate(0deg);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
-webkit-transform: translate(1px, -2px) rotate(-1deg);
|
||||||
|
transform: translate(1px, -2px) rotate(-1deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@-webkit-keyframes wobble {
|
||||||
|
0% {
|
||||||
|
-webkit-transform: none;
|
||||||
|
transform: none;
|
||||||
|
}
|
||||||
|
15% {
|
||||||
|
-webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
|
||||||
|
transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
|
||||||
|
}
|
||||||
|
30% {
|
||||||
|
-webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
|
||||||
|
transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
|
||||||
|
}
|
||||||
|
45% {
|
||||||
|
-webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
|
||||||
|
transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
|
||||||
|
}
|
||||||
|
60% {
|
||||||
|
-webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
|
||||||
|
transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
|
||||||
|
}
|
||||||
|
75% {
|
||||||
|
-webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
|
||||||
|
transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
-webkit-transform: none;
|
||||||
|
transform: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes wobble {
|
||||||
|
0% {
|
||||||
|
-webkit-transform: none;
|
||||||
|
transform: none;
|
||||||
|
}
|
||||||
|
15% {
|
||||||
|
-webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
|
||||||
|
transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
|
||||||
|
}
|
||||||
|
30% {
|
||||||
|
-webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
|
||||||
|
transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
|
||||||
|
}
|
||||||
|
45% {
|
||||||
|
-webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
|
||||||
|
transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
|
||||||
|
}
|
||||||
|
60% {
|
||||||
|
-webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
|
||||||
|
transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
|
||||||
|
}
|
||||||
|
75% {
|
||||||
|
-webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
|
||||||
|
transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
-webkit-transform: none;
|
||||||
|
transform: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.mailbox-messages > .table {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mailbox-controls {
|
||||||
|
padding: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mailbox-controls.with-border {
|
||||||
|
border-bottom: 1px solid rgba(0, 0, 0, 0.125);
|
||||||
|
}
|
||||||
|
|
||||||
|
.mailbox-read-info {
|
||||||
|
border-bottom: 1px solid rgba(0, 0, 0, 0.125);
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mailbox-read-info h3 {
|
||||||
|
font-size: 20px;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mailbox-read-info h5 {
|
||||||
|
margin: 0;
|
||||||
|
padding: 5px 0 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mailbox-read-time {
|
||||||
|
color: #999;
|
||||||
|
font-size: 13px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mailbox-read-message {
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mailbox-attachments {
|
||||||
|
padding-left: 0;
|
||||||
|
list-style: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mailbox-attachments li {
|
||||||
|
border: 1px solid #eee;
|
||||||
|
float: left;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
margin-right: 10px;
|
||||||
|
width: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mailbox-attachment-name {
|
||||||
|
color: #666;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mailbox-attachment-icon,
|
||||||
|
.mailbox-attachment-info,
|
||||||
|
.mailbox-attachment-size {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mailbox-attachment-info {
|
||||||
|
background-color: #f8f9fa;
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mailbox-attachment-size {
|
||||||
|
color: #999;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mailbox-attachment-size > span {
|
||||||
|
display: inline-block;
|
||||||
|
padding-top: .75rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mailbox-attachment-icon {
|
||||||
|
color: #666;
|
||||||
|
font-size: 65px;
|
||||||
|
max-height: 132.5px;
|
||||||
|
padding: 20px 10px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mailbox-attachment-icon.has-img {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mailbox-attachment-icon.has-img > img {
|
||||||
|
height: auto;
|
||||||
|
max-width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lockscreen {
|
||||||
|
background-color: #e9ecef;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lockscreen .lockscreen-name {
|
||||||
|
font-weight: 600;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lockscreen-logo {
|
||||||
|
font-size: 35px;
|
||||||
|
font-weight: 300;
|
||||||
|
margin-bottom: 25px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lockscreen-logo a {
|
||||||
|
color: #495057;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lockscreen-wrapper {
|
||||||
|
margin: 0 auto;
|
||||||
|
margin-top: 10%;
|
||||||
|
max-width: 400px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lockscreen-item {
|
||||||
|
border-radius: 4px;
|
||||||
|
background-color: #fff;
|
||||||
|
margin: 10px auto 30px;
|
||||||
|
padding: 0;
|
||||||
|
position: relative;
|
||||||
|
width: 290px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lockscreen-image {
|
||||||
|
border-radius: 50%;
|
||||||
|
background-color: #fff;
|
||||||
|
left: -10px;
|
||||||
|
padding: 5px;
|
||||||
|
position: absolute;
|
||||||
|
top: -25px;
|
||||||
|
z-index: 10;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lockscreen-image > img {
|
||||||
|
border-radius: 50%;
|
||||||
|
height: 70px;
|
||||||
|
width: 70px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lockscreen-credentials {
|
||||||
|
margin-left: 70px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lockscreen-credentials .form-control {
|
||||||
|
border: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lockscreen-credentials .btn {
|
||||||
|
background-color: #fff;
|
||||||
|
border: 0;
|
||||||
|
padding: 0 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lockscreen-footer {
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode .lockscreen-item {
|
||||||
|
background-color: #343a40;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode .lockscreen-logo a {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode .lockscreen-credentials .btn {
|
||||||
|
background-color: #343a40;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode .lockscreen-image {
|
||||||
|
background-color: #6c757d;
|
||||||
|
}
|
||||||
|
|
||||||
|
.login-logo,
|
||||||
|
.register-logo {
|
||||||
|
font-size: 2.1rem;
|
||||||
|
font-weight: 300;
|
||||||
|
margin-bottom: .9rem;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.login-logo a,
|
||||||
|
.register-logo a {
|
||||||
|
color: #495057;
|
||||||
|
}
|
||||||
|
|
||||||
|
.login-page,
|
||||||
|
.register-page {
|
||||||
|
-ms-flex-align: center;
|
||||||
|
align-items: center;
|
||||||
|
background-color: #e9ecef;
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
|
-ms-flex-direction: column;
|
||||||
|
flex-direction: column;
|
||||||
|
height: 100vh;
|
||||||
|
-ms-flex-pack: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.login-box,
|
||||||
|
.register-box {
|
||||||
|
width: 360px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 576px) {
|
||||||
|
.login-box,
|
||||||
|
.register-box {
|
||||||
|
margin-top: .5rem;
|
||||||
|
width: 90%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.login-box .card,
|
||||||
|
.register-box .card {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.login-card-body,
|
||||||
|
.register-card-body {
|
||||||
|
background-color: #fff;
|
||||||
|
border-top: 0;
|
||||||
|
color: #666;
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.login-card-body .input-group .form-control,
|
||||||
|
.register-card-body .input-group .form-control {
|
||||||
|
border-right: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.login-card-body .input-group .form-control:focus,
|
||||||
|
.register-card-body .input-group .form-control:focus {
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.login-card-body .input-group .form-control:focus ~ .input-group-prepend .input-group-text,
|
||||||
|
.login-card-body .input-group .form-control:focus ~ .input-group-append .input-group-text,
|
||||||
|
.register-card-body .input-group .form-control:focus ~ .input-group-prepend .input-group-text,
|
||||||
|
.register-card-body .input-group .form-control:focus ~ .input-group-append .input-group-text {
|
||||||
|
border-color: #80bdff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.login-card-body .input-group .form-control.is-valid:focus,
|
||||||
|
.register-card-body .input-group .form-control.is-valid:focus {
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.login-card-body .input-group .form-control.is-valid ~ .input-group-prepend .input-group-text,
|
||||||
|
.login-card-body .input-group .form-control.is-valid ~ .input-group-append .input-group-text,
|
||||||
|
.register-card-body .input-group .form-control.is-valid ~ .input-group-prepend .input-group-text,
|
||||||
|
.register-card-body .input-group .form-control.is-valid ~ .input-group-append .input-group-text {
|
||||||
|
border-color: #28a745;
|
||||||
|
}
|
||||||
|
|
||||||
|
.login-card-body .input-group .form-control.is-invalid:focus,
|
||||||
|
.register-card-body .input-group .form-control.is-invalid:focus {
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.login-card-body .input-group .form-control.is-invalid ~ .input-group-append .input-group-text,
|
||||||
|
.register-card-body .input-group .form-control.is-invalid ~ .input-group-append .input-group-text {
|
||||||
|
border-color: #dc3545;
|
||||||
|
}
|
||||||
|
|
||||||
|
.login-card-body .input-group .input-group-text,
|
||||||
|
.register-card-body .input-group .input-group-text {
|
||||||
|
background-color: transparent;
|
||||||
|
border-bottom-right-radius: 0.25rem;
|
||||||
|
border-left: 0;
|
||||||
|
border-top-right-radius: 0.25rem;
|
||||||
|
color: #777;
|
||||||
|
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
.login-box-msg,
|
||||||
|
.register-box-msg {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0 20px 20px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.social-auth-links {
|
||||||
|
margin: 10px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode .login-card-body,
|
||||||
|
.dark-mode .register-card-body {
|
||||||
|
background-color: #343a40;
|
||||||
|
border-color: #6c757d;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode .login-logo a,
|
||||||
|
.dark-mode .register-logo a {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.error-page {
|
||||||
|
margin: 20px auto 0;
|
||||||
|
width: 600px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 767.98px) {
|
||||||
|
.error-page {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.error-page > .headline {
|
||||||
|
float: left;
|
||||||
|
font-size: 100px;
|
||||||
|
font-weight: 300;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 767.98px) {
|
||||||
|
.error-page > .headline {
|
||||||
|
float: none;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.error-page > .error-content {
|
||||||
|
display: block;
|
||||||
|
margin-left: 190px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 767.98px) {
|
||||||
|
.error-page > .error-content {
|
||||||
|
margin-left: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.error-page > .error-content > h3 {
|
||||||
|
font-size: 25px;
|
||||||
|
font-weight: 300;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 767.98px) {
|
||||||
|
.error-page > .error-content > h3 {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.invoice {
|
||||||
|
background-color: #fff;
|
||||||
|
border: 1px solid rgba(0, 0, 0, 0.125);
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.invoice-title {
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode .invoice {
|
||||||
|
background-color: #343a40;
|
||||||
|
}
|
||||||
|
|
||||||
|
.profile-user-img {
|
||||||
|
border: 3px solid #adb5bd;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 3px;
|
||||||
|
width: 100px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.profile-username {
|
||||||
|
font-size: 21px;
|
||||||
|
margin-top: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.post {
|
||||||
|
border-bottom: 1px solid #adb5bd;
|
||||||
|
color: #666;
|
||||||
|
margin-bottom: 15px;
|
||||||
|
padding-bottom: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.post:last-of-type {
|
||||||
|
border-bottom: 0;
|
||||||
|
margin-bottom: 0;
|
||||||
|
padding-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.post .user-block {
|
||||||
|
margin-bottom: 15px;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.post .row {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode .post {
|
||||||
|
color: #fff;
|
||||||
|
border-color: #6c757d;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-image {
|
||||||
|
max-width: 100%;
|
||||||
|
height: auto;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-image-thumbs {
|
||||||
|
-ms-flex-align: stretch;
|
||||||
|
align-items: stretch;
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
|
margin-top: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-image-thumb {
|
||||||
|
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.075);
|
||||||
|
border-radius: 0.25rem;
|
||||||
|
background-color: #fff;
|
||||||
|
border: 1px solid #dee2e6;
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
|
margin-right: 1rem;
|
||||||
|
max-width: 7rem;
|
||||||
|
padding: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-image-thumb img {
|
||||||
|
max-width: 100%;
|
||||||
|
height: auto;
|
||||||
|
-ms-flex-item-align: center;
|
||||||
|
align-self: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-image-thumb:hover {
|
||||||
|
opacity: .5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-share a {
|
||||||
|
margin-right: .5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.projects td {
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
|
||||||
|
.projects .list-inline {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.projects img.table-avatar,
|
||||||
|
.projects .table-avatar img {
|
||||||
|
border-radius: 50%;
|
||||||
|
display: inline;
|
||||||
|
width: 2.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.projects .project-state {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
body.iframe-mode .main-sidebar {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
body.iframe-mode .content-wrapper {
|
||||||
|
margin-left: 0 !important;
|
||||||
|
margin-top: 0 !important;
|
||||||
|
padding-bottom: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
body.iframe-mode .main-header,
|
||||||
|
body.iframe-mode .main-footer {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
body.iframe-mode-fullscreen {
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
body.iframe-mode-fullscreen.layout-navbar-fixed .wrapper .content-wrapper {
|
||||||
|
margin-top: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-wrapper {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-wrapper.iframe-mode .btn-iframe-close {
|
||||||
|
color: #dc3545;
|
||||||
|
position: absolute;
|
||||||
|
line-height: 1;
|
||||||
|
right: .125rem;
|
||||||
|
top: .125rem;
|
||||||
|
z-index: 10;
|
||||||
|
visibility: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-wrapper.iframe-mode .btn-iframe-close:hover, .content-wrapper.iframe-mode .btn-iframe-close:focus {
|
||||||
|
-webkit-animation-name: fadeIn;
|
||||||
|
animation-name: fadeIn;
|
||||||
|
-webkit-animation-duration: 0.3s;
|
||||||
|
animation-duration: 0.3s;
|
||||||
|
-webkit-animation-fill-mode: both;
|
||||||
|
animation-fill-mode: both;
|
||||||
|
visibility: visible;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (hover: none) and (pointer: coarse) {
|
||||||
|
.content-wrapper.iframe-mode .btn-iframe-close {
|
||||||
|
visibility: visible;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-wrapper.iframe-mode .navbar-nav {
|
||||||
|
overflow-y: auto;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-wrapper.iframe-mode .navbar-nav .nav-link {
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-wrapper.iframe-mode .navbar-nav .nav-item {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-wrapper.iframe-mode .navbar-nav .nav-item:hover .btn-iframe-close, .content-wrapper.iframe-mode .navbar-nav .nav-item:focus .btn-iframe-close {
|
||||||
|
-webkit-animation-name: fadeIn;
|
||||||
|
animation-name: fadeIn;
|
||||||
|
-webkit-animation-duration: 0.3s;
|
||||||
|
animation-duration: 0.3s;
|
||||||
|
-webkit-animation-fill-mode: both;
|
||||||
|
animation-fill-mode: both;
|
||||||
|
visibility: visible;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (hover: none) and (pointer: coarse) {
|
||||||
|
.content-wrapper.iframe-mode .navbar-nav .nav-item:hover .btn-iframe-close, .content-wrapper.iframe-mode .navbar-nav .nav-item:focus .btn-iframe-close {
|
||||||
|
visibility: visible;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-wrapper.iframe-mode .tab-content {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-wrapper.iframe-mode .tab-pane + .tab-empty {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-wrapper.iframe-mode .tab-empty {
|
||||||
|
width: 100%;
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
|
-ms-flex-pack: center;
|
||||||
|
justify-content: center;
|
||||||
|
-ms-flex-align: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-wrapper.iframe-mode .tab-loading {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
display: none;
|
||||||
|
background-color: #f4f6f9;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-wrapper.iframe-mode .tab-loading > div {
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
|
-ms-flex-pack: center;
|
||||||
|
justify-content: center;
|
||||||
|
-ms-flex-align: center;
|
||||||
|
align-items: center;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-wrapper.iframe-mode iframe {
|
||||||
|
border: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
margin-bottom: -8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-wrapper.iframe-mode iframe .content-wrapper {
|
||||||
|
padding-bottom: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
body.iframe-mode-fullscreen .content-wrapper.iframe-mode {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
margin-left: 0 !important;
|
||||||
|
height: 100%;
|
||||||
|
min-height: 100%;
|
||||||
|
z-index: 1048;
|
||||||
|
}
|
||||||
|
|
||||||
|
.permanent-btn-iframe-close .btn-iframe-close {
|
||||||
|
-webkit-animation: none !important;
|
||||||
|
animation: none !important;
|
||||||
|
visibility: visible !important;
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-mode .content-wrapper.iframe-mode .tab-loading {
|
||||||
|
background-color: #343a40;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-wrapper.kanban {
|
||||||
|
height: 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-wrapper.kanban .content {
|
||||||
|
height: 100%;
|
||||||
|
overflow-x: auto;
|
||||||
|
overflow-y: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-wrapper.kanban .content .container,
|
||||||
|
.content-wrapper.kanban .content .container-fluid {
|
||||||
|
width: -webkit-max-content;
|
||||||
|
width: -moz-max-content;
|
||||||
|
width: max-content;
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
|
-ms-flex-align: stretch;
|
||||||
|
align-items: stretch;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-wrapper.kanban .content-header + .content {
|
||||||
|
height: calc(100% - ((2 * 15px) + (1.8rem * 1.2)));
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-wrapper.kanban .card .card-body {
|
||||||
|
padding: .5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-wrapper.kanban .card.card-row {
|
||||||
|
width: 340px;
|
||||||
|
display: inline-block;
|
||||||
|
margin: 0 .5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-wrapper.kanban .card.card-row:first-child {
|
||||||
|
margin-left: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-wrapper.kanban .card.card-row .card-body {
|
||||||
|
height: calc(100% - (12px + (1.8rem * 1.2) + .5rem));
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-wrapper.kanban .card.card-row .card:last-child {
|
||||||
|
margin-bottom: 0;
|
||||||
|
border-bottom-width: 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-wrapper.kanban .card.card-row .card .card-header {
|
||||||
|
padding: .5rem .75rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-wrapper.kanban .card.card-row .card .card-body {
|
||||||
|
padding: .75rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-wrapper.kanban .btn-tool.btn-link {
|
||||||
|
text-decoration: underline;
|
||||||
|
padding-left: 0;
|
||||||
|
padding-right: 0;
|
||||||
|
}
|
||||||
|
/*# sourceMappingURL=adminlte.pages.css.map */
|
1
root/usr/share/smanager/themes/AdminLTE/public/dist/css/alt/adminlte.pages.css.map
vendored
Normal file
8
root/usr/share/smanager/themes/AdminLTE/public/dist/css/alt/adminlte.pages.min.css
vendored
Normal file
1
root/usr/share/smanager/themes/AdminLTE/public/dist/css/alt/adminlte.pages.min.css.map
vendored
Normal file
9146
root/usr/share/smanager/themes/AdminLTE/public/dist/css/alt/adminlte.plugins.css
vendored
Normal file
1
root/usr/share/smanager/themes/AdminLTE/public/dist/css/alt/adminlte.plugins.css.map
vendored
Normal file
8
root/usr/share/smanager/themes/AdminLTE/public/dist/css/alt/adminlte.plugins.min.css
vendored
Normal file
1
root/usr/share/smanager/themes/AdminLTE/public/dist/css/alt/adminlte.plugins.min.css.map
vendored
Normal file
Before Width: | Height: | Size: 2.6 KiB After Width: | Height: | Size: 2.6 KiB |
Before Width: | Height: | Size: 7.9 KiB After Width: | Height: | Size: 7.9 KiB |
Before Width: | Height: | Size: 8.1 KiB After Width: | Height: | Size: 8.1 KiB |
Before Width: | Height: | Size: 9.0 KiB After Width: | Height: | Size: 9.0 KiB |
Before Width: | Height: | Size: 13 KiB After Width: | Height: | Size: 13 KiB |
Before Width: | Height: | Size: 7.4 KiB After Width: | Height: | Size: 7.4 KiB |
Before Width: | Height: | Size: 121 KiB After Width: | Height: | Size: 121 KiB |
Before Width: | Height: | Size: 43 KiB After Width: | Height: | Size: 43 KiB |
Before Width: | Height: | Size: 2.1 KiB After Width: | Height: | Size: 2.1 KiB |
Before Width: | Height: | Size: 1.5 KiB After Width: | Height: | Size: 1.5 KiB |
Before Width: | Height: | Size: 1.5 KiB After Width: | Height: | Size: 1.5 KiB |
Before Width: | Height: | Size: 1.9 KiB After Width: | Height: | Size: 1.9 KiB |
Before Width: | Height: | Size: 1.2 KiB After Width: | Height: | Size: 1.2 KiB |
Before Width: | Height: | Size: 1.0 KiB After Width: | Height: | Size: 1.0 KiB |
Before Width: | Height: | Size: 339 B After Width: | Height: | Size: 339 B |
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 647 KiB After Width: | Height: | Size: 647 KiB |
Before Width: | Height: | Size: 413 KiB After Width: | Height: | Size: 413 KiB |
Before Width: | Height: | Size: 362 KiB After Width: | Height: | Size: 362 KiB |
Before Width: | Height: | Size: 1.1 MiB After Width: | Height: | Size: 1.1 MiB |
Before Width: | Height: | Size: 44 KiB After Width: | Height: | Size: 44 KiB |
Before Width: | Height: | Size: 32 KiB After Width: | Height: | Size: 32 KiB |
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 20 KiB |
Before Width: | Height: | Size: 26 KiB After Width: | Height: | Size: 26 KiB |
Before Width: | Height: | Size: 31 KiB After Width: | Height: | Size: 31 KiB |
Before Width: | Height: | Size: 2.7 KiB After Width: | Height: | Size: 2.7 KiB |
Before Width: | Height: | Size: 6.7 KiB After Width: | Height: | Size: 6.7 KiB |
Before Width: | Height: | Size: 3.3 KiB After Width: | Height: | Size: 3.3 KiB |
Before Width: | Height: | Size: 3.4 KiB After Width: | Height: | Size: 3.4 KiB |
Before Width: | Height: | Size: 6.3 KiB After Width: | Height: | Size: 6.3 KiB |
Before Width: | Height: | Size: 4.2 KiB After Width: | Height: | Size: 4.2 KiB |
Before Width: | Height: | Size: 6.2 KiB After Width: | Height: | Size: 6.2 KiB |
Before Width: | Height: | Size: 4.9 KiB After Width: | Height: | Size: 4.9 KiB |
57
root/usr/share/smanager/themes/AdminLTE/public/dist/js/.eslintrc.json
vendored
Normal file
@ -0,0 +1,57 @@
|
|||||||
|
{
|
||||||
|
"root": true,
|
||||||
|
"parserOptions": {
|
||||||
|
"ecmaVersion": 5,
|
||||||
|
"sourceType": "script"
|
||||||
|
},
|
||||||
|
"env": {
|
||||||
|
"jquery": true
|
||||||
|
},
|
||||||
|
"extends": [
|
||||||
|
"plugin:unicorn/recommended",
|
||||||
|
"xo",
|
||||||
|
"xo/browser"
|
||||||
|
],
|
||||||
|
"rules": {
|
||||||
|
"capitalized-comments": "off",
|
||||||
|
"comma-dangle": [
|
||||||
|
"error",
|
||||||
|
"never"
|
||||||
|
],
|
||||||
|
"indent": [
|
||||||
|
"error",
|
||||||
|
2,
|
||||||
|
{
|
||||||
|
"MemberExpression": "off",
|
||||||
|
"SwitchCase": 1
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"multiline-ternary": [
|
||||||
|
"error",
|
||||||
|
"always-multiline"
|
||||||
|
],
|
||||||
|
"no-var": "off",
|
||||||
|
"object-curly-spacing": [
|
||||||
|
"error",
|
||||||
|
"always"
|
||||||
|
],
|
||||||
|
"object-shorthand": "off",
|
||||||
|
"prefer-arrow-callback": "off",
|
||||||
|
"semi": [
|
||||||
|
"error",
|
||||||
|
"never"
|
||||||
|
],
|
||||||
|
"strict": "error",
|
||||||
|
"unicorn/no-array-for-each": "off",
|
||||||
|
"unicorn/no-for-loop": "off",
|
||||||
|
"unicorn/no-null": "off",
|
||||||
|
"unicorn/numeric-separators-style": "off",
|
||||||
|
"unicorn/prefer-dataset": "off",
|
||||||
|
"unicorn/prefer-includes": "off",
|
||||||
|
"unicorn/prefer-module": "off",
|
||||||
|
"unicorn/prefer-node-append": "off",
|
||||||
|
"unicorn/prefer-query-selector": "off",
|
||||||
|
"unicorn/prefer-spread": "off",
|
||||||
|
"unicorn/prevent-abbreviations": "off"
|
||||||
|
}
|
||||||
|
}
|
689
root/usr/share/smanager/themes/AdminLTE/public/dist/js/demo.js
vendored
Normal file
@ -0,0 +1,689 @@
|
|||||||
|
/**
|
||||||
|
* AdminLTE Demo Menu
|
||||||
|
* ------------------
|
||||||
|
* You should not use this file in production.
|
||||||
|
* This file is for demo purposes only.
|
||||||
|
*/
|
||||||
|
|
||||||
|
/* eslint-disable camelcase */
|
||||||
|
|
||||||
|
(function ($) {
|
||||||
|
'use strict'
|
||||||
|
|
||||||
|
setTimeout(function () {
|
||||||
|
if (window.___browserSync___ === undefined && Number(localStorage.getItem('AdminLTE:Demo:MessageShowed')) < Date.now()) {
|
||||||
|
localStorage.setItem('AdminLTE:Demo:MessageShowed', (Date.now()) + (15 * 60 * 1000))
|
||||||
|
// eslint-disable-next-line no-alert
|
||||||
|
alert('You load AdminLTE\'s "demo.js", \nthis file is only created for testing purposes!')
|
||||||
|
}
|
||||||
|
}, 1000)
|
||||||
|
|
||||||
|
function capitalizeFirstLetter(string) {
|
||||||
|
return string.charAt(0).toUpperCase() + string.slice(1)
|
||||||
|
}
|
||||||
|
|
||||||
|
function createSkinBlock(colors, callback, noneSelected) {
|
||||||
|
var $block = $('<select />', {
|
||||||
|
class: noneSelected ? 'custom-select mb-3 border-0' : 'custom-select mb-3 text-light border-0 ' + colors[0].replace(/accent-|navbar-/, 'bg-')
|
||||||
|
})
|
||||||
|
|
||||||
|
if (noneSelected) {
|
||||||
|
var $default = $('<option />', {
|
||||||
|
text: 'None Selected'
|
||||||
|
})
|
||||||
|
|
||||||
|
$block.append($default)
|
||||||
|
}
|
||||||
|
|
||||||
|
colors.forEach(function (color) {
|
||||||
|
var $color = $('<option />', {
|
||||||
|
class: (typeof color === 'object' ? color.join(' ') : color).replace('navbar-', 'bg-').replace('accent-', 'bg-'),
|
||||||
|
text: capitalizeFirstLetter((typeof color === 'object' ? color.join(' ') : color).replace(/navbar-|accent-|bg-/, '').replace('-', ' '))
|
||||||
|
})
|
||||||
|
|
||||||
|
$block.append($color)
|
||||||
|
})
|
||||||
|
if (callback) {
|
||||||
|
$block.on('change', callback)
|
||||||
|
}
|
||||||
|
|
||||||
|
return $block
|
||||||
|
}
|
||||||
|
|
||||||
|
var $sidebar = $('.control-sidebar')
|
||||||
|
var $container = $('<div />', {
|
||||||
|
class: 'p-3 control-sidebar-content'
|
||||||
|
})
|
||||||
|
|
||||||
|
$sidebar.append($container)
|
||||||
|
|
||||||
|
// Checkboxes
|
||||||
|
|
||||||
|
$container.append(
|
||||||
|
'<h5>Customize AdminLTE</h5><hr class="mb-2"/>'
|
||||||
|
)
|
||||||
|
|
||||||
|
var $dark_mode_checkbox = $('<input />', {
|
||||||
|
type: 'checkbox',
|
||||||
|
value: 1,
|
||||||
|
checked: $('body').hasClass('dark-mode'),
|
||||||
|
class: 'mr-1'
|
||||||
|
}).on('click', function () {
|
||||||
|
if ($(this).is(':checked')) {
|
||||||
|
$('body').addClass('dark-mode')
|
||||||
|
} else {
|
||||||
|
$('body').removeClass('dark-mode')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
var $dark_mode_container = $('<div />', { class: 'mb-4' }).append($dark_mode_checkbox).append('<span>Dark Mode</span>')
|
||||||
|
$container.append($dark_mode_container)
|
||||||
|
|
||||||
|
$container.append('<h6>Header Options</h6>')
|
||||||
|
var $header_fixed_checkbox = $('<input />', {
|
||||||
|
type: 'checkbox',
|
||||||
|
value: 1,
|
||||||
|
checked: $('body').hasClass('layout-navbar-fixed'),
|
||||||
|
class: 'mr-1'
|
||||||
|
}).on('click', function () {
|
||||||
|
if ($(this).is(':checked')) {
|
||||||
|
$('body').addClass('layout-navbar-fixed')
|
||||||
|
} else {
|
||||||
|
$('body').removeClass('layout-navbar-fixed')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
var $header_fixed_container = $('<div />', { class: 'mb-1' }).append($header_fixed_checkbox).append('<span>Fixed</span>')
|
||||||
|
$container.append($header_fixed_container)
|
||||||
|
|
||||||
|
var $dropdown_legacy_offset_checkbox = $('<input />', {
|
||||||
|
type: 'checkbox',
|
||||||
|
value: 1,
|
||||||
|
checked: $('.main-header').hasClass('dropdown-legacy'),
|
||||||
|
class: 'mr-1'
|
||||||
|
}).on('click', function () {
|
||||||
|
if ($(this).is(':checked')) {
|
||||||
|
$('.main-header').addClass('dropdown-legacy')
|
||||||
|
} else {
|
||||||
|
$('.main-header').removeClass('dropdown-legacy')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
var $dropdown_legacy_offset_container = $('<div />', { class: 'mb-1' }).append($dropdown_legacy_offset_checkbox).append('<span>Dropdown Legacy Offset</span>')
|
||||||
|
$container.append($dropdown_legacy_offset_container)
|
||||||
|
|
||||||
|
var $no_border_checkbox = $('<input />', {
|
||||||
|
type: 'checkbox',
|
||||||
|
value: 1,
|
||||||
|
checked: $('.main-header').hasClass('border-bottom-0'),
|
||||||
|
class: 'mr-1'
|
||||||
|
}).on('click', function () {
|
||||||
|
if ($(this).is(':checked')) {
|
||||||
|
$('.main-header').addClass('border-bottom-0')
|
||||||
|
} else {
|
||||||
|
$('.main-header').removeClass('border-bottom-0')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
var $no_border_container = $('<div />', { class: 'mb-4' }).append($no_border_checkbox).append('<span>No border</span>')
|
||||||
|
$container.append($no_border_container)
|
||||||
|
|
||||||
|
$container.append('<h6>Sidebar Options</h6>')
|
||||||
|
|
||||||
|
var $sidebar_collapsed_checkbox = $('<input />', {
|
||||||
|
type: 'checkbox',
|
||||||
|
value: 1,
|
||||||
|
checked: $('body').hasClass('sidebar-collapse'),
|
||||||
|
class: 'mr-1'
|
||||||
|
}).on('click', function () {
|
||||||
|
if ($(this).is(':checked')) {
|
||||||
|
$('body').addClass('sidebar-collapse')
|
||||||
|
$(window).trigger('resize')
|
||||||
|
} else {
|
||||||
|
$('body').removeClass('sidebar-collapse')
|
||||||
|
$(window).trigger('resize')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
var $sidebar_collapsed_container = $('<div />', { class: 'mb-1' }).append($sidebar_collapsed_checkbox).append('<span>Collapsed</span>')
|
||||||
|
$container.append($sidebar_collapsed_container)
|
||||||
|
|
||||||
|
$(document).on('collapsed.lte.pushmenu', '[data-widget="pushmenu"]', function () {
|
||||||
|
$sidebar_collapsed_checkbox.prop('checked', true)
|
||||||
|
})
|
||||||
|
$(document).on('shown.lte.pushmenu', '[data-widget="pushmenu"]', function () {
|
||||||
|
$sidebar_collapsed_checkbox.prop('checked', false)
|
||||||
|
})
|
||||||
|
|
||||||
|
var $sidebar_fixed_checkbox = $('<input />', {
|
||||||
|
type: 'checkbox',
|
||||||
|
value: 1,
|
||||||
|
checked: $('body').hasClass('layout-fixed'),
|
||||||
|
class: 'mr-1'
|
||||||
|
}).on('click', function () {
|
||||||
|
if ($(this).is(':checked')) {
|
||||||
|
$('body').addClass('layout-fixed')
|
||||||
|
$(window).trigger('resize')
|
||||||
|
} else {
|
||||||
|
$('body').removeClass('layout-fixed')
|
||||||
|
$(window).trigger('resize')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
var $sidebar_fixed_container = $('<div />', { class: 'mb-1' }).append($sidebar_fixed_checkbox).append('<span>Fixed</span>')
|
||||||
|
$container.append($sidebar_fixed_container)
|
||||||
|
|
||||||
|
var $sidebar_mini_checkbox = $('<input />', {
|
||||||
|
type: 'checkbox',
|
||||||
|
value: 1,
|
||||||
|
checked: $('body').hasClass('sidebar-mini'),
|
||||||
|
class: 'mr-1'
|
||||||
|
}).on('click', function () {
|
||||||
|
if ($(this).is(':checked')) {
|
||||||
|
$('body').addClass('sidebar-mini')
|
||||||
|
} else {
|
||||||
|
$('body').removeClass('sidebar-mini')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
var $sidebar_mini_container = $('<div />', { class: 'mb-1' }).append($sidebar_mini_checkbox).append('<span>Sidebar Mini</span>')
|
||||||
|
$container.append($sidebar_mini_container)
|
||||||
|
|
||||||
|
var $sidebar_mini_md_checkbox = $('<input />', {
|
||||||
|
type: 'checkbox',
|
||||||
|
value: 1,
|
||||||
|
checked: $('body').hasClass('sidebar-mini-md'),
|
||||||
|
class: 'mr-1'
|
||||||
|
}).on('click', function () {
|
||||||
|
if ($(this).is(':checked')) {
|
||||||
|
$('body').addClass('sidebar-mini-md')
|
||||||
|
} else {
|
||||||
|
$('body').removeClass('sidebar-mini-md')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
var $sidebar_mini_md_container = $('<div />', { class: 'mb-1' }).append($sidebar_mini_md_checkbox).append('<span>Sidebar Mini MD</span>')
|
||||||
|
$container.append($sidebar_mini_md_container)
|
||||||
|
|
||||||
|
var $sidebar_mini_xs_checkbox = $('<input />', {
|
||||||
|
type: 'checkbox',
|
||||||
|
value: 1,
|
||||||
|
checked: $('body').hasClass('sidebar-mini-xs'),
|
||||||
|
class: 'mr-1'
|
||||||
|
}).on('click', function () {
|
||||||
|
if ($(this).is(':checked')) {
|
||||||
|
$('body').addClass('sidebar-mini-xs')
|
||||||
|
} else {
|
||||||
|
$('body').removeClass('sidebar-mini-xs')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
var $sidebar_mini_xs_container = $('<div />', { class: 'mb-1' }).append($sidebar_mini_xs_checkbox).append('<span>Sidebar Mini XS</span>')
|
||||||
|
$container.append($sidebar_mini_xs_container)
|
||||||
|
|
||||||
|
var $flat_sidebar_checkbox = $('<input />', {
|
||||||
|
type: 'checkbox',
|
||||||
|
value: 1,
|
||||||
|
checked: $('.nav-sidebar').hasClass('nav-flat'),
|
||||||
|
class: 'mr-1'
|
||||||
|
}).on('click', function () {
|
||||||
|
if ($(this).is(':checked')) {
|
||||||
|
$('.nav-sidebar').addClass('nav-flat')
|
||||||
|
} else {
|
||||||
|
$('.nav-sidebar').removeClass('nav-flat')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
var $flat_sidebar_container = $('<div />', { class: 'mb-1' }).append($flat_sidebar_checkbox).append('<span>Nav Flat Style</span>')
|
||||||
|
$container.append($flat_sidebar_container)
|
||||||
|
|
||||||
|
var $legacy_sidebar_checkbox = $('<input />', {
|
||||||
|
type: 'checkbox',
|
||||||
|
value: 1,
|
||||||
|
checked: $('.nav-sidebar').hasClass('nav-legacy'),
|
||||||
|
class: 'mr-1'
|
||||||
|
}).on('click', function () {
|
||||||
|
if ($(this).is(':checked')) {
|
||||||
|
$('.nav-sidebar').addClass('nav-legacy')
|
||||||
|
} else {
|
||||||
|
$('.nav-sidebar').removeClass('nav-legacy')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
var $legacy_sidebar_container = $('<div />', { class: 'mb-1' }).append($legacy_sidebar_checkbox).append('<span>Nav Legacy Style</span>')
|
||||||
|
$container.append($legacy_sidebar_container)
|
||||||
|
|
||||||
|
var $compact_sidebar_checkbox = $('<input />', {
|
||||||
|
type: 'checkbox',
|
||||||
|
value: 1,
|
||||||
|
checked: $('.nav-sidebar').hasClass('nav-compact'),
|
||||||
|
class: 'mr-1'
|
||||||
|
}).on('click', function () {
|
||||||
|
if ($(this).is(':checked')) {
|
||||||
|
$('.nav-sidebar').addClass('nav-compact')
|
||||||
|
} else {
|
||||||
|
$('.nav-sidebar').removeClass('nav-compact')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
var $compact_sidebar_container = $('<div />', { class: 'mb-1' }).append($compact_sidebar_checkbox).append('<span>Nav Compact</span>')
|
||||||
|
$container.append($compact_sidebar_container)
|
||||||
|
|
||||||
|
var $child_indent_sidebar_checkbox = $('<input />', {
|
||||||
|
type: 'checkbox',
|
||||||
|
value: 1,
|
||||||
|
checked: $('.nav-sidebar').hasClass('nav-child-indent'),
|
||||||
|
class: 'mr-1'
|
||||||
|
}).on('click', function () {
|
||||||
|
if ($(this).is(':checked')) {
|
||||||
|
$('.nav-sidebar').addClass('nav-child-indent')
|
||||||
|
} else {
|
||||||
|
$('.nav-sidebar').removeClass('nav-child-indent')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
var $child_indent_sidebar_container = $('<div />', { class: 'mb-1' }).append($child_indent_sidebar_checkbox).append('<span>Nav Child Indent</span>')
|
||||||
|
$container.append($child_indent_sidebar_container)
|
||||||
|
|
||||||
|
var $child_hide_sidebar_checkbox = $('<input />', {
|
||||||
|
type: 'checkbox',
|
||||||
|
value: 1,
|
||||||
|
checked: $('.nav-sidebar').hasClass('nav-collapse-hide-child'),
|
||||||
|
class: 'mr-1'
|
||||||
|
}).on('click', function () {
|
||||||
|
if ($(this).is(':checked')) {
|
||||||
|
$('.nav-sidebar').addClass('nav-collapse-hide-child')
|
||||||
|
} else {
|
||||||
|
$('.nav-sidebar').removeClass('nav-collapse-hide-child')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
var $child_hide_sidebar_container = $('<div />', { class: 'mb-1' }).append($child_hide_sidebar_checkbox).append('<span>Nav Child Hide on Collapse</span>')
|
||||||
|
$container.append($child_hide_sidebar_container)
|
||||||
|
|
||||||
|
var $no_expand_sidebar_checkbox = $('<input />', {
|
||||||
|
type: 'checkbox',
|
||||||
|
value: 1,
|
||||||
|
checked: $('.main-sidebar').hasClass('sidebar-no-expand'),
|
||||||
|
class: 'mr-1'
|
||||||
|
}).on('click', function () {
|
||||||
|
if ($(this).is(':checked')) {
|
||||||
|
$('.main-sidebar').addClass('sidebar-no-expand')
|
||||||
|
} else {
|
||||||
|
$('.main-sidebar').removeClass('sidebar-no-expand')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
var $no_expand_sidebar_container = $('<div />', { class: 'mb-4' }).append($no_expand_sidebar_checkbox).append('<span>Disable Hover/Focus Auto-Expand</span>')
|
||||||
|
$container.append($no_expand_sidebar_container)
|
||||||
|
|
||||||
|
$container.append('<h6>Footer Options</h6>')
|
||||||
|
var $footer_fixed_checkbox = $('<input />', {
|
||||||
|
type: 'checkbox',
|
||||||
|
value: 1,
|
||||||
|
checked: $('body').hasClass('layout-footer-fixed'),
|
||||||
|
class: 'mr-1'
|
||||||
|
}).on('click', function () {
|
||||||
|
if ($(this).is(':checked')) {
|
||||||
|
$('body').addClass('layout-footer-fixed')
|
||||||
|
} else {
|
||||||
|
$('body').removeClass('layout-footer-fixed')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
var $footer_fixed_container = $('<div />', { class: 'mb-4' }).append($footer_fixed_checkbox).append('<span>Fixed</span>')
|
||||||
|
$container.append($footer_fixed_container)
|
||||||
|
|
||||||
|
$container.append('<h6>Small Text Options</h6>')
|
||||||
|
|
||||||
|
var $text_sm_body_checkbox = $('<input />', {
|
||||||
|
type: 'checkbox',
|
||||||
|
value: 1,
|
||||||
|
checked: $('body').hasClass('text-sm'),
|
||||||
|
class: 'mr-1'
|
||||||
|
}).on('click', function () {
|
||||||
|
if ($(this).is(':checked')) {
|
||||||
|
$('body').addClass('text-sm')
|
||||||
|
} else {
|
||||||
|
$('body').removeClass('text-sm')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
var $text_sm_body_container = $('<div />', { class: 'mb-1' }).append($text_sm_body_checkbox).append('<span>Body</span>')
|
||||||
|
$container.append($text_sm_body_container)
|
||||||
|
|
||||||
|
var $text_sm_header_checkbox = $('<input />', {
|
||||||
|
type: 'checkbox',
|
||||||
|
value: 1,
|
||||||
|
checked: $('.main-header').hasClass('text-sm'),
|
||||||
|
class: 'mr-1'
|
||||||
|
}).on('click', function () {
|
||||||
|
if ($(this).is(':checked')) {
|
||||||
|
$('.main-header').addClass('text-sm')
|
||||||
|
} else {
|
||||||
|
$('.main-header').removeClass('text-sm')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
var $text_sm_header_container = $('<div />', { class: 'mb-1' }).append($text_sm_header_checkbox).append('<span>Navbar</span>')
|
||||||
|
$container.append($text_sm_header_container)
|
||||||
|
|
||||||
|
var $text_sm_brand_checkbox = $('<input />', {
|
||||||
|
type: 'checkbox',
|
||||||
|
value: 1,
|
||||||
|
checked: $('.brand-link').hasClass('text-sm'),
|
||||||
|
class: 'mr-1'
|
||||||
|
}).on('click', function () {
|
||||||
|
if ($(this).is(':checked')) {
|
||||||
|
$('.brand-link').addClass('text-sm')
|
||||||
|
} else {
|
||||||
|
$('.brand-link').removeClass('text-sm')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
var $text_sm_brand_container = $('<div />', { class: 'mb-1' }).append($text_sm_brand_checkbox).append('<span>Brand</span>')
|
||||||
|
$container.append($text_sm_brand_container)
|
||||||
|
|
||||||
|
var $text_sm_sidebar_checkbox = $('<input />', {
|
||||||
|
type: 'checkbox',
|
||||||
|
value: 1,
|
||||||
|
checked: $('.nav-sidebar').hasClass('text-sm'),
|
||||||
|
class: 'mr-1'
|
||||||
|
}).on('click', function () {
|
||||||
|
if ($(this).is(':checked')) {
|
||||||
|
$('.nav-sidebar').addClass('text-sm')
|
||||||
|
} else {
|
||||||
|
$('.nav-sidebar').removeClass('text-sm')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
var $text_sm_sidebar_container = $('<div />', { class: 'mb-1' }).append($text_sm_sidebar_checkbox).append('<span>Sidebar Nav</span>')
|
||||||
|
$container.append($text_sm_sidebar_container)
|
||||||
|
|
||||||
|
var $text_sm_footer_checkbox = $('<input />', {
|
||||||
|
type: 'checkbox',
|
||||||
|
value: 1,
|
||||||
|
checked: $('.main-footer').hasClass('text-sm'),
|
||||||
|
class: 'mr-1'
|
||||||
|
}).on('click', function () {
|
||||||
|
if ($(this).is(':checked')) {
|
||||||
|
$('.main-footer').addClass('text-sm')
|
||||||
|
} else {
|
||||||
|
$('.main-footer').removeClass('text-sm')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
var $text_sm_footer_container = $('<div />', { class: 'mb-4' }).append($text_sm_footer_checkbox).append('<span>Footer</span>')
|
||||||
|
$container.append($text_sm_footer_container)
|
||||||
|
|
||||||
|
// Color Arrays
|
||||||
|
|
||||||
|
var navbar_dark_skins = [
|
||||||
|
'navbar-primary',
|
||||||
|
'navbar-secondary',
|
||||||
|
'navbar-info',
|
||||||
|
'navbar-success',
|
||||||
|
'navbar-danger',
|
||||||
|
'navbar-indigo',
|
||||||
|
'navbar-purple',
|
||||||
|
'navbar-pink',
|
||||||
|
'navbar-navy',
|
||||||
|
'navbar-lightblue',
|
||||||
|
'navbar-teal',
|
||||||
|
'navbar-cyan',
|
||||||
|
'navbar-dark',
|
||||||
|
'navbar-gray-dark',
|
||||||
|
'navbar-gray'
|
||||||
|
]
|
||||||
|
|
||||||
|
var navbar_light_skins = [
|
||||||
|
'navbar-light',
|
||||||
|
'navbar-warning',
|
||||||
|
'navbar-white',
|
||||||
|
'navbar-orange'
|
||||||
|
]
|
||||||
|
|
||||||
|
var sidebar_colors = [
|
||||||
|
'bg-primary',
|
||||||
|
'bg-warning',
|
||||||
|
'bg-info',
|
||||||
|
'bg-danger',
|
||||||
|
'bg-success',
|
||||||
|
'bg-indigo',
|
||||||
|
'bg-lightblue',
|
||||||
|
'bg-navy',
|
||||||
|
'bg-purple',
|
||||||
|
'bg-fuchsia',
|
||||||
|
'bg-pink',
|
||||||
|
'bg-maroon',
|
||||||
|
'bg-orange',
|
||||||
|
'bg-lime',
|
||||||
|
'bg-teal',
|
||||||
|
'bg-olive'
|
||||||
|
]
|
||||||
|
|
||||||
|
var accent_colors = [
|
||||||
|
'accent-primary',
|
||||||
|
'accent-warning',
|
||||||
|
'accent-info',
|
||||||
|
'accent-danger',
|
||||||
|
'accent-success',
|
||||||
|
'accent-indigo',
|
||||||
|
'accent-lightblue',
|
||||||
|
'accent-navy',
|
||||||
|
'accent-purple',
|
||||||
|
'accent-fuchsia',
|
||||||
|
'accent-pink',
|
||||||
|
'accent-maroon',
|
||||||
|
'accent-orange',
|
||||||
|
'accent-lime',
|
||||||
|
'accent-teal',
|
||||||
|
'accent-olive'
|
||||||
|
]
|
||||||
|
|
||||||
|
var sidebar_skins = [
|
||||||
|
'sidebar-dark-primary',
|
||||||
|
'sidebar-dark-warning',
|
||||||
|
'sidebar-dark-info',
|
||||||
|
'sidebar-dark-danger',
|
||||||
|
'sidebar-dark-success',
|
||||||
|
'sidebar-dark-indigo',
|
||||||
|
'sidebar-dark-lightblue',
|
||||||
|
'sidebar-dark-navy',
|
||||||
|
'sidebar-dark-purple',
|
||||||
|
'sidebar-dark-fuchsia',
|
||||||
|
'sidebar-dark-pink',
|
||||||
|
'sidebar-dark-maroon',
|
||||||
|
'sidebar-dark-orange',
|
||||||
|
'sidebar-dark-lime',
|
||||||
|
'sidebar-dark-teal',
|
||||||
|
'sidebar-dark-olive',
|
||||||
|
'sidebar-light-primary',
|
||||||
|
'sidebar-light-warning',
|
||||||
|
'sidebar-light-info',
|
||||||
|
'sidebar-light-danger',
|
||||||
|
'sidebar-light-success',
|
||||||
|
'sidebar-light-indigo',
|
||||||
|
'sidebar-light-lightblue',
|
||||||
|
'sidebar-light-navy',
|
||||||
|
'sidebar-light-purple',
|
||||||
|
'sidebar-light-fuchsia',
|
||||||
|
'sidebar-light-pink',
|
||||||
|
'sidebar-light-maroon',
|
||||||
|
'sidebar-light-orange',
|
||||||
|
'sidebar-light-lime',
|
||||||
|
'sidebar-light-teal',
|
||||||
|
'sidebar-light-olive'
|
||||||
|
]
|
||||||
|
|
||||||
|
// Navbar Variants
|
||||||
|
|
||||||
|
$container.append('<h6>Navbar Variants</h6>')
|
||||||
|
|
||||||
|
var $navbar_variants = $('<div />', {
|
||||||
|
class: 'd-flex'
|
||||||
|
})
|
||||||
|
var navbar_all_colors = navbar_dark_skins.concat(navbar_light_skins)
|
||||||
|
var $navbar_variants_colors = createSkinBlock(navbar_all_colors, function () {
|
||||||
|
var color = $(this).find('option:selected').attr('class')
|
||||||
|
var $main_header = $('.main-header')
|
||||||
|
$main_header.removeClass('navbar-dark').removeClass('navbar-light')
|
||||||
|
navbar_all_colors.forEach(function (color) {
|
||||||
|
$main_header.removeClass(color)
|
||||||
|
})
|
||||||
|
|
||||||
|
$(this).removeClass().addClass('custom-select mb-3 text-light border-0 ')
|
||||||
|
|
||||||
|
if (navbar_dark_skins.indexOf(color) > -1) {
|
||||||
|
$main_header.addClass('navbar-dark')
|
||||||
|
$(this).addClass(color).addClass('text-light')
|
||||||
|
} else {
|
||||||
|
$main_header.addClass('navbar-light')
|
||||||
|
$(this).addClass(color)
|
||||||
|
}
|
||||||
|
|
||||||
|
$main_header.addClass(color)
|
||||||
|
})
|
||||||
|
|
||||||
|
var active_navbar_color = null
|
||||||
|
$('.main-header')[0].classList.forEach(function (className) {
|
||||||
|
if (navbar_all_colors.indexOf(className) > -1 && active_navbar_color === null) {
|
||||||
|
active_navbar_color = className.replace('navbar-', 'bg-')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
$navbar_variants_colors.find('option.' + active_navbar_color).prop('selected', true)
|
||||||
|
$navbar_variants_colors.removeClass().addClass('custom-select mb-3 text-light border-0 ').addClass(active_navbar_color)
|
||||||
|
|
||||||
|
$navbar_variants.append($navbar_variants_colors)
|
||||||
|
|
||||||
|
$container.append($navbar_variants)
|
||||||
|
|
||||||
|
// Sidebar Colors
|
||||||
|
|
||||||
|
$container.append('<h6>Accent Color Variants</h6>')
|
||||||
|
var $accent_variants = $('<div />', {
|
||||||
|
class: 'd-flex'
|
||||||
|
})
|
||||||
|
$container.append($accent_variants)
|
||||||
|
$container.append(createSkinBlock(accent_colors, function () {
|
||||||
|
var color = $(this).find('option:selected').attr('class')
|
||||||
|
var $body = $('body')
|
||||||
|
accent_colors.forEach(function (skin) {
|
||||||
|
$body.removeClass(skin)
|
||||||
|
})
|
||||||
|
|
||||||
|
var accent_color_class = color.replace('bg-', 'accent-')
|
||||||
|
|
||||||
|
$body.addClass(accent_color_class)
|
||||||
|
}, true))
|
||||||
|
|
||||||
|
var active_accent_color = null
|
||||||
|
$('body')[0].classList.forEach(function (className) {
|
||||||
|
if (accent_colors.indexOf(className) > -1 && active_accent_color === null) {
|
||||||
|
active_accent_color = className.replace('navbar-', 'bg-')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
// $accent_variants.find('option.' + active_accent_color).prop('selected', true)
|
||||||
|
// $accent_variants.removeClass().addClass('custom-select mb-3 text-light border-0 ').addClass(active_accent_color)
|
||||||
|
|
||||||
|
$container.append('<h6>Dark Sidebar Variants</h6>')
|
||||||
|
var $sidebar_variants_dark = $('<div />', {
|
||||||
|
class: 'd-flex'
|
||||||
|
})
|
||||||
|
$container.append($sidebar_variants_dark)
|
||||||
|
var $sidebar_dark_variants = createSkinBlock(sidebar_colors, function () {
|
||||||
|
var color = $(this).find('option:selected').attr('class')
|
||||||
|
var sidebar_class = 'sidebar-dark-' + color.replace('bg-', '')
|
||||||
|
var $sidebar = $('.main-sidebar')
|
||||||
|
sidebar_skins.forEach(function (skin) {
|
||||||
|
$sidebar.removeClass(skin)
|
||||||
|
$sidebar_light_variants.removeClass(skin.replace('sidebar-dark-', 'bg-')).removeClass('text-light')
|
||||||
|
})
|
||||||
|
|
||||||
|
$(this).removeClass().addClass('custom-select mb-3 text-light border-0').addClass(color)
|
||||||
|
|
||||||
|
$sidebar_light_variants.find('option').prop('selected', false)
|
||||||
|
$sidebar.addClass(sidebar_class)
|
||||||
|
$('.sidebar').removeClass('os-theme-dark').addClass('os-theme-light')
|
||||||
|
}, true)
|
||||||
|
$container.append($sidebar_dark_variants)
|
||||||
|
|
||||||
|
var active_sidebar_dark_color = null
|
||||||
|
$('.main-sidebar')[0].classList.forEach(function (className) {
|
||||||
|
var color = className.replace('sidebar-dark-', 'bg-')
|
||||||
|
if (sidebar_colors.indexOf(color) > -1 && active_sidebar_dark_color === null) {
|
||||||
|
active_sidebar_dark_color = color
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
$sidebar_dark_variants.find('option.' + active_sidebar_dark_color).prop('selected', true)
|
||||||
|
$sidebar_dark_variants.removeClass().addClass('custom-select mb-3 text-light border-0 ').addClass(active_sidebar_dark_color)
|
||||||
|
|
||||||
|
$container.append('<h6>Light Sidebar Variants</h6>')
|
||||||
|
var $sidebar_variants_light = $('<div />', {
|
||||||
|
class: 'd-flex'
|
||||||
|
})
|
||||||
|
$container.append($sidebar_variants_light)
|
||||||
|
var $sidebar_light_variants = createSkinBlock(sidebar_colors, function () {
|
||||||
|
var color = $(this).find('option:selected').attr('class')
|
||||||
|
var sidebar_class = 'sidebar-light-' + color.replace('bg-', '')
|
||||||
|
var $sidebar = $('.main-sidebar')
|
||||||
|
sidebar_skins.forEach(function (skin) {
|
||||||
|
$sidebar.removeClass(skin)
|
||||||
|
$sidebar_dark_variants.removeClass(skin.replace('sidebar-light-', 'bg-')).removeClass('text-light')
|
||||||
|
})
|
||||||
|
|
||||||
|
$(this).removeClass().addClass('custom-select mb-3 text-light border-0').addClass(color)
|
||||||
|
|
||||||
|
$sidebar_dark_variants.find('option').prop('selected', false)
|
||||||
|
$sidebar.addClass(sidebar_class)
|
||||||
|
$('.sidebar').removeClass('os-theme-light').addClass('os-theme-dark')
|
||||||
|
}, true)
|
||||||
|
$container.append($sidebar_light_variants)
|
||||||
|
|
||||||
|
var active_sidebar_light_color = null
|
||||||
|
$('.main-sidebar')[0].classList.forEach(function (className) {
|
||||||
|
var color = className.replace('sidebar-light-', 'bg-')
|
||||||
|
if (sidebar_colors.indexOf(color) > -1 && active_sidebar_light_color === null) {
|
||||||
|
active_sidebar_light_color = color
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
if (active_sidebar_light_color !== null) {
|
||||||
|
$sidebar_light_variants.find('option.' + active_sidebar_light_color).prop('selected', true)
|
||||||
|
$sidebar_light_variants.removeClass().addClass('custom-select mb-3 text-light border-0 ').addClass(active_sidebar_light_color)
|
||||||
|
}
|
||||||
|
|
||||||
|
var logo_skins = navbar_all_colors
|
||||||
|
$container.append('<h6>Brand Logo Variants</h6>')
|
||||||
|
var $logo_variants = $('<div />', {
|
||||||
|
class: 'd-flex'
|
||||||
|
})
|
||||||
|
$container.append($logo_variants)
|
||||||
|
var $clear_btn = $('<a />', {
|
||||||
|
href: '#'
|
||||||
|
}).text('clear').on('click', function (e) {
|
||||||
|
e.preventDefault()
|
||||||
|
var $logo = $('.brand-link')
|
||||||
|
logo_skins.forEach(function (skin) {
|
||||||
|
$logo.removeClass(skin)
|
||||||
|
})
|
||||||
|
})
|
||||||
|
|
||||||
|
var $brand_variants = createSkinBlock(logo_skins, function () {
|
||||||
|
var color = $(this).find('option:selected').attr('class')
|
||||||
|
var $logo = $('.brand-link')
|
||||||
|
|
||||||
|
if (color === 'navbar-light' || color === 'navbar-white') {
|
||||||
|
$logo.addClass('text-black')
|
||||||
|
} else {
|
||||||
|
$logo.removeClass('text-black')
|
||||||
|
}
|
||||||
|
|
||||||
|
logo_skins.forEach(function (skin) {
|
||||||
|
$logo.removeClass(skin)
|
||||||
|
})
|
||||||
|
|
||||||
|
if (color) {
|
||||||
|
$(this).removeClass().addClass('custom-select mb-3 border-0').addClass(color).addClass(color !== 'navbar-light' && color !== 'navbar-white' ? 'text-light' : '')
|
||||||
|
} else {
|
||||||
|
$(this).removeClass().addClass('custom-select mb-3 border-0')
|
||||||
|
}
|
||||||
|
|
||||||
|
$logo.addClass(color)
|
||||||
|
}, true).append($clear_btn)
|
||||||
|
$container.append($brand_variants)
|
||||||
|
|
||||||
|
var active_brand_color = null
|
||||||
|
$('.brand-link')[0].classList.forEach(function (className) {
|
||||||
|
if (logo_skins.indexOf(className) > -1 && active_brand_color === null) {
|
||||||
|
active_brand_color = className.replace('navbar-', 'bg-')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
if (active_brand_color) {
|
||||||
|
$brand_variants.find('option.' + active_brand_color).prop('selected', true)
|
||||||
|
$brand_variants.removeClass().addClass('custom-select mb-3 text-light border-0 ').addClass(active_brand_color)
|
||||||
|
}
|
||||||
|
})(jQuery)
|
267
root/usr/share/smanager/themes/AdminLTE/public/dist/js/pages/dashboard.js
vendored
Normal file
@ -0,0 +1,267 @@
|
|||||||
|
/*
|
||||||
|
* Author: Abdullah A Almsaeed
|
||||||
|
* Date: 4 Jan 2014
|
||||||
|
* Description:
|
||||||
|
* This is a demo file used only for the main dashboard (index.html)
|
||||||
|
**/
|
||||||
|
|
||||||
|
/* global moment:false, Chart:false, Sparkline:false */
|
||||||
|
|
||||||
|
$(function () {
|
||||||
|
'use strict'
|
||||||
|
|
||||||
|
// Make the dashboard widgets sortable Using jquery UI
|
||||||
|
$('.connectedSortable').sortable({
|
||||||
|
placeholder: 'sort-highlight',
|
||||||
|
connectWith: '.connectedSortable',
|
||||||
|
handle: '.card-header, .nav-tabs',
|
||||||
|
forcePlaceholderSize: true,
|
||||||
|
zIndex: 999999
|
||||||
|
})
|
||||||
|
$('.connectedSortable .card-header').css('cursor', 'move')
|
||||||
|
|
||||||
|
// jQuery UI sortable for the todo list
|
||||||
|
$('.todo-list').sortable({
|
||||||
|
placeholder: 'sort-highlight',
|
||||||
|
handle: '.handle',
|
||||||
|
forcePlaceholderSize: true,
|
||||||
|
zIndex: 999999
|
||||||
|
})
|
||||||
|
|
||||||
|
// bootstrap WYSIHTML5 - text editor
|
||||||
|
$('.textarea').summernote()
|
||||||
|
|
||||||
|
$('.daterange').daterangepicker({
|
||||||
|
ranges: {
|
||||||
|
Today: [moment(), moment()],
|
||||||
|
Yesterday: [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
|
||||||
|
'Last 7 Days': [moment().subtract(6, 'days'), moment()],
|
||||||
|
'Last 30 Days': [moment().subtract(29, 'days'), moment()],
|
||||||
|
'This Month': [moment().startOf('month'), moment().endOf('month')],
|
||||||
|
'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')]
|
||||||
|
},
|
||||||
|
startDate: moment().subtract(29, 'days'),
|
||||||
|
endDate: moment()
|
||||||
|
}, function (start, end) {
|
||||||
|
// eslint-disable-next-line no-alert
|
||||||
|
alert('You chose: ' + start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'))
|
||||||
|
})
|
||||||
|
|
||||||
|
/* jQueryKnob */
|
||||||
|
$('.knob').knob()
|
||||||
|
|
||||||
|
// jvectormap data
|
||||||
|
var visitorsData = {
|
||||||
|
US: 398, // USA
|
||||||
|
SA: 400, // Saudi Arabia
|
||||||
|
CA: 1000, // Canada
|
||||||
|
DE: 500, // Germany
|
||||||
|
FR: 760, // France
|
||||||
|
CN: 300, // China
|
||||||
|
AU: 700, // Australia
|
||||||
|
BR: 600, // Brazil
|
||||||
|
IN: 800, // India
|
||||||
|
GB: 320, // Great Britain
|
||||||
|
RU: 3000 // Russia
|
||||||
|
}
|
||||||
|
// World map by jvectormap
|
||||||
|
$('#world-map').vectorMap({
|
||||||
|
map: 'usa_en',
|
||||||
|
backgroundColor: 'transparent',
|
||||||
|
regionStyle: {
|
||||||
|
initial: {
|
||||||
|
fill: 'rgba(255, 255, 255, 0.7)',
|
||||||
|
'fill-opacity': 1,
|
||||||
|
stroke: 'rgba(0,0,0,.2)',
|
||||||
|
'stroke-width': 1,
|
||||||
|
'stroke-opacity': 1
|
||||||
|
}
|
||||||
|
},
|
||||||
|
series: {
|
||||||
|
regions: [{
|
||||||
|
values: visitorsData,
|
||||||
|
scale: ['#ffffff', '#0154ad'],
|
||||||
|
normalizeFunction: 'polynomial'
|
||||||
|
}]
|
||||||
|
},
|
||||||
|
onRegionLabelShow: function (e, el, code) {
|
||||||
|
if (typeof visitorsData[code] !== 'undefined') {
|
||||||
|
el.html(el.html() + ': ' + visitorsData[code] + ' new visitors')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
// Sparkline charts
|
||||||
|
var sparkline1 = new Sparkline($('#sparkline-1')[0], { width: 80, height: 50, lineColor: '#92c1dc', endColor: '#ebf4f9' })
|
||||||
|
var sparkline2 = new Sparkline($('#sparkline-2')[0], { width: 80, height: 50, lineColor: '#92c1dc', endColor: '#ebf4f9' })
|
||||||
|
var sparkline3 = new Sparkline($('#sparkline-3')[0], { width: 80, height: 50, lineColor: '#92c1dc', endColor: '#ebf4f9' })
|
||||||
|
|
||||||
|
sparkline1.draw([1000, 1200, 920, 927, 931, 1027, 819, 930, 1021])
|
||||||
|
sparkline2.draw([515, 519, 520, 522, 652, 810, 370, 627, 319, 630, 921])
|
||||||
|
sparkline3.draw([15, 19, 20, 22, 33, 27, 31, 27, 19, 30, 21])
|
||||||
|
|
||||||
|
// The Calender
|
||||||
|
$('#calendar').datetimepicker({
|
||||||
|
format: 'L',
|
||||||
|
inline: true
|
||||||
|
})
|
||||||
|
|
||||||
|
// SLIMSCROLL FOR CHAT WIDGET
|
||||||
|
$('#chat-box').overlayScrollbars({
|
||||||
|
height: '250px'
|
||||||
|
})
|
||||||
|
|
||||||
|
/* Chart.js Charts */
|
||||||
|
// Sales chart
|
||||||
|
var salesChartCanvas = document.getElementById('revenue-chart-canvas').getContext('2d')
|
||||||
|
// $('#revenue-chart').get(0).getContext('2d');
|
||||||
|
|
||||||
|
var salesChartData = {
|
||||||
|
labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
|
||||||
|
datasets: [
|
||||||
|
{
|
||||||
|
label: 'Digital Goods',
|
||||||
|
backgroundColor: 'rgba(60,141,188,0.9)',
|
||||||
|
borderColor: 'rgba(60,141,188,0.8)',
|
||||||
|
pointRadius: false,
|
||||||
|
pointColor: '#3b8bba',
|
||||||
|
pointStrokeColor: 'rgba(60,141,188,1)',
|
||||||
|
pointHighlightFill: '#fff',
|
||||||
|
pointHighlightStroke: 'rgba(60,141,188,1)',
|
||||||
|
data: [28, 48, 40, 19, 86, 27, 90]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'Electronics',
|
||||||
|
backgroundColor: 'rgba(210, 214, 222, 1)',
|
||||||
|
borderColor: 'rgba(210, 214, 222, 1)',
|
||||||
|
pointRadius: false,
|
||||||
|
pointColor: 'rgba(210, 214, 222, 1)',
|
||||||
|
pointStrokeColor: '#c1c7d1',
|
||||||
|
pointHighlightFill: '#fff',
|
||||||
|
pointHighlightStroke: 'rgba(220,220,220,1)',
|
||||||
|
data: [65, 59, 80, 81, 56, 55, 40]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
|
||||||
|
var salesChartOptions = {
|
||||||
|
maintainAspectRatio: false,
|
||||||
|
responsive: true,
|
||||||
|
legend: {
|
||||||
|
display: false
|
||||||
|
},
|
||||||
|
scales: {
|
||||||
|
xAxes: [{
|
||||||
|
gridLines: {
|
||||||
|
display: false
|
||||||
|
}
|
||||||
|
}],
|
||||||
|
yAxes: [{
|
||||||
|
gridLines: {
|
||||||
|
display: false
|
||||||
|
}
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// This will get the first returned node in the jQuery collection.
|
||||||
|
// eslint-disable-next-line no-unused-vars
|
||||||
|
var salesChart = new Chart(salesChartCanvas, { // lgtm[js/unused-local-variable]
|
||||||
|
type: 'line',
|
||||||
|
data: salesChartData,
|
||||||
|
options: salesChartOptions
|
||||||
|
})
|
||||||
|
|
||||||
|
// Donut Chart
|
||||||
|
var pieChartCanvas = $('#sales-chart-canvas').get(0).getContext('2d')
|
||||||
|
var pieData = {
|
||||||
|
labels: [
|
||||||
|
'Instore Sales',
|
||||||
|
'Download Sales',
|
||||||
|
'Mail-Order Sales'
|
||||||
|
],
|
||||||
|
datasets: [
|
||||||
|
{
|
||||||
|
data: [30, 12, 20],
|
||||||
|
backgroundColor: ['#f56954', '#00a65a', '#f39c12']
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
var pieOptions = {
|
||||||
|
legend: {
|
||||||
|
display: false
|
||||||
|
},
|
||||||
|
maintainAspectRatio: false,
|
||||||
|
responsive: true
|
||||||
|
}
|
||||||
|
// Create pie or douhnut chart
|
||||||
|
// You can switch between pie and douhnut using the method below.
|
||||||
|
// eslint-disable-next-line no-unused-vars
|
||||||
|
var pieChart = new Chart(pieChartCanvas, { // lgtm[js/unused-local-variable]
|
||||||
|
type: 'doughnut',
|
||||||
|
data: pieData,
|
||||||
|
options: pieOptions
|
||||||
|
})
|
||||||
|
|
||||||
|
// Sales graph chart
|
||||||
|
var salesGraphChartCanvas = $('#line-chart').get(0).getContext('2d')
|
||||||
|
// $('#revenue-chart').get(0).getContext('2d');
|
||||||
|
|
||||||
|
var salesGraphChartData = {
|
||||||
|
labels: ['2011 Q1', '2011 Q2', '2011 Q3', '2011 Q4', '2012 Q1', '2012 Q2', '2012 Q3', '2012 Q4', '2013 Q1', '2013 Q2'],
|
||||||
|
datasets: [
|
||||||
|
{
|
||||||
|
label: 'Digital Goods',
|
||||||
|
fill: false,
|
||||||
|
borderWidth: 2,
|
||||||
|
lineTension: 0,
|
||||||
|
spanGaps: true,
|
||||||
|
borderColor: '#efefef',
|
||||||
|
pointRadius: 3,
|
||||||
|
pointHoverRadius: 7,
|
||||||
|
pointColor: '#efefef',
|
||||||
|
pointBackgroundColor: '#efefef',
|
||||||
|
data: [2666, 2778, 4912, 3767, 6810, 5670, 4820, 15073, 10687, 8432]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
|
||||||
|
var salesGraphChartOptions = {
|
||||||
|
maintainAspectRatio: false,
|
||||||
|
responsive: true,
|
||||||
|
legend: {
|
||||||
|
display: false
|
||||||
|
},
|
||||||
|
scales: {
|
||||||
|
xAxes: [{
|
||||||
|
ticks: {
|
||||||
|
fontColor: '#efefef'
|
||||||
|
},
|
||||||
|
gridLines: {
|
||||||
|
display: false,
|
||||||
|
color: '#efefef',
|
||||||
|
drawBorder: false
|
||||||
|
}
|
||||||
|
}],
|
||||||
|
yAxes: [{
|
||||||
|
ticks: {
|
||||||
|
stepSize: 5000,
|
||||||
|
fontColor: '#efefef'
|
||||||
|
},
|
||||||
|
gridLines: {
|
||||||
|
display: true,
|
||||||
|
color: '#efefef',
|
||||||
|
drawBorder: false
|
||||||
|
}
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// This will get the first returned node in the jQuery collection.
|
||||||
|
// eslint-disable-next-line no-unused-vars
|
||||||
|
var salesGraphChart = new Chart(salesGraphChartCanvas, { // lgtm[js/unused-local-variable]
|
||||||
|
type: 'line',
|
||||||
|
data: salesGraphChartData,
|
||||||
|
options: salesGraphChartOptions
|
||||||
|
})
|
||||||
|
})
|
270
root/usr/share/smanager/themes/AdminLTE/public/dist/js/pages/dashboard2.js
vendored
Normal file
@ -0,0 +1,270 @@
|
|||||||
|
/* global Chart:false */
|
||||||
|
|
||||||
|
$(function () {
|
||||||
|
'use strict'
|
||||||
|
|
||||||
|
/* ChartJS
|
||||||
|
* -------
|
||||||
|
* Here we will create a few charts using ChartJS
|
||||||
|
*/
|
||||||
|
|
||||||
|
//-----------------------
|
||||||
|
// - MONTHLY SALES CHART -
|
||||||
|
//-----------------------
|
||||||
|
|
||||||
|
// Get context with jQuery - using jQuery's .get() method.
|
||||||
|
var salesChartCanvas = $('#salesChart').get(0).getContext('2d')
|
||||||
|
|
||||||
|
var salesChartData = {
|
||||||
|
labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
|
||||||
|
datasets: [
|
||||||
|
{
|
||||||
|
label: 'Digital Goods',
|
||||||
|
backgroundColor: 'rgba(60,141,188,0.9)',
|
||||||
|
borderColor: 'rgba(60,141,188,0.8)',
|
||||||
|
pointRadius: false,
|
||||||
|
pointColor: '#3b8bba',
|
||||||
|
pointStrokeColor: 'rgba(60,141,188,1)',
|
||||||
|
pointHighlightFill: '#fff',
|
||||||
|
pointHighlightStroke: 'rgba(60,141,188,1)',
|
||||||
|
data: [28, 48, 40, 19, 86, 27, 90]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'Electronics',
|
||||||
|
backgroundColor: 'rgba(210, 214, 222, 1)',
|
||||||
|
borderColor: 'rgba(210, 214, 222, 1)',
|
||||||
|
pointRadius: false,
|
||||||
|
pointColor: 'rgba(210, 214, 222, 1)',
|
||||||
|
pointStrokeColor: '#c1c7d1',
|
||||||
|
pointHighlightFill: '#fff',
|
||||||
|
pointHighlightStroke: 'rgba(220,220,220,1)',
|
||||||
|
data: [65, 59, 80, 81, 56, 55, 40]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
|
||||||
|
var salesChartOptions = {
|
||||||
|
maintainAspectRatio: false,
|
||||||
|
responsive: true,
|
||||||
|
legend: {
|
||||||
|
display: false
|
||||||
|
},
|
||||||
|
scales: {
|
||||||
|
xAxes: [{
|
||||||
|
gridLines: {
|
||||||
|
display: false
|
||||||
|
}
|
||||||
|
}],
|
||||||
|
yAxes: [{
|
||||||
|
gridLines: {
|
||||||
|
display: false
|
||||||
|
}
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// This will get the first returned node in the jQuery collection.
|
||||||
|
// eslint-disable-next-line no-unused-vars
|
||||||
|
var salesChart = new Chart(salesChartCanvas, {
|
||||||
|
type: 'line',
|
||||||
|
data: salesChartData,
|
||||||
|
options: salesChartOptions
|
||||||
|
}
|
||||||
|
)
|
||||||
|
|
||||||
|
//---------------------------
|
||||||
|
// - END MONTHLY SALES CHART -
|
||||||
|
//---------------------------
|
||||||
|
|
||||||
|
//-------------
|
||||||
|
// - PIE CHART -
|
||||||
|
//-------------
|
||||||
|
// Get context with jQuery - using jQuery's .get() method.
|
||||||
|
var pieChartCanvas = $('#pieChart').get(0).getContext('2d')
|
||||||
|
var pieData = {
|
||||||
|
labels: [
|
||||||
|
'Chrome',
|
||||||
|
'IE',
|
||||||
|
'FireFox',
|
||||||
|
'Safari',
|
||||||
|
'Opera',
|
||||||
|
'Navigator'
|
||||||
|
],
|
||||||
|
datasets: [
|
||||||
|
{
|
||||||
|
data: [700, 500, 400, 600, 300, 100],
|
||||||
|
backgroundColor: ['#f56954', '#00a65a', '#f39c12', '#00c0ef', '#3c8dbc', '#d2d6de']
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
var pieOptions = {
|
||||||
|
legend: {
|
||||||
|
display: false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// Create pie or douhnut chart
|
||||||
|
// You can switch between pie and douhnut using the method below.
|
||||||
|
// eslint-disable-next-line no-unused-vars
|
||||||
|
var pieChart = new Chart(pieChartCanvas, {
|
||||||
|
type: 'doughnut',
|
||||||
|
data: pieData,
|
||||||
|
options: pieOptions
|
||||||
|
})
|
||||||
|
|
||||||
|
//-----------------
|
||||||
|
// - END PIE CHART -
|
||||||
|
//-----------------
|
||||||
|
|
||||||
|
/* jVector Maps
|
||||||
|
* ------------
|
||||||
|
* Create a world map with markers
|
||||||
|
*/
|
||||||
|
$('#world-map-markers').mapael({
|
||||||
|
map: {
|
||||||
|
name: 'usa_states',
|
||||||
|
zoom: {
|
||||||
|
enabled: true,
|
||||||
|
maxLevel: 10
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
// $('#world-map-markers').vectorMap({
|
||||||
|
// map : 'world_en',
|
||||||
|
// normalizeFunction: 'polynomial',
|
||||||
|
// hoverOpacity : 0.7,
|
||||||
|
// hoverColor : false,
|
||||||
|
// backgroundColor : 'transparent',
|
||||||
|
// regionStyle : {
|
||||||
|
// initial : {
|
||||||
|
// fill : 'rgba(210, 214, 222, 1)',
|
||||||
|
// 'fill-opacity' : 1,
|
||||||
|
// stroke : 'none',
|
||||||
|
// 'stroke-width' : 0,
|
||||||
|
// 'stroke-opacity': 1
|
||||||
|
// },
|
||||||
|
// hover : {
|
||||||
|
// 'fill-opacity': 0.7,
|
||||||
|
// cursor : 'pointer'
|
||||||
|
// },
|
||||||
|
// selected : {
|
||||||
|
// fill: 'yellow'
|
||||||
|
// },
|
||||||
|
// selectedHover: {}
|
||||||
|
// },
|
||||||
|
// markerStyle : {
|
||||||
|
// initial: {
|
||||||
|
// fill : '#00a65a',
|
||||||
|
// stroke: '#111'
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
// markers : [
|
||||||
|
// {
|
||||||
|
// latLng: [41.90, 12.45],
|
||||||
|
// name : 'Vatican City'
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// latLng: [43.73, 7.41],
|
||||||
|
// name : 'Monaco'
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// latLng: [-0.52, 166.93],
|
||||||
|
// name : 'Nauru'
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// latLng: [-8.51, 179.21],
|
||||||
|
// name : 'Tuvalu'
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// latLng: [43.93, 12.46],
|
||||||
|
// name : 'San Marino'
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// latLng: [47.14, 9.52],
|
||||||
|
// name : 'Liechtenstein'
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// latLng: [7.11, 171.06],
|
||||||
|
// name : 'Marshall Islands'
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// latLng: [17.3, -62.73],
|
||||||
|
// name : 'Saint Kitts and Nevis'
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// latLng: [3.2, 73.22],
|
||||||
|
// name : 'Maldives'
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// latLng: [35.88, 14.5],
|
||||||
|
// name : 'Malta'
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// latLng: [12.05, -61.75],
|
||||||
|
// name : 'Grenada'
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// latLng: [13.16, -61.23],
|
||||||
|
// name : 'Saint Vincent and the Grenadines'
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// latLng: [13.16, -59.55],
|
||||||
|
// name : 'Barbados'
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// latLng: [17.11, -61.85],
|
||||||
|
// name : 'Antigua and Barbuda'
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// latLng: [-4.61, 55.45],
|
||||||
|
// name : 'Seychelles'
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// latLng: [7.35, 134.46],
|
||||||
|
// name : 'Palau'
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// latLng: [42.5, 1.51],
|
||||||
|
// name : 'Andorra'
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// latLng: [14.01, -60.98],
|
||||||
|
// name : 'Saint Lucia'
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// latLng: [6.91, 158.18],
|
||||||
|
// name : 'Federated States of Micronesia'
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// latLng: [1.3, 103.8],
|
||||||
|
// name : 'Singapore'
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// latLng: [1.46, 173.03],
|
||||||
|
// name : 'Kiribati'
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// latLng: [-21.13, -175.2],
|
||||||
|
// name : 'Tonga'
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// latLng: [15.3, -61.38],
|
||||||
|
// name : 'Dominica'
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// latLng: [-20.2, 57.5],
|
||||||
|
// name : 'Mauritius'
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// latLng: [26.02, 50.55],
|
||||||
|
// name : 'Bahrain'
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// latLng: [0.33, 6.73],
|
||||||
|
// name : 'São Tomé and Príncipe'
|
||||||
|
// }
|
||||||
|
// ]
|
||||||
|
// })
|
||||||
|
})
|
||||||
|
|
||||||
|
// lgtm [js/unused-local-variable]
|
147
root/usr/share/smanager/themes/AdminLTE/public/dist/js/pages/dashboard3.js
vendored
Normal file
@ -0,0 +1,147 @@
|
|||||||
|
/* global Chart:false */
|
||||||
|
|
||||||
|
$(function () {
|
||||||
|
'use strict'
|
||||||
|
|
||||||
|
var ticksStyle = {
|
||||||
|
fontColor: '#495057',
|
||||||
|
fontStyle: 'bold'
|
||||||
|
}
|
||||||
|
|
||||||
|
var mode = 'index'
|
||||||
|
var intersect = true
|
||||||
|
|
||||||
|
var $salesChart = $('#sales-chart')
|
||||||
|
// eslint-disable-next-line no-unused-vars
|
||||||
|
var salesChart = new Chart($salesChart, {
|
||||||
|
type: 'bar',
|
||||||
|
data: {
|
||||||
|
labels: ['JUN', 'JUL', 'AUG', 'SEP', 'OCT', 'NOV', 'DEC'],
|
||||||
|
datasets: [
|
||||||
|
{
|
||||||
|
backgroundColor: '#007bff',
|
||||||
|
borderColor: '#007bff',
|
||||||
|
data: [1000, 2000, 3000, 2500, 2700, 2500, 3000]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
backgroundColor: '#ced4da',
|
||||||
|
borderColor: '#ced4da',
|
||||||
|
data: [700, 1700, 2700, 2000, 1800, 1500, 2000]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
options: {
|
||||||
|
maintainAspectRatio: false,
|
||||||
|
tooltips: {
|
||||||
|
mode: mode,
|
||||||
|
intersect: intersect
|
||||||
|
},
|
||||||
|
hover: {
|
||||||
|
mode: mode,
|
||||||
|
intersect: intersect
|
||||||
|
},
|
||||||
|
legend: {
|
||||||
|
display: false
|
||||||
|
},
|
||||||
|
scales: {
|
||||||
|
yAxes: [{
|
||||||
|
// display: false,
|
||||||
|
gridLines: {
|
||||||
|
display: true,
|
||||||
|
lineWidth: '4px',
|
||||||
|
color: 'rgba(0, 0, 0, .2)',
|
||||||
|
zeroLineColor: 'transparent'
|
||||||
|
},
|
||||||
|
ticks: $.extend({
|
||||||
|
beginAtZero: true,
|
||||||
|
|
||||||
|
// Include a dollar sign in the ticks
|
||||||
|
callback: function (value) {
|
||||||
|
if (value >= 1000) {
|
||||||
|
value /= 1000
|
||||||
|
value += 'k'
|
||||||
|
}
|
||||||
|
|
||||||
|
return '$' + value
|
||||||
|
}
|
||||||
|
}, ticksStyle)
|
||||||
|
}],
|
||||||
|
xAxes: [{
|
||||||
|
display: true,
|
||||||
|
gridLines: {
|
||||||
|
display: false
|
||||||
|
},
|
||||||
|
ticks: ticksStyle
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
var $visitorsChart = $('#visitors-chart')
|
||||||
|
// eslint-disable-next-line no-unused-vars
|
||||||
|
var visitorsChart = new Chart($visitorsChart, {
|
||||||
|
data: {
|
||||||
|
labels: ['18th', '20th', '22nd', '24th', '26th', '28th', '30th'],
|
||||||
|
datasets: [{
|
||||||
|
type: 'line',
|
||||||
|
data: [100, 120, 170, 167, 180, 177, 160],
|
||||||
|
backgroundColor: 'transparent',
|
||||||
|
borderColor: '#007bff',
|
||||||
|
pointBorderColor: '#007bff',
|
||||||
|
pointBackgroundColor: '#007bff',
|
||||||
|
fill: false
|
||||||
|
// pointHoverBackgroundColor: '#007bff',
|
||||||
|
// pointHoverBorderColor : '#007bff'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'line',
|
||||||
|
data: [60, 80, 70, 67, 80, 77, 100],
|
||||||
|
backgroundColor: 'tansparent',
|
||||||
|
borderColor: '#ced4da',
|
||||||
|
pointBorderColor: '#ced4da',
|
||||||
|
pointBackgroundColor: '#ced4da',
|
||||||
|
fill: false
|
||||||
|
// pointHoverBackgroundColor: '#ced4da',
|
||||||
|
// pointHoverBorderColor : '#ced4da'
|
||||||
|
}]
|
||||||
|
},
|
||||||
|
options: {
|
||||||
|
maintainAspectRatio: false,
|
||||||
|
tooltips: {
|
||||||
|
mode: mode,
|
||||||
|
intersect: intersect
|
||||||
|
},
|
||||||
|
hover: {
|
||||||
|
mode: mode,
|
||||||
|
intersect: intersect
|
||||||
|
},
|
||||||
|
legend: {
|
||||||
|
display: false
|
||||||
|
},
|
||||||
|
scales: {
|
||||||
|
yAxes: [{
|
||||||
|
// display: false,
|
||||||
|
gridLines: {
|
||||||
|
display: true,
|
||||||
|
lineWidth: '4px',
|
||||||
|
color: 'rgba(0, 0, 0, .2)',
|
||||||
|
zeroLineColor: 'transparent'
|
||||||
|
},
|
||||||
|
ticks: $.extend({
|
||||||
|
beginAtZero: true,
|
||||||
|
suggestedMax: 200
|
||||||
|
}, ticksStyle)
|
||||||
|
}],
|
||||||
|
xAxes: [{
|
||||||
|
display: true,
|
||||||
|
gridLines: {
|
||||||
|
display: false
|
||||||
|
},
|
||||||
|
ticks: ticksStyle
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
|
||||||
|
// lgtm [js/unused-local-variable]
|
@ -1,818 +0,0 @@
|
|||||||
<!doctype html>
|
|
||||||
<html lang="en">
|
|
||||||
<!--begin::Head-->
|
|
||||||
<head>
|
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
||||||
<title>AdminLTE 4 | Icons</title>
|
|
||||||
<!--begin::Primary Meta Tags-->
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<meta name="title" content="AdminLTE 4 | Icons" />
|
|
||||||
<meta name="author" content="ColorlibHQ" />
|
|
||||||
<meta
|
|
||||||
name="description"
|
|
||||||
content="AdminLTE is a Free Bootstrap 5 Admin Dashboard, 30 example pages using Vanilla JS."
|
|
||||||
/>
|
|
||||||
<meta
|
|
||||||
name="keywords"
|
|
||||||
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"
|
|
||||||
/>
|
|
||||||
<!--end::Primary Meta Tags-->
|
|
||||||
<!--begin::Fonts-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/@fontsource/source-sans-3@5.0.12/index.css"
|
|
||||||
integrity="sha256-tXJfXfp6Ewt1ilPzLDtQnJV4hclT9XuaZUKyUvmyr+Q="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Fonts-->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/styles/overlayscrollbars.min.css"
|
|
||||||
integrity="sha256-tZHrRjVqNSRyWg2wbppGnT833E/Ys0DHWGwT04GiqQg="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<!--begin::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"
|
|
||||||
integrity="sha256-9kPW/n5nn53j4WMRYAxe9c1rCY96Oogo/MKSVdKzPmI="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<link rel="stylesheet" href="../../../dist/css/adminlte.css" />
|
|
||||||
<!--end::Required Plugin(AdminLTE)-->
|
|
||||||
</head>
|
|
||||||
<!--end::Head-->
|
|
||||||
<!--begin::Body-->
|
|
||||||
<body class="layout-fixed sidebar-expand-lg bg-body-tertiary">
|
|
||||||
<!--begin::App Wrapper-->
|
|
||||||
<div class="app-wrapper">
|
|
||||||
<!--begin::Header-->
|
|
||||||
<nav class="app-header navbar navbar-expand bg-body">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<!--begin::Start Navbar Links-->
|
|
||||||
<ul class="navbar-nav">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" data-lte-toggle="sidebar" href="#" role="button">
|
|
||||||
<i class="bi bi-list"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item d-none d-md-block"><a href="#" class="nav-link">Home</a></li>
|
|
||||||
<li class="nav-item d-none d-md-block"><a href="#" class="nav-link">Contact</a></li>
|
|
||||||
</ul>
|
|
||||||
<!--end::Start Navbar Links-->
|
|
||||||
<!--begin::End Navbar Links-->
|
|
||||||
<ul class="navbar-nav ms-auto">
|
|
||||||
<!--begin::Navbar Search-->
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" data-widget="navbar-search" href="#" role="button">
|
|
||||||
<i class="bi bi-search"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Navbar Search-->
|
|
||||||
<!--begin::Messages Dropdown Menu-->
|
|
||||||
<li class="nav-item dropdown">
|
|
||||||
<a class="nav-link" data-bs-toggle="dropdown" href="#">
|
|
||||||
<i class="bi bi-chat-text"></i>
|
|
||||||
<span class="navbar-badge badge text-bg-danger">3</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user1-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
Brad Diesel
|
|
||||||
<span class="float-end fs-7 text-danger"
|
|
||||||
><i class="bi bi-star-fill"></i
|
|
||||||
></span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">Call me whenever you can...</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user8-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
John Pierce
|
|
||||||
<span class="float-end fs-7 text-secondary">
|
|
||||||
<i class="bi bi-star-fill"></i>
|
|
||||||
</span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">I got your message bro</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user3-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
Nora Silvester
|
|
||||||
<span class="float-end fs-7 text-warning">
|
|
||||||
<i class="bi bi-star-fill"></i>
|
|
||||||
</span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">The subject goes here</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item dropdown-footer">See All Messages</a>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<!--end::Messages Dropdown Menu-->
|
|
||||||
<!--begin::Notifications Dropdown Menu-->
|
|
||||||
<li class="nav-item dropdown">
|
|
||||||
<a class="nav-link" data-bs-toggle="dropdown" href="#">
|
|
||||||
<i class="bi bi-bell-fill"></i>
|
|
||||||
<span class="navbar-badge badge text-bg-warning">15</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<span class="dropdown-item dropdown-header">15 Notifications</span>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-envelope me-2"></i> 4 new messages
|
|
||||||
<span class="float-end text-secondary fs-7">3 mins</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-people-fill me-2"></i> 8 friend requests
|
|
||||||
<span class="float-end text-secondary fs-7">12 hours</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-file-earmark-fill me-2"></i> 3 new reports
|
|
||||||
<span class="float-end text-secondary fs-7">2 days</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item dropdown-footer"> See All Notifications </a>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<!--end::Notifications Dropdown Menu-->
|
|
||||||
<!--begin::Fullscreen Toggle-->
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" href="#" data-lte-toggle="fullscreen">
|
|
||||||
<i data-lte-icon="maximize" class="bi bi-arrows-fullscreen"></i>
|
|
||||||
<i data-lte-icon="minimize" class="bi bi-fullscreen-exit" style="display: none"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Fullscreen Toggle-->
|
|
||||||
<!--begin::User Menu Dropdown-->
|
|
||||||
<li class="nav-item dropdown user-menu">
|
|
||||||
<a href="#" class="nav-link dropdown-toggle" data-bs-toggle="dropdown">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user2-160x160.jpg"
|
|
||||||
class="user-image rounded-circle shadow"
|
|
||||||
alt="User Image"
|
|
||||||
/>
|
|
||||||
<span class="d-none d-md-inline">Alexander Pierce</span>
|
|
||||||
</a>
|
|
||||||
<ul class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<!--begin::User Image-->
|
|
||||||
<li class="user-header text-bg-primary">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user2-160x160.jpg"
|
|
||||||
class="rounded-circle shadow"
|
|
||||||
alt="User Image"
|
|
||||||
/>
|
|
||||||
<p>
|
|
||||||
Alexander Pierce - Web Developer
|
|
||||||
<small>Member since Nov. 2023</small>
|
|
||||||
</p>
|
|
||||||
</li>
|
|
||||||
<!--end::User Image-->
|
|
||||||
<!--begin::Menu Body-->
|
|
||||||
<li class="user-body">
|
|
||||||
<!--begin::Row-->
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-4 text-center"><a href="#">Followers</a></div>
|
|
||||||
<div class="col-4 text-center"><a href="#">Sales</a></div>
|
|
||||||
<div class="col-4 text-center"><a href="#">Friends</a></div>
|
|
||||||
</div>
|
|
||||||
<!--end::Row-->
|
|
||||||
</li>
|
|
||||||
<!--end::Menu Body-->
|
|
||||||
<!--begin::Menu Footer-->
|
|
||||||
<li class="user-footer">
|
|
||||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
|
||||||
<a href="#" class="btn btn-default btn-flat float-end">Sign out</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Menu Footer-->
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<!--end::User Menu Dropdown-->
|
|
||||||
</ul>
|
|
||||||
<!--end::End Navbar Links-->
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</nav>
|
|
||||||
<!--end::Header-->
|
|
||||||
<!--begin::Sidebar-->
|
|
||||||
<aside class="app-sidebar bg-body-secondary shadow" data-bs-theme="dark">
|
|
||||||
<!--begin::Sidebar Brand-->
|
|
||||||
<div class="sidebar-brand">
|
|
||||||
<!--begin::Brand Link-->
|
|
||||||
<a href="../index.html" class="brand-link">
|
|
||||||
<!--begin::Brand Image-->
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/AdminLTELogo.png"
|
|
||||||
alt="AdminLTE Logo"
|
|
||||||
class="brand-image opacity-75 shadow"
|
|
||||||
/>
|
|
||||||
<!--end::Brand Image-->
|
|
||||||
<!--begin::Brand Text-->
|
|
||||||
<span class="brand-text fw-light">AdminLTE 4</span>
|
|
||||||
<!--end::Brand Text-->
|
|
||||||
</a>
|
|
||||||
<!--end::Brand Link-->
|
|
||||||
</div>
|
|
||||||
<!--end::Sidebar Brand-->
|
|
||||||
<!--begin::Sidebar Wrapper-->
|
|
||||||
<div class="sidebar-wrapper">
|
|
||||||
<nav class="mt-2">
|
|
||||||
<!--begin::Sidebar Menu-->
|
|
||||||
<ul
|
|
||||||
class="nav sidebar-menu flex-column"
|
|
||||||
data-lte-toggle="treeview"
|
|
||||||
role="menu"
|
|
||||||
data-accordion="false"
|
|
||||||
>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-speedometer"></i>
|
|
||||||
<p>
|
|
||||||
Dashboard
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../index.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../index2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../index3.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../generate/theme.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-palette"></i>
|
|
||||||
<p>Theme Generate</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-seam-fill"></i>
|
|
||||||
<p>
|
|
||||||
Widgets
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../widgets/small-box.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Small Box</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../widgets/info-box.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>info Box</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../widgets/cards.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Cards</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-clipboard-fill"></i>
|
|
||||||
<p>
|
|
||||||
Layout Options
|
|
||||||
<span class="nav-badge badge text-bg-secondary me-3">6</span>
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/unfixed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Default Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/fixed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Fixed Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/layout-custom-area.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Layout <small>+ Custom Area </small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/sidebar-mini.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/collapsed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini <small>+ Collapsed</small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/logo-switch.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini <small>+ Logo Switch</small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/layout-rtl.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Layout RTL</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item menu-open">
|
|
||||||
<a href="#" class="nav-link active">
|
|
||||||
<i class="nav-icon bi bi-tree-fill"></i>
|
|
||||||
<p>
|
|
||||||
UI Elements
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../UI/general.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>General</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../UI/icons.html" class="nav-link active">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Icons</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../UI/timeline.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Timeline</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-pencil-square"></i>
|
|
||||||
<p>
|
|
||||||
Forms
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../forms/general.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>General Elements</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-table"></i>
|
|
||||||
<p>
|
|
||||||
Tables
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../tables/simple.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Simple Tables</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">EXAMPLES</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Auth
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Version 1
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/login.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Login</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/register.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Register</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Version 2
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/login-v2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Login</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/register-v2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Register</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/lockscreen.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Lockscreen</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">DOCUMENTATIONS</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/introduction.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-download"></i>
|
|
||||||
<p>Installation</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/layout.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-grip-horizontal"></i>
|
|
||||||
<p>Layout</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/color-mode.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-star-half"></i>
|
|
||||||
<p>Color Mode</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-ui-checks-grid"></i>
|
|
||||||
<p>
|
|
||||||
Components
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/components/main-header.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Main Header</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/components/main-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Main Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-filetype-js"></i>
|
|
||||||
<p>
|
|
||||||
Javascript
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/javascript/treeview.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Treeview</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/browser-support.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-browser-edge"></i>
|
|
||||||
<p>Browser Support</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/how-to-contribute.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-hand-thumbs-up-fill"></i>
|
|
||||||
<p>How To Contribute</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/faq.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-question-circle-fill"></i>
|
|
||||||
<p>FAQ</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/license.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-patch-check-fill"></i>
|
|
||||||
<p>License</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">MULTI LEVEL EXAMPLE</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>Level 1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>
|
|
||||||
Level 1
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Level 2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>
|
|
||||||
Level 2
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Level 2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>Level 1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">LABELS</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-danger"></i>
|
|
||||||
<p class="text">Important</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-warning"></i>
|
|
||||||
<p>Warning</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-info"></i>
|
|
||||||
<p>Informational</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
<!--end::Sidebar Menu-->
|
|
||||||
</nav>
|
|
||||||
</div>
|
|
||||||
<!--end::Sidebar Wrapper-->
|
|
||||||
</aside>
|
|
||||||
<!--end::Sidebar-->
|
|
||||||
<!--begin::App Main-->
|
|
||||||
<main class="app-main">
|
|
||||||
<!--begin::App Content Header-->
|
|
||||||
<div class="app-content-header">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<!--begin::Row-->
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-sm-6"><h3 class="mb-0">Icons</h3></div>
|
|
||||||
<div class="col-sm-6">
|
|
||||||
<ol class="breadcrumb float-sm-end">
|
|
||||||
<li class="breadcrumb-item"><a href="#">Home</a></li>
|
|
||||||
<li class="breadcrumb-item active" aria-current="page">Icons</li>
|
|
||||||
</ol>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Row-->
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Content Header-->
|
|
||||||
<!--begin::App Content-->
|
|
||||||
<div class="app-content">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<!-- Timelime example -->
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-12">
|
|
||||||
<!-- The icons -->
|
|
||||||
<div class="col-12">
|
|
||||||
<div class="card card-primary card-outline">
|
|
||||||
<div class="card-header"><h3 class="card-title">Icons</h3></div>
|
|
||||||
<div class="card-body">
|
|
||||||
<p>You can use any font library you like with AdminLTE 4.</p>
|
|
||||||
<strong>Recommendations</strong>
|
|
||||||
<ul class="mt-1">
|
|
||||||
<li><a href="https://fontawesome.com/" target="_blank">Font Awesome</a></li>
|
|
||||||
<li>
|
|
||||||
<a href="https://useiconic.com/open/" target="_blank">Iconic Icons</a>
|
|
||||||
</li>
|
|
||||||
<li><a href="https://ionicons.com/" target="_blank">Ion Icons</a></li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- /.col -->
|
|
||||||
</div>
|
|
||||||
<!-- /.row -->
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Content-->
|
|
||||||
</main>
|
|
||||||
<!--end::App Main-->
|
|
||||||
<!--begin::Footer-->
|
|
||||||
<footer class="app-footer">
|
|
||||||
<!--begin::To the end-->
|
|
||||||
<div class="float-end d-none d-sm-inline">Anything you want</div>
|
|
||||||
<!--end::To the end-->
|
|
||||||
<!--begin::Copyright-->
|
|
||||||
<strong>
|
|
||||||
Copyright © 2014-2024
|
|
||||||
<a href="https://adminlte.io" class="text-decoration-none">AdminLTE.io</a>.
|
|
||||||
</strong>
|
|
||||||
All rights reserved.
|
|
||||||
<!--end::Copyright-->
|
|
||||||
</footer>
|
|
||||||
<!--end::Footer-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Wrapper-->
|
|
||||||
<!--begin::Script-->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/browser/overlayscrollbars.browser.es6.min.js"
|
|
||||||
integrity="sha256-dghWARbRe2eLlIJ56wNB+b760ywulqK3DzZYEpsg2fQ="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)--><!--begin::Required Plugin(popperjs for Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js"
|
|
||||||
integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(popperjs for Bootstrap 5)--><!--begin::Required Plugin(Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js"
|
|
||||||
integrity="sha384-0pUGZvbkm6XF6gxjEnlmuGrJXVbNuzT9qBBavbLwCsOGabYfZo0T0to5eqruptLy"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(Bootstrap 5)--><!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<script src="../../../dist/js/adminlte.js"></script>
|
|
||||||
<!--end::Required Plugin(AdminLTE)--><!--begin::OverlayScrollbars Configure-->
|
|
||||||
<script>
|
|
||||||
const SELECTOR_SIDEBAR_WRAPPER = '.sidebar-wrapper';
|
|
||||||
const Default = {
|
|
||||||
scrollbarTheme: 'os-theme-light',
|
|
||||||
scrollbarAutoHide: 'leave',
|
|
||||||
scrollbarClickScroll: true,
|
|
||||||
};
|
|
||||||
document.addEventListener('DOMContentLoaded', function () {
|
|
||||||
const sidebarWrapper = document.querySelector(SELECTOR_SIDEBAR_WRAPPER);
|
|
||||||
if (sidebarWrapper && typeof OverlayScrollbarsGlobal?.OverlayScrollbars !== 'undefined') {
|
|
||||||
OverlayScrollbarsGlobal.OverlayScrollbars(sidebarWrapper, {
|
|
||||||
scrollbars: {
|
|
||||||
theme: Default.scrollbarTheme,
|
|
||||||
autoHide: Default.scrollbarAutoHide,
|
|
||||||
clickScroll: Default.scrollbarClickScroll,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<!--end::OverlayScrollbars Configure-->
|
|
||||||
<!--end::Script-->
|
|
||||||
</body>
|
|
||||||
<!--end::Body-->
|
|
||||||
</html>
|
|
@ -1,896 +0,0 @@
|
|||||||
<!doctype html>
|
|
||||||
<html lang="en">
|
|
||||||
<!--begin::Head-->
|
|
||||||
<head>
|
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
||||||
<title>AdminLTE 4 | Timeline Elements</title>
|
|
||||||
<!--begin::Primary Meta Tags-->
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<meta name="title" content="AdminLTE 4 | Timeline Elements" />
|
|
||||||
<meta name="author" content="ColorlibHQ" />
|
|
||||||
<meta
|
|
||||||
name="description"
|
|
||||||
content="AdminLTE is a Free Bootstrap 5 Admin Dashboard, 30 example pages using Vanilla JS."
|
|
||||||
/>
|
|
||||||
<meta
|
|
||||||
name="keywords"
|
|
||||||
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"
|
|
||||||
/>
|
|
||||||
<!--end::Primary Meta Tags-->
|
|
||||||
<!--begin::Fonts-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/@fontsource/source-sans-3@5.0.12/index.css"
|
|
||||||
integrity="sha256-tXJfXfp6Ewt1ilPzLDtQnJV4hclT9XuaZUKyUvmyr+Q="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Fonts-->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/styles/overlayscrollbars.min.css"
|
|
||||||
integrity="sha256-tZHrRjVqNSRyWg2wbppGnT833E/Ys0DHWGwT04GiqQg="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<!--begin::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"
|
|
||||||
integrity="sha256-9kPW/n5nn53j4WMRYAxe9c1rCY96Oogo/MKSVdKzPmI="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<link rel="stylesheet" href="../../../dist/css/adminlte.css" />
|
|
||||||
<!--end::Required Plugin(AdminLTE)-->
|
|
||||||
</head>
|
|
||||||
<!--end::Head-->
|
|
||||||
<!--begin::Body-->
|
|
||||||
<body class="layout-fixed sidebar-expand-lg bg-body-tertiary">
|
|
||||||
<!--begin::App Wrapper-->
|
|
||||||
<div class="app-wrapper">
|
|
||||||
<!--begin::Header-->
|
|
||||||
<nav class="app-header navbar navbar-expand bg-body">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<!--begin::Start Navbar Links-->
|
|
||||||
<ul class="navbar-nav">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" data-lte-toggle="sidebar" href="#" role="button">
|
|
||||||
<i class="bi bi-list"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item d-none d-md-block"><a href="#" class="nav-link">Home</a></li>
|
|
||||||
<li class="nav-item d-none d-md-block"><a href="#" class="nav-link">Contact</a></li>
|
|
||||||
</ul>
|
|
||||||
<!--end::Start Navbar Links-->
|
|
||||||
<!--begin::End Navbar Links-->
|
|
||||||
<ul class="navbar-nav ms-auto">
|
|
||||||
<!--begin::Navbar Search-->
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" data-widget="navbar-search" href="#" role="button">
|
|
||||||
<i class="bi bi-search"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Navbar Search-->
|
|
||||||
<!--begin::Messages Dropdown Menu-->
|
|
||||||
<li class="nav-item dropdown">
|
|
||||||
<a class="nav-link" data-bs-toggle="dropdown" href="#">
|
|
||||||
<i class="bi bi-chat-text"></i>
|
|
||||||
<span class="navbar-badge badge text-bg-danger">3</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user1-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
Brad Diesel
|
|
||||||
<span class="float-end fs-7 text-danger"
|
|
||||||
><i class="bi bi-star-fill"></i
|
|
||||||
></span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">Call me whenever you can...</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user8-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
John Pierce
|
|
||||||
<span class="float-end fs-7 text-secondary">
|
|
||||||
<i class="bi bi-star-fill"></i>
|
|
||||||
</span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">I got your message bro</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user3-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
Nora Silvester
|
|
||||||
<span class="float-end fs-7 text-warning">
|
|
||||||
<i class="bi bi-star-fill"></i>
|
|
||||||
</span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">The subject goes here</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item dropdown-footer">See All Messages</a>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<!--end::Messages Dropdown Menu-->
|
|
||||||
<!--begin::Notifications Dropdown Menu-->
|
|
||||||
<li class="nav-item dropdown">
|
|
||||||
<a class="nav-link" data-bs-toggle="dropdown" href="#">
|
|
||||||
<i class="bi bi-bell-fill"></i>
|
|
||||||
<span class="navbar-badge badge text-bg-warning">15</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<span class="dropdown-item dropdown-header">15 Notifications</span>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-envelope me-2"></i> 4 new messages
|
|
||||||
<span class="float-end text-secondary fs-7">3 mins</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-people-fill me-2"></i> 8 friend requests
|
|
||||||
<span class="float-end text-secondary fs-7">12 hours</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-file-earmark-fill me-2"></i> 3 new reports
|
|
||||||
<span class="float-end text-secondary fs-7">2 days</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item dropdown-footer"> See All Notifications </a>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<!--end::Notifications Dropdown Menu-->
|
|
||||||
<!--begin::Fullscreen Toggle-->
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" href="#" data-lte-toggle="fullscreen">
|
|
||||||
<i data-lte-icon="maximize" class="bi bi-arrows-fullscreen"></i>
|
|
||||||
<i data-lte-icon="minimize" class="bi bi-fullscreen-exit" style="display: none"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Fullscreen Toggle-->
|
|
||||||
<!--begin::User Menu Dropdown-->
|
|
||||||
<li class="nav-item dropdown user-menu">
|
|
||||||
<a href="#" class="nav-link dropdown-toggle" data-bs-toggle="dropdown">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user2-160x160.jpg"
|
|
||||||
class="user-image rounded-circle shadow"
|
|
||||||
alt="User Image"
|
|
||||||
/>
|
|
||||||
<span class="d-none d-md-inline">Alexander Pierce</span>
|
|
||||||
</a>
|
|
||||||
<ul class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<!--begin::User Image-->
|
|
||||||
<li class="user-header text-bg-primary">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user2-160x160.jpg"
|
|
||||||
class="rounded-circle shadow"
|
|
||||||
alt="User Image"
|
|
||||||
/>
|
|
||||||
<p>
|
|
||||||
Alexander Pierce - Web Developer
|
|
||||||
<small>Member since Nov. 2023</small>
|
|
||||||
</p>
|
|
||||||
</li>
|
|
||||||
<!--end::User Image-->
|
|
||||||
<!--begin::Menu Body-->
|
|
||||||
<li class="user-body">
|
|
||||||
<!--begin::Row-->
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-4 text-center"><a href="#">Followers</a></div>
|
|
||||||
<div class="col-4 text-center"><a href="#">Sales</a></div>
|
|
||||||
<div class="col-4 text-center"><a href="#">Friends</a></div>
|
|
||||||
</div>
|
|
||||||
<!--end::Row-->
|
|
||||||
</li>
|
|
||||||
<!--end::Menu Body-->
|
|
||||||
<!--begin::Menu Footer-->
|
|
||||||
<li class="user-footer">
|
|
||||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
|
||||||
<a href="#" class="btn btn-default btn-flat float-end">Sign out</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Menu Footer-->
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<!--end::User Menu Dropdown-->
|
|
||||||
</ul>
|
|
||||||
<!--end::End Navbar Links-->
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</nav>
|
|
||||||
<!--end::Header-->
|
|
||||||
<!--begin::Sidebar-->
|
|
||||||
<aside class="app-sidebar bg-body-secondary shadow" data-bs-theme="dark">
|
|
||||||
<!--begin::Sidebar Brand-->
|
|
||||||
<div class="sidebar-brand">
|
|
||||||
<!--begin::Brand Link-->
|
|
||||||
<a href="../index.html" class="brand-link">
|
|
||||||
<!--begin::Brand Image-->
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/AdminLTELogo.png"
|
|
||||||
alt="AdminLTE Logo"
|
|
||||||
class="brand-image opacity-75 shadow"
|
|
||||||
/>
|
|
||||||
<!--end::Brand Image-->
|
|
||||||
<!--begin::Brand Text-->
|
|
||||||
<span class="brand-text fw-light">AdminLTE 4</span>
|
|
||||||
<!--end::Brand Text-->
|
|
||||||
</a>
|
|
||||||
<!--end::Brand Link-->
|
|
||||||
</div>
|
|
||||||
<!--end::Sidebar Brand-->
|
|
||||||
<!--begin::Sidebar Wrapper-->
|
|
||||||
<div class="sidebar-wrapper">
|
|
||||||
<nav class="mt-2">
|
|
||||||
<!--begin::Sidebar Menu-->
|
|
||||||
<ul
|
|
||||||
class="nav sidebar-menu flex-column"
|
|
||||||
data-lte-toggle="treeview"
|
|
||||||
role="menu"
|
|
||||||
data-accordion="false"
|
|
||||||
>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-speedometer"></i>
|
|
||||||
<p>
|
|
||||||
Dashboard
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../index.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../index2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../index3.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../generate/theme.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-palette"></i>
|
|
||||||
<p>Theme Generate</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-seam-fill"></i>
|
|
||||||
<p>
|
|
||||||
Widgets
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../widgets/small-box.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Small Box</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../widgets/info-box.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>info Box</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../widgets/cards.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Cards</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-clipboard-fill"></i>
|
|
||||||
<p>
|
|
||||||
Layout Options
|
|
||||||
<span class="nav-badge badge text-bg-secondary me-3">6</span>
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/unfixed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Default Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/fixed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Fixed Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/layout-custom-area.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Layout <small>+ Custom Area </small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/sidebar-mini.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/collapsed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini <small>+ Collapsed</small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/logo-switch.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini <small>+ Logo Switch</small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/layout-rtl.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Layout RTL</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item menu-open">
|
|
||||||
<a href="#" class="nav-link active">
|
|
||||||
<i class="nav-icon bi bi-tree-fill"></i>
|
|
||||||
<p>
|
|
||||||
UI Elements
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../UI/general.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>General</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../UI/icons.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Icons</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../UI/timeline.html" class="nav-link active">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Timeline</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-pencil-square"></i>
|
|
||||||
<p>
|
|
||||||
Forms
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../forms/general.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>General Elements</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-table"></i>
|
|
||||||
<p>
|
|
||||||
Tables
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../tables/simple.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Simple Tables</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">EXAMPLES</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Auth
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Version 1
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/login.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Login</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/register.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Register</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Version 2
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/login-v2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Login</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/register-v2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Register</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/lockscreen.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Lockscreen</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">DOCUMENTATIONS</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/introduction.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-download"></i>
|
|
||||||
<p>Installation</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/layout.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-grip-horizontal"></i>
|
|
||||||
<p>Layout</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/color-mode.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-star-half"></i>
|
|
||||||
<p>Color Mode</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-ui-checks-grid"></i>
|
|
||||||
<p>
|
|
||||||
Components
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/components/main-header.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Main Header</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/components/main-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Main Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-filetype-js"></i>
|
|
||||||
<p>
|
|
||||||
Javascript
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/javascript/treeview.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Treeview</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/browser-support.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-browser-edge"></i>
|
|
||||||
<p>Browser Support</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/how-to-contribute.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-hand-thumbs-up-fill"></i>
|
|
||||||
<p>How To Contribute</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/faq.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-question-circle-fill"></i>
|
|
||||||
<p>FAQ</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/license.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-patch-check-fill"></i>
|
|
||||||
<p>License</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">MULTI LEVEL EXAMPLE</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>Level 1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>
|
|
||||||
Level 1
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Level 2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>
|
|
||||||
Level 2
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Level 2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>Level 1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">LABELS</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-danger"></i>
|
|
||||||
<p class="text">Important</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-warning"></i>
|
|
||||||
<p>Warning</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-info"></i>
|
|
||||||
<p>Informational</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
<!--end::Sidebar Menu-->
|
|
||||||
</nav>
|
|
||||||
</div>
|
|
||||||
<!--end::Sidebar Wrapper-->
|
|
||||||
</aside>
|
|
||||||
<!--end::Sidebar-->
|
|
||||||
<!--begin::App Main-->
|
|
||||||
<main class="app-main">
|
|
||||||
<!--begin::App Content Header-->
|
|
||||||
<div class="app-content-header">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<!--begin::Row-->
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-sm-6"><h3 class="mb-0">Timeline</h3></div>
|
|
||||||
<div class="col-sm-6">
|
|
||||||
<ol class="breadcrumb float-sm-end">
|
|
||||||
<li class="breadcrumb-item"><a href="#">Home</a></li>
|
|
||||||
<li class="breadcrumb-item active" aria-current="page">Timeline</li>
|
|
||||||
</ol>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Row-->
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Content Header-->
|
|
||||||
<!--begin::App Content-->
|
|
||||||
<div class="app-content">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<!-- Timelime example -->
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-md-12">
|
|
||||||
<!-- The time line -->
|
|
||||||
<div class="timeline">
|
|
||||||
<!-- timeline time label -->
|
|
||||||
<div class="time-label"><span class="text-bg-danger">10 Feb. 2023</span></div>
|
|
||||||
<!-- /.timeline-label -->
|
|
||||||
<!-- timeline item -->
|
|
||||||
<div>
|
|
||||||
<i class="timeline-icon bi bi-envelope text-bg-primary"></i>
|
|
||||||
<div class="timeline-item">
|
|
||||||
<span class="time"> <i class="bi bi-clock-fill"></i> 12:05 </span>
|
|
||||||
<h3 class="timeline-header">
|
|
||||||
<a href="#">Support Team</a> sent you an email
|
|
||||||
</h3>
|
|
||||||
<div class="timeline-body">
|
|
||||||
Etsy doostang zoodles disqus groupon greplin oooj voxy zoodles, weebly ning
|
|
||||||
heekya handango imeem plugg dopplr jibjab, movity jajah plickers sifteo
|
|
||||||
edmodo ifttt zimbra. Babblely odeo kaboodle quora plaxo ideeli hulu weebly
|
|
||||||
balihoo...
|
|
||||||
</div>
|
|
||||||
<div class="timeline-footer">
|
|
||||||
<a class="btn btn-primary btn-sm">Read more</a>
|
|
||||||
<a class="btn btn-danger btn-sm">Delete</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- END timeline item -->
|
|
||||||
<!-- timeline item -->
|
|
||||||
<div>
|
|
||||||
<i class="timeline-icon bi bi-person text-bg-success"></i>
|
|
||||||
<div class="timeline-item">
|
|
||||||
<span class="time"> <i class="bi bi-clock-fill"></i> 5 mins ago </span>
|
|
||||||
<h3 class="timeline-header no-border">
|
|
||||||
<a href="#">Sarah Young</a> accepted your friend request
|
|
||||||
</h3>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- END timeline item -->
|
|
||||||
<!-- timeline item -->
|
|
||||||
<div>
|
|
||||||
<i class="timeline-icon bi bi-chat-text-fill text-bg-warning"></i>
|
|
||||||
<div class="timeline-item">
|
|
||||||
<span class="time"> <i class="bi bi-clock-fill"></i> 27 mins ago </span>
|
|
||||||
<h3 class="timeline-header">
|
|
||||||
<a href="#">Jay White</a> commented on your post
|
|
||||||
</h3>
|
|
||||||
<div class="timeline-body">
|
|
||||||
Take me to your leader! Switzerland is small and neutral! We are more like
|
|
||||||
Germany, ambitious and misunderstood!
|
|
||||||
</div>
|
|
||||||
<div class="timeline-footer">
|
|
||||||
<a class="btn btn-warning btn-sm">View comment</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- END timeline item -->
|
|
||||||
<!-- timeline time label -->
|
|
||||||
<div class="time-label"><span class="text-bg-success">3 Jan. 2023</span></div>
|
|
||||||
<!-- /.timeline-label -->
|
|
||||||
<!-- timeline item -->
|
|
||||||
<div>
|
|
||||||
<i class="timeline-icon bi bi-camera text-bg-primary"></i>
|
|
||||||
<div class="timeline-item">
|
|
||||||
<span class="time"> <i class="bi bi-clock-fill"></i> 2 days ago </span>
|
|
||||||
<h3 class="timeline-header"><a href="#">Mina Lee</a> uploaded new photos</h3>
|
|
||||||
<div class="timeline-body">
|
|
||||||
<img src="../../../dist/assets/img/user1-128x128.jpg" alt="..." />
|
|
||||||
<img src="../../../dist/assets/img/user1-128x128.jpg" alt="..." />
|
|
||||||
<img src="../../../dist/assets/img/user1-128x128.jpg" alt="..." />
|
|
||||||
<img src="../../../dist/assets/img/user1-128x128.jpg" alt="..." />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- END timeline item -->
|
|
||||||
<!-- timeline item -->
|
|
||||||
<div>
|
|
||||||
<i class="timeline-icon bi bi-camera-film text-bg-info"></i>
|
|
||||||
<div class="timeline-item">
|
|
||||||
<span class="time"> <i class="bi bi-clock-fill"></i> 5 days ago </span>
|
|
||||||
<h3 class="timeline-header"><a href="#">Mr. Doe</a> shared a video</h3>
|
|
||||||
<div class="timeline-body">
|
|
||||||
<div class="ratio ratio-16x9">
|
|
||||||
<iframe
|
|
||||||
src="https://www.youtube.com/embed/tMWkeBIohBs"
|
|
||||||
allowfullscreen
|
|
||||||
></iframe>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="timeline-footer">
|
|
||||||
<a href="#" class="btn btn-sm text-bg-warning"> See comments </a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- END timeline item -->
|
|
||||||
<div><i class="timeline-icon bi bi-clock-fill text-bg-secondary"></i></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- /.col -->
|
|
||||||
</div>
|
|
||||||
<!-- /.row -->
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Content-->
|
|
||||||
</main>
|
|
||||||
<!--end::App Main-->
|
|
||||||
<!--begin::Footer-->
|
|
||||||
<footer class="app-footer">
|
|
||||||
<!--begin::To the end-->
|
|
||||||
<div class="float-end d-none d-sm-inline">Anything you want</div>
|
|
||||||
<!--end::To the end-->
|
|
||||||
<!--begin::Copyright-->
|
|
||||||
<strong>
|
|
||||||
Copyright © 2014-2024
|
|
||||||
<a href="https://adminlte.io" class="text-decoration-none">AdminLTE.io</a>.
|
|
||||||
</strong>
|
|
||||||
All rights reserved.
|
|
||||||
<!--end::Copyright-->
|
|
||||||
</footer>
|
|
||||||
<!--end::Footer-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Wrapper-->
|
|
||||||
<!--begin::Script-->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/browser/overlayscrollbars.browser.es6.min.js"
|
|
||||||
integrity="sha256-dghWARbRe2eLlIJ56wNB+b760ywulqK3DzZYEpsg2fQ="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)--><!--begin::Required Plugin(popperjs for Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js"
|
|
||||||
integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(popperjs for Bootstrap 5)--><!--begin::Required Plugin(Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js"
|
|
||||||
integrity="sha384-0pUGZvbkm6XF6gxjEnlmuGrJXVbNuzT9qBBavbLwCsOGabYfZo0T0to5eqruptLy"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(Bootstrap 5)--><!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<script src="../../../dist/js/adminlte.js"></script>
|
|
||||||
<!--end::Required Plugin(AdminLTE)--><!--begin::OverlayScrollbars Configure-->
|
|
||||||
<script>
|
|
||||||
const SELECTOR_SIDEBAR_WRAPPER = '.sidebar-wrapper';
|
|
||||||
const Default = {
|
|
||||||
scrollbarTheme: 'os-theme-light',
|
|
||||||
scrollbarAutoHide: 'leave',
|
|
||||||
scrollbarClickScroll: true,
|
|
||||||
};
|
|
||||||
document.addEventListener('DOMContentLoaded', function () {
|
|
||||||
const sidebarWrapper = document.querySelector(SELECTOR_SIDEBAR_WRAPPER);
|
|
||||||
if (sidebarWrapper && typeof OverlayScrollbarsGlobal?.OverlayScrollbars !== 'undefined') {
|
|
||||||
OverlayScrollbarsGlobal.OverlayScrollbars(sidebarWrapper, {
|
|
||||||
scrollbars: {
|
|
||||||
theme: Default.scrollbarTheme,
|
|
||||||
autoHide: Default.scrollbarAutoHide,
|
|
||||||
clickScroll: Default.scrollbarClickScroll,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<!--end::OverlayScrollbars Configure-->
|
|
||||||
<!--end::Script-->
|
|
||||||
</body>
|
|
||||||
<!--end::Body-->
|
|
||||||
</html>
|
|
@ -1,851 +0,0 @@
|
|||||||
<!doctype html>
|
|
||||||
<html lang="en">
|
|
||||||
<!--begin::Head-->
|
|
||||||
<head>
|
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
||||||
<title>Browser Support | AdminLTE 4</title>
|
|
||||||
<!--begin::Primary Meta Tags-->
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<meta name="title" content="Browser Support | AdminLTE 4" />
|
|
||||||
<meta name="author" content="ColorlibHQ" />
|
|
||||||
<meta
|
|
||||||
name="description"
|
|
||||||
content="AdminLTE is a Free Bootstrap 5 Admin Dashboard, 30 example pages using Vanilla JS."
|
|
||||||
/>
|
|
||||||
<meta
|
|
||||||
name="keywords"
|
|
||||||
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"
|
|
||||||
/>
|
|
||||||
<!--end::Primary Meta Tags-->
|
|
||||||
<!--begin::Fonts-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/@fontsource/source-sans-3@5.0.12/index.css"
|
|
||||||
integrity="sha256-tXJfXfp6Ewt1ilPzLDtQnJV4hclT9XuaZUKyUvmyr+Q="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Fonts-->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/styles/overlayscrollbars.min.css"
|
|
||||||
integrity="sha256-tZHrRjVqNSRyWg2wbppGnT833E/Ys0DHWGwT04GiqQg="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<!--begin::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"
|
|
||||||
integrity="sha256-9kPW/n5nn53j4WMRYAxe9c1rCY96Oogo/MKSVdKzPmI="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<link rel="stylesheet" href="../../../dist/css/adminlte.css" />
|
|
||||||
<!--end::Required Plugin(AdminLTE)-->
|
|
||||||
<style>
|
|
||||||
[data-astro-image] {
|
|
||||||
width: 100%;
|
|
||||||
height: auto;
|
|
||||||
object-fit: var(--fit);
|
|
||||||
object-position: var(--pos);
|
|
||||||
aspect-ratio: var(--w) / var(--h);
|
|
||||||
}
|
|
||||||
[data-astro-image='responsive'] {
|
|
||||||
max-width: calc(var(--w) * 1px);
|
|
||||||
max-height: calc(var(--h) * 1px);
|
|
||||||
}
|
|
||||||
[data-astro-image='fixed'] {
|
|
||||||
width: calc(var(--w) * 1px);
|
|
||||||
height: calc(var(--h) * 1px);
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<!--end::Head-->
|
|
||||||
<!--begin::Body-->
|
|
||||||
<body class="layout-fixed sidebar-expand-lg bg-body-tertiary">
|
|
||||||
<!--begin::App Wrapper-->
|
|
||||||
<div class="app-wrapper">
|
|
||||||
<!--begin::Header-->
|
|
||||||
<nav class="app-header navbar navbar-expand bg-body">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<!--begin::Start Navbar Links-->
|
|
||||||
<ul class="navbar-nav">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" data-lte-toggle="sidebar" href="#" role="button">
|
|
||||||
<i class="bi bi-list"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item d-none d-md-block"><a href="#" class="nav-link">Home</a></li>
|
|
||||||
<li class="nav-item d-none d-md-block"><a href="#" class="nav-link">Contact</a></li>
|
|
||||||
</ul>
|
|
||||||
<!--end::Start Navbar Links-->
|
|
||||||
<!--begin::End Navbar Links-->
|
|
||||||
<ul class="navbar-nav ms-auto">
|
|
||||||
<!--begin::Navbar Search-->
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" data-widget="navbar-search" href="#" role="button">
|
|
||||||
<i class="bi bi-search"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Navbar Search-->
|
|
||||||
<!--begin::Messages Dropdown Menu-->
|
|
||||||
<li class="nav-item dropdown">
|
|
||||||
<a class="nav-link" data-bs-toggle="dropdown" href="#">
|
|
||||||
<i class="bi bi-chat-text"></i>
|
|
||||||
<span class="navbar-badge badge text-bg-danger">3</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user1-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
Brad Diesel
|
|
||||||
<span class="float-end fs-7 text-danger"
|
|
||||||
><i class="bi bi-star-fill"></i
|
|
||||||
></span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">Call me whenever you can...</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user8-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
John Pierce
|
|
||||||
<span class="float-end fs-7 text-secondary">
|
|
||||||
<i class="bi bi-star-fill"></i>
|
|
||||||
</span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">I got your message bro</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user3-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
Nora Silvester
|
|
||||||
<span class="float-end fs-7 text-warning">
|
|
||||||
<i class="bi bi-star-fill"></i>
|
|
||||||
</span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">The subject goes here</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item dropdown-footer">See All Messages</a>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<!--end::Messages Dropdown Menu-->
|
|
||||||
<!--begin::Notifications Dropdown Menu-->
|
|
||||||
<li class="nav-item dropdown">
|
|
||||||
<a class="nav-link" data-bs-toggle="dropdown" href="#">
|
|
||||||
<i class="bi bi-bell-fill"></i>
|
|
||||||
<span class="navbar-badge badge text-bg-warning">15</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<span class="dropdown-item dropdown-header">15 Notifications</span>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-envelope me-2"></i> 4 new messages
|
|
||||||
<span class="float-end text-secondary fs-7">3 mins</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-people-fill me-2"></i> 8 friend requests
|
|
||||||
<span class="float-end text-secondary fs-7">12 hours</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-file-earmark-fill me-2"></i> 3 new reports
|
|
||||||
<span class="float-end text-secondary fs-7">2 days</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item dropdown-footer"> See All Notifications </a>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<!--end::Notifications Dropdown Menu-->
|
|
||||||
<!--begin::Fullscreen Toggle-->
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" href="#" data-lte-toggle="fullscreen">
|
|
||||||
<i data-lte-icon="maximize" class="bi bi-arrows-fullscreen"></i>
|
|
||||||
<i data-lte-icon="minimize" class="bi bi-fullscreen-exit" style="display: none"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Fullscreen Toggle-->
|
|
||||||
<!--begin::User Menu Dropdown-->
|
|
||||||
<li class="nav-item dropdown user-menu">
|
|
||||||
<a href="#" class="nav-link dropdown-toggle" data-bs-toggle="dropdown">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user2-160x160.jpg"
|
|
||||||
class="user-image rounded-circle shadow"
|
|
||||||
alt="User Image"
|
|
||||||
/>
|
|
||||||
<span class="d-none d-md-inline">Alexander Pierce</span>
|
|
||||||
</a>
|
|
||||||
<ul class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<!--begin::User Image-->
|
|
||||||
<li class="user-header text-bg-primary">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user2-160x160.jpg"
|
|
||||||
class="rounded-circle shadow"
|
|
||||||
alt="User Image"
|
|
||||||
/>
|
|
||||||
<p>
|
|
||||||
Alexander Pierce - Web Developer
|
|
||||||
<small>Member since Nov. 2023</small>
|
|
||||||
</p>
|
|
||||||
</li>
|
|
||||||
<!--end::User Image-->
|
|
||||||
<!--begin::Menu Body-->
|
|
||||||
<li class="user-body">
|
|
||||||
<!--begin::Row-->
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-4 text-center"><a href="#">Followers</a></div>
|
|
||||||
<div class="col-4 text-center"><a href="#">Sales</a></div>
|
|
||||||
<div class="col-4 text-center"><a href="#">Friends</a></div>
|
|
||||||
</div>
|
|
||||||
<!--end::Row-->
|
|
||||||
</li>
|
|
||||||
<!--end::Menu Body-->
|
|
||||||
<!--begin::Menu Footer-->
|
|
||||||
<li class="user-footer">
|
|
||||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
|
||||||
<a href="#" class="btn btn-default btn-flat float-end">Sign out</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Menu Footer-->
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<!--end::User Menu Dropdown-->
|
|
||||||
</ul>
|
|
||||||
<!--end::End Navbar Links-->
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</nav>
|
|
||||||
<!--end::Header-->
|
|
||||||
<!--begin::Sidebar-->
|
|
||||||
<aside class="app-sidebar bg-body-secondary shadow" data-bs-theme="dark">
|
|
||||||
<!--begin::Sidebar Brand-->
|
|
||||||
<div class="sidebar-brand">
|
|
||||||
<!--begin::Brand Link-->
|
|
||||||
<a href="../index.html" class="brand-link">
|
|
||||||
<!--begin::Brand Image-->
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/AdminLTELogo.png"
|
|
||||||
alt="AdminLTE Logo"
|
|
||||||
class="brand-image opacity-75 shadow"
|
|
||||||
/>
|
|
||||||
<!--end::Brand Image-->
|
|
||||||
<!--begin::Brand Text-->
|
|
||||||
<span class="brand-text fw-light">AdminLTE 4</span>
|
|
||||||
<!--end::Brand Text-->
|
|
||||||
</a>
|
|
||||||
<!--end::Brand Link-->
|
|
||||||
</div>
|
|
||||||
<!--end::Sidebar Brand-->
|
|
||||||
<!--begin::Sidebar Wrapper-->
|
|
||||||
<div class="sidebar-wrapper">
|
|
||||||
<nav class="mt-2">
|
|
||||||
<!--begin::Sidebar Menu-->
|
|
||||||
<ul
|
|
||||||
class="nav sidebar-menu flex-column"
|
|
||||||
data-lte-toggle="treeview"
|
|
||||||
role="menu"
|
|
||||||
data-accordion="false"
|
|
||||||
>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-speedometer"></i>
|
|
||||||
<p>
|
|
||||||
Dashboard
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../index.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../index2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../index3.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../generate/theme.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-palette"></i>
|
|
||||||
<p>Theme Generate</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-seam-fill"></i>
|
|
||||||
<p>
|
|
||||||
Widgets
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../widgets/small-box.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Small Box</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../widgets/info-box.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>info Box</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../widgets/cards.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Cards</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-clipboard-fill"></i>
|
|
||||||
<p>
|
|
||||||
Layout Options
|
|
||||||
<span class="nav-badge badge text-bg-secondary me-3">6</span>
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/unfixed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Default Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/fixed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Fixed Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/layout-custom-area.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Layout <small>+ Custom Area </small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/sidebar-mini.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/collapsed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini <small>+ Collapsed</small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/logo-switch.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini <small>+ Logo Switch</small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/layout-rtl.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Layout RTL</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-tree-fill"></i>
|
|
||||||
<p>
|
|
||||||
UI Elements
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../UI/general.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>General</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../UI/icons.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Icons</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../UI/timeline.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Timeline</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-pencil-square"></i>
|
|
||||||
<p>
|
|
||||||
Forms
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../forms/general.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>General Elements</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-table"></i>
|
|
||||||
<p>
|
|
||||||
Tables
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../tables/simple.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Simple Tables</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">EXAMPLES</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Auth
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Version 1
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/login.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Login</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/register.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Register</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Version 2
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/login-v2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Login</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/register-v2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Register</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/lockscreen.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Lockscreen</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">DOCUMENTATIONS</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/introduction.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-download"></i>
|
|
||||||
<p>Installation</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/layout.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-grip-horizontal"></i>
|
|
||||||
<p>Layout</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/color-mode.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-star-half"></i>
|
|
||||||
<p>Color Mode</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-ui-checks-grid"></i>
|
|
||||||
<p>
|
|
||||||
Components
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/components/main-header.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Main Header</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/components/main-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Main Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-filetype-js"></i>
|
|
||||||
<p>
|
|
||||||
Javascript
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/javascript/treeview.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Treeview</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/browser-support.html" class="nav-link active">
|
|
||||||
<i class="nav-icon bi bi-browser-edge"></i>
|
|
||||||
<p>Browser Support</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/how-to-contribute.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-hand-thumbs-up-fill"></i>
|
|
||||||
<p>How To Contribute</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/faq.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-question-circle-fill"></i>
|
|
||||||
<p>FAQ</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/license.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-patch-check-fill"></i>
|
|
||||||
<p>License</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">MULTI LEVEL EXAMPLE</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>Level 1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>
|
|
||||||
Level 1
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Level 2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>
|
|
||||||
Level 2
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Level 2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>Level 1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">LABELS</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-danger"></i>
|
|
||||||
<p class="text">Important</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-warning"></i>
|
|
||||||
<p>Warning</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-info"></i>
|
|
||||||
<p>Informational</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
<!--end::Sidebar Menu-->
|
|
||||||
</nav>
|
|
||||||
</div>
|
|
||||||
<!--end::Sidebar Wrapper-->
|
|
||||||
</aside>
|
|
||||||
<!--end::Sidebar-->
|
|
||||||
<!--begin::App Main-->
|
|
||||||
<main class="app-main">
|
|
||||||
<!--begin::App Content Header-->
|
|
||||||
<div class="app-content-header">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<!--begin::Row-->
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-sm-6"><h3 class="mb-0">Browser Support</h3></div>
|
|
||||||
<div class="col-sm-6">
|
|
||||||
<ol class="breadcrumb float-sm-end">
|
|
||||||
<li class="breadcrumb-item"><a href="#">Docs</a></li>
|
|
||||||
<li class="breadcrumb-item active" aria-current="page">Browser Support</li>
|
|
||||||
</ol>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Row-->
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Content Header-->
|
|
||||||
<!--begin::App Content-->
|
|
||||||
<div class="app-content">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<p>AdminLTE comes with the same browser support as Bootstrap 5.</p>
|
|
||||||
<blockquote>
|
|
||||||
<h5 id="excerpt-from-bootstraps-official-documentation">
|
|
||||||
Excerpt from Bootstrap’s official Documentation!
|
|
||||||
</h5>
|
|
||||||
<p>
|
|
||||||
Bootstrap supports the <strong>latest, stable releases</strong> of all major
|
|
||||||
browsers and platforms.
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
For more details
|
|
||||||
<a
|
|
||||||
href="https://getbootstrap.com/docs/5.0/getting-started/browsers-devices/#supported-browsers"
|
|
||||||
>look here</a
|
|
||||||
>.
|
|
||||||
</p>
|
|
||||||
</blockquote>
|
|
||||||
<p>
|
|
||||||
You can find our supported range of browsers and their versions in
|
|
||||||
<a href="https://github.com/ColorlibHQ/AdminLTE/blob/master/.browserslistrc"
|
|
||||||
>our .browserslistrc file</a
|
|
||||||
>:
|
|
||||||
</p>
|
|
||||||
<pre
|
|
||||||
class="astro-code dark-plus"
|
|
||||||
style="background-color: #1e1e1e; color: #d4d4d4; overflow-x: auto"
|
|
||||||
tabindex="0"
|
|
||||||
data-language="plaintext"
|
|
||||||
><code><span class="line"><span># https://github.com/browserslist/browserslist#readme</span></span>
|
|
||||||
<span class="line"><span></span></span>
|
|
||||||
<span class="line"><span>>= 0.5%</span></span>
|
|
||||||
<span class="line"><span>last 2 major versions</span></span>
|
|
||||||
<span class="line"><span>not dead</span></span>
|
|
||||||
<span class="line"><span>Chrome >= 60</span></span>
|
|
||||||
<span class="line"><span>Firefox >= 60</span></span>
|
|
||||||
<span class="line"><span>Firefox ESR</span></span>
|
|
||||||
<span class="line"><span>iOS >= 12</span></span>
|
|
||||||
<span class="line"><span>Safari >= 12</span></span>
|
|
||||||
<span class="line"><span>not Explorer <= 11</span></span>
|
|
||||||
<span class="line"><span></span></span></code></pre>
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Content-->
|
|
||||||
</main>
|
|
||||||
<!--end::App Main-->
|
|
||||||
<!--begin::Footer-->
|
|
||||||
<footer class="app-footer">
|
|
||||||
<!--begin::To the end-->
|
|
||||||
<div class="float-end d-none d-sm-inline">Anything you want</div>
|
|
||||||
<!--end::To the end-->
|
|
||||||
<!--begin::Copyright-->
|
|
||||||
<strong>
|
|
||||||
Copyright © 2014-2024
|
|
||||||
<a href="https://adminlte.io" class="text-decoration-none">AdminLTE.io</a>.
|
|
||||||
</strong>
|
|
||||||
All rights reserved.
|
|
||||||
<!--end::Copyright-->
|
|
||||||
</footer>
|
|
||||||
<!--end::Footer-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Wrapper-->
|
|
||||||
<!--begin::Script-->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/browser/overlayscrollbars.browser.es6.min.js"
|
|
||||||
integrity="sha256-dghWARbRe2eLlIJ56wNB+b760ywulqK3DzZYEpsg2fQ="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)--><!--begin::Required Plugin(popperjs for Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js"
|
|
||||||
integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(popperjs for Bootstrap 5)--><!--begin::Required Plugin(Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js"
|
|
||||||
integrity="sha384-0pUGZvbkm6XF6gxjEnlmuGrJXVbNuzT9qBBavbLwCsOGabYfZo0T0to5eqruptLy"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(Bootstrap 5)--><!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<script src="../../../dist/js/adminlte.js"></script>
|
|
||||||
<!--end::Required Plugin(AdminLTE)--><!--begin::OverlayScrollbars Configure-->
|
|
||||||
<script>
|
|
||||||
const SELECTOR_SIDEBAR_WRAPPER = '.sidebar-wrapper';
|
|
||||||
const Default = {
|
|
||||||
scrollbarTheme: 'os-theme-light',
|
|
||||||
scrollbarAutoHide: 'leave',
|
|
||||||
scrollbarClickScroll: true,
|
|
||||||
};
|
|
||||||
document.addEventListener('DOMContentLoaded', function () {
|
|
||||||
const sidebarWrapper = document.querySelector(SELECTOR_SIDEBAR_WRAPPER);
|
|
||||||
if (sidebarWrapper && typeof OverlayScrollbarsGlobal?.OverlayScrollbars !== 'undefined') {
|
|
||||||
OverlayScrollbarsGlobal.OverlayScrollbars(sidebarWrapper, {
|
|
||||||
scrollbars: {
|
|
||||||
theme: Default.scrollbarTheme,
|
|
||||||
autoHide: Default.scrollbarAutoHide,
|
|
||||||
clickScroll: Default.scrollbarClickScroll,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<!--end::OverlayScrollbars Configure-->
|
|
||||||
<!--end::Script-->
|
|
||||||
</body>
|
|
||||||
<!--end::Body-->
|
|
||||||
</html>
|
|
@ -1,950 +0,0 @@
|
|||||||
<!doctype html>
|
|
||||||
<html lang="en">
|
|
||||||
<!--begin::Head-->
|
|
||||||
<head>
|
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
||||||
<title>Main Sidebar Component | AdminLTE 4</title>
|
|
||||||
<!--begin::Primary Meta Tags-->
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<meta name="title" content="Main Sidebar Component | AdminLTE 4" />
|
|
||||||
<meta name="author" content="ColorlibHQ" />
|
|
||||||
<meta
|
|
||||||
name="description"
|
|
||||||
content="AdminLTE is a Free Bootstrap 5 Admin Dashboard, 30 example pages using Vanilla JS."
|
|
||||||
/>
|
|
||||||
<meta
|
|
||||||
name="keywords"
|
|
||||||
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"
|
|
||||||
/>
|
|
||||||
<!--end::Primary Meta Tags-->
|
|
||||||
<!--begin::Fonts-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/@fontsource/source-sans-3@5.0.12/index.css"
|
|
||||||
integrity="sha256-tXJfXfp6Ewt1ilPzLDtQnJV4hclT9XuaZUKyUvmyr+Q="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Fonts-->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/styles/overlayscrollbars.min.css"
|
|
||||||
integrity="sha256-tZHrRjVqNSRyWg2wbppGnT833E/Ys0DHWGwT04GiqQg="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<!--begin::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"
|
|
||||||
integrity="sha256-9kPW/n5nn53j4WMRYAxe9c1rCY96Oogo/MKSVdKzPmI="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<link rel="stylesheet" href="../../../../dist/css/adminlte.css" />
|
|
||||||
<!--end::Required Plugin(AdminLTE)-->
|
|
||||||
<style>
|
|
||||||
[data-astro-image] {
|
|
||||||
width: 100%;
|
|
||||||
height: auto;
|
|
||||||
object-fit: var(--fit);
|
|
||||||
object-position: var(--pos);
|
|
||||||
aspect-ratio: var(--w) / var(--h);
|
|
||||||
}
|
|
||||||
[data-astro-image='responsive'] {
|
|
||||||
max-width: calc(var(--w) * 1px);
|
|
||||||
max-height: calc(var(--h) * 1px);
|
|
||||||
}
|
|
||||||
[data-astro-image='fixed'] {
|
|
||||||
width: calc(var(--w) * 1px);
|
|
||||||
height: calc(var(--h) * 1px);
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<!--end::Head-->
|
|
||||||
<!--begin::Body-->
|
|
||||||
<body class="layout-fixed sidebar-expand-lg bg-body-tertiary">
|
|
||||||
<!--begin::App Wrapper-->
|
|
||||||
<div class="app-wrapper">
|
|
||||||
<!--begin::Header-->
|
|
||||||
<nav class="app-header navbar navbar-expand bg-body">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<!--begin::Start Navbar Links-->
|
|
||||||
<ul class="navbar-nav">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" data-lte-toggle="sidebar" href="#" role="button">
|
|
||||||
<i class="bi bi-list"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item d-none d-md-block"><a href="#" class="nav-link">Home</a></li>
|
|
||||||
<li class="nav-item d-none d-md-block"><a href="#" class="nav-link">Contact</a></li>
|
|
||||||
</ul>
|
|
||||||
<!--end::Start Navbar Links-->
|
|
||||||
<!--begin::End Navbar Links-->
|
|
||||||
<ul class="navbar-nav ms-auto">
|
|
||||||
<!--begin::Navbar Search-->
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" data-widget="navbar-search" href="#" role="button">
|
|
||||||
<i class="bi bi-search"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Navbar Search-->
|
|
||||||
<!--begin::Messages Dropdown Menu-->
|
|
||||||
<li class="nav-item dropdown">
|
|
||||||
<a class="nav-link" data-bs-toggle="dropdown" href="#">
|
|
||||||
<i class="bi bi-chat-text"></i>
|
|
||||||
<span class="navbar-badge badge text-bg-danger">3</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../../dist/assets/img/user1-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
Brad Diesel
|
|
||||||
<span class="float-end fs-7 text-danger"
|
|
||||||
><i class="bi bi-star-fill"></i
|
|
||||||
></span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">Call me whenever you can...</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../../dist/assets/img/user8-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
John Pierce
|
|
||||||
<span class="float-end fs-7 text-secondary">
|
|
||||||
<i class="bi bi-star-fill"></i>
|
|
||||||
</span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">I got your message bro</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../../dist/assets/img/user3-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
Nora Silvester
|
|
||||||
<span class="float-end fs-7 text-warning">
|
|
||||||
<i class="bi bi-star-fill"></i>
|
|
||||||
</span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">The subject goes here</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item dropdown-footer">See All Messages</a>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<!--end::Messages Dropdown Menu-->
|
|
||||||
<!--begin::Notifications Dropdown Menu-->
|
|
||||||
<li class="nav-item dropdown">
|
|
||||||
<a class="nav-link" data-bs-toggle="dropdown" href="#">
|
|
||||||
<i class="bi bi-bell-fill"></i>
|
|
||||||
<span class="navbar-badge badge text-bg-warning">15</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<span class="dropdown-item dropdown-header">15 Notifications</span>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-envelope me-2"></i> 4 new messages
|
|
||||||
<span class="float-end text-secondary fs-7">3 mins</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-people-fill me-2"></i> 8 friend requests
|
|
||||||
<span class="float-end text-secondary fs-7">12 hours</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-file-earmark-fill me-2"></i> 3 new reports
|
|
||||||
<span class="float-end text-secondary fs-7">2 days</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item dropdown-footer"> See All Notifications </a>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<!--end::Notifications Dropdown Menu-->
|
|
||||||
<!--begin::Fullscreen Toggle-->
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" href="#" data-lte-toggle="fullscreen">
|
|
||||||
<i data-lte-icon="maximize" class="bi bi-arrows-fullscreen"></i>
|
|
||||||
<i data-lte-icon="minimize" class="bi bi-fullscreen-exit" style="display: none"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Fullscreen Toggle-->
|
|
||||||
<!--begin::User Menu Dropdown-->
|
|
||||||
<li class="nav-item dropdown user-menu">
|
|
||||||
<a href="#" class="nav-link dropdown-toggle" data-bs-toggle="dropdown">
|
|
||||||
<img
|
|
||||||
src="../../../../dist/assets/img/user2-160x160.jpg"
|
|
||||||
class="user-image rounded-circle shadow"
|
|
||||||
alt="User Image"
|
|
||||||
/>
|
|
||||||
<span class="d-none d-md-inline">Alexander Pierce</span>
|
|
||||||
</a>
|
|
||||||
<ul class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<!--begin::User Image-->
|
|
||||||
<li class="user-header text-bg-primary">
|
|
||||||
<img
|
|
||||||
src="../../../../dist/assets/img/user2-160x160.jpg"
|
|
||||||
class="rounded-circle shadow"
|
|
||||||
alt="User Image"
|
|
||||||
/>
|
|
||||||
<p>
|
|
||||||
Alexander Pierce - Web Developer
|
|
||||||
<small>Member since Nov. 2023</small>
|
|
||||||
</p>
|
|
||||||
</li>
|
|
||||||
<!--end::User Image-->
|
|
||||||
<!--begin::Menu Body-->
|
|
||||||
<li class="user-body">
|
|
||||||
<!--begin::Row-->
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-4 text-center"><a href="#">Followers</a></div>
|
|
||||||
<div class="col-4 text-center"><a href="#">Sales</a></div>
|
|
||||||
<div class="col-4 text-center"><a href="#">Friends</a></div>
|
|
||||||
</div>
|
|
||||||
<!--end::Row-->
|
|
||||||
</li>
|
|
||||||
<!--end::Menu Body-->
|
|
||||||
<!--begin::Menu Footer-->
|
|
||||||
<li class="user-footer">
|
|
||||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
|
||||||
<a href="#" class="btn btn-default btn-flat float-end">Sign out</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Menu Footer-->
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<!--end::User Menu Dropdown-->
|
|
||||||
</ul>
|
|
||||||
<!--end::End Navbar Links-->
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</nav>
|
|
||||||
<!--end::Header-->
|
|
||||||
<!--begin::Sidebar-->
|
|
||||||
<aside class="app-sidebar bg-body-secondary shadow" data-bs-theme="dark">
|
|
||||||
<!--begin::Sidebar Brand-->
|
|
||||||
<div class="sidebar-brand">
|
|
||||||
<!--begin::Brand Link-->
|
|
||||||
<a href="../../index.html" class="brand-link">
|
|
||||||
<!--begin::Brand Image-->
|
|
||||||
<img
|
|
||||||
src="../../../../dist/assets/img/AdminLTELogo.png"
|
|
||||||
alt="AdminLTE Logo"
|
|
||||||
class="brand-image opacity-75 shadow"
|
|
||||||
/>
|
|
||||||
<!--end::Brand Image-->
|
|
||||||
<!--begin::Brand Text-->
|
|
||||||
<span class="brand-text fw-light">AdminLTE 4</span>
|
|
||||||
<!--end::Brand Text-->
|
|
||||||
</a>
|
|
||||||
<!--end::Brand Link-->
|
|
||||||
</div>
|
|
||||||
<!--end::Sidebar Brand-->
|
|
||||||
<!--begin::Sidebar Wrapper-->
|
|
||||||
<div class="sidebar-wrapper">
|
|
||||||
<nav class="mt-2">
|
|
||||||
<!--begin::Sidebar Menu-->
|
|
||||||
<ul
|
|
||||||
class="nav sidebar-menu flex-column"
|
|
||||||
data-lte-toggle="treeview"
|
|
||||||
role="menu"
|
|
||||||
data-accordion="false"
|
|
||||||
>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-speedometer"></i>
|
|
||||||
<p>
|
|
||||||
Dashboard
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../index.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../index2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../index3.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../generate/theme.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-palette"></i>
|
|
||||||
<p>Theme Generate</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-seam-fill"></i>
|
|
||||||
<p>
|
|
||||||
Widgets
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../widgets/small-box.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Small Box</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../widgets/info-box.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>info Box</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../widgets/cards.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Cards</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-clipboard-fill"></i>
|
|
||||||
<p>
|
|
||||||
Layout Options
|
|
||||||
<span class="nav-badge badge text-bg-secondary me-3">6</span>
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../layout/unfixed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Default Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../layout/fixed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Fixed Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../layout/layout-custom-area.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Layout <small>+ Custom Area </small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../layout/sidebar-mini.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../layout/collapsed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini <small>+ Collapsed</small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../layout/logo-switch.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini <small>+ Logo Switch</small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../layout/layout-rtl.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Layout RTL</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-tree-fill"></i>
|
|
||||||
<p>
|
|
||||||
UI Elements
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../UI/general.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>General</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../UI/icons.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Icons</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../UI/timeline.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Timeline</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-pencil-square"></i>
|
|
||||||
<p>
|
|
||||||
Forms
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../forms/general.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>General Elements</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-table"></i>
|
|
||||||
<p>
|
|
||||||
Tables
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../tables/simple.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Simple Tables</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">EXAMPLES</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Auth
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Version 1
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../examples/login.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Login</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../examples/register.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Register</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Version 2
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../examples/login-v2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Login</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../examples/register-v2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Register</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../examples/lockscreen.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Lockscreen</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">DOCUMENTATIONS</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../docs/introduction.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-download"></i>
|
|
||||||
<p>Installation</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../docs/layout.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-grip-horizontal"></i>
|
|
||||||
<p>Layout</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../docs/color-mode.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-star-half"></i>
|
|
||||||
<p>Color Mode</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item menu-open">
|
|
||||||
<a href="#" class="nav-link active">
|
|
||||||
<i class="nav-icon bi bi-ui-checks-grid"></i>
|
|
||||||
<p>
|
|
||||||
Components
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../docs/components/main-header.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Main Header</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../docs/components/main-sidebar.html" class="nav-link active">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Main Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-filetype-js"></i>
|
|
||||||
<p>
|
|
||||||
Javascript
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../docs/javascript/treeview.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Treeview</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../docs/browser-support.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-browser-edge"></i>
|
|
||||||
<p>Browser Support</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../docs/how-to-contribute.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-hand-thumbs-up-fill"></i>
|
|
||||||
<p>How To Contribute</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../docs/faq.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-question-circle-fill"></i>
|
|
||||||
<p>FAQ</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../docs/license.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-patch-check-fill"></i>
|
|
||||||
<p>License</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">MULTI LEVEL EXAMPLE</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>Level 1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>
|
|
||||||
Level 1
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Level 2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>
|
|
||||||
Level 2
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Level 2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>Level 1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">LABELS</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-danger"></i>
|
|
||||||
<p class="text">Important</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-warning"></i>
|
|
||||||
<p>Warning</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-info"></i>
|
|
||||||
<p>Informational</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
<!--end::Sidebar Menu-->
|
|
||||||
</nav>
|
|
||||||
</div>
|
|
||||||
<!--end::Sidebar Wrapper-->
|
|
||||||
</aside>
|
|
||||||
<!--end::Sidebar-->
|
|
||||||
<!--begin::App Main-->
|
|
||||||
<main class="app-main">
|
|
||||||
<!--begin::App Content Header-->
|
|
||||||
<div class="app-content-header">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<!--begin::Row-->
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-sm-6"><h3 class="mb-0">Main Sidebar Component</h3></div>
|
|
||||||
<div class="col-sm-6">
|
|
||||||
<ol class="breadcrumb float-sm-end">
|
|
||||||
<li class="breadcrumb-item"><a href="#">Docs</a></li>
|
|
||||||
<li class="breadcrumb-item active" aria-current="page">Main Sidebar Component</li>
|
|
||||||
</ol>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Row-->
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Content Header-->
|
|
||||||
<!--begin::App Content-->
|
|
||||||
<div class="app-content">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<p>
|
|
||||||
The sidebar used in this page to the left provides an example of what your sidebar
|
|
||||||
would look like. Construction of a sidebar:
|
|
||||||
</p>
|
|
||||||
<pre
|
|
||||||
class="astro-code dark-plus"
|
|
||||||
style="background-color: #1e1e1e; color: #d4d4d4; overflow-x: auto"
|
|
||||||
tabindex="0"
|
|
||||||
data-language="html"
|
|
||||||
><code><span class="line"><span style="color:#6A9955"><!--begin::Sidebar--></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"><</span><span style="color:#569CD6">aside</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"app-sidebar bg-body-secondary shadow"</span><span style="color:#9CDCFE"> data-bs-theme</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"dark"</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#6A9955"> <!--begin::Sidebar Brand--></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">div</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"sidebar-brand"</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#6A9955"> <!--begin::Brand Link--></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">a</span><span style="color:#9CDCFE"> href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"./index.html"</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"brand-link"</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#6A9955"> <!--begin::Brand Image--></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">img</span></span>
|
|
||||||
<span class="line"><span style="color:#9CDCFE"> src</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"./assets/img/AdminLTELogo.png"</span></span>
|
|
||||||
<span class="line"><span style="color:#9CDCFE"> alt</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"AdminLTE Logo"</span></span>
|
|
||||||
<span class="line"><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"brand-image opacity-75 shadow"</span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> /></span></span>
|
|
||||||
<span class="line"><span style="color:#6A9955"> <!--end::Brand Image--></span></span>
|
|
||||||
<span class="line"><span style="color:#6A9955"> <!--begin::Brand Text--></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">span</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"brand-text fw-light"</span><span style="color:#808080">></span><span style="color:#D4D4D4">AdminLTE 4</span><span style="color:#808080"></</span><span style="color:#569CD6">span</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#6A9955"> <!--end::Brand Text--></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">a</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#6A9955"> <!--end::Brand Link--></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">div</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#6A9955"> <!--end::Sidebar Brand--></span></span>
|
|
||||||
<span class="line"><span style="color:#6A9955"> <!--begin::Sidebar Wrapper--></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">div</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"sidebar-wrapper"</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">nav</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"mt-2"</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#6A9955"> <!--begin::Sidebar Menu--></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">ul</span></span>
|
|
||||||
<span class="line"><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav sidebar-menu flex-column"</span></span>
|
|
||||||
<span class="line"><span style="color:#9CDCFE"> data-lte-toggle</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"treeview"</span></span>
|
|
||||||
<span class="line"><span style="color:#9CDCFE"> role</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"menu"</span></span>
|
|
||||||
<span class="line"><span style="color:#9CDCFE"> data-accordion</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"false"</span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> ></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">li</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-header"</span><span style="color:#808080">></span><span style="color:#D4D4D4">Nav Header</span><span style="color:#808080"></</span><span style="color:#569CD6">li</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">li</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-item"</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">a</span><span style="color:#9CDCFE"> href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"./index.html"</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-link"</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">i</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-icon bi bi-circle-fill"</span><span style="color:#808080">></</span><span style="color:#569CD6">i</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">p</span><span style="color:#808080">></span><span style="color:#D4D4D4">Level 1</span><span style="color:#808080"></</span><span style="color:#569CD6">p</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">a</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">li</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">li</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-item"</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">a</span><span style="color:#9CDCFE"> href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"#"</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-link"</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">i</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-icon bi bi-circle-fill"</span><span style="color:#808080">></</span><span style="color:#569CD6">i</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">p</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#D4D4D4"> Treeview</span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">i</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-arrow bi bi-chevron-right"</span><span style="color:#808080">></</span><span style="color:#569CD6">i</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">p</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">a</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">ul</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav nav-treeview"</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">li</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-item"</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">a</span><span style="color:#9CDCFE"> href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"./index.html"</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-link"</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">i</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-icon bi bi-circle"</span><span style="color:#808080">></</span><span style="color:#569CD6">i</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">p</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#D4D4D4"> Level 2 (Badge)</span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">span</span></span>
|
|
||||||
<span class="line"><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-badge badge text-bg-secondary me-3"</span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> ></span></span>
|
|
||||||
<span class="line"><span style="color:#D4D4D4"> 6</span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">span</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">p</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">a</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">li</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">li</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-item"</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">a</span><span style="color:#9CDCFE"> href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"./index.html"</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-link"</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">i</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-icon bi bi-circle"</span><span style="color:#808080">></</span><span style="color:#569CD6">i</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">p</span><span style="color:#808080">></span><span style="color:#D4D4D4">Level 2</span><span style="color:#808080"></</span><span style="color:#569CD6">p</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">a</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">li</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">ul</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">li</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">li</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-item"</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">a</span><span style="color:#9CDCFE"> href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"./index.html"</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-link active"</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">i</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-icon bi bi-circle-fill"</span><span style="color:#808080">></</span><span style="color:#569CD6">i</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">p</span><span style="color:#808080">></span><span style="color:#D4D4D4">Level 1 Active</span><span style="color:#808080"></</span><span style="color:#569CD6">p</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">a</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">li</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">li</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-item menu-open"</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">a</span><span style="color:#9CDCFE"> href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"#"</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-link active"</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">i</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-icon bi bi-circle-fill"</span><span style="color:#808080">></</span><span style="color:#569CD6">i</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">p</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#D4D4D4"> Treeview Menu Open</span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">i</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-arrow bi bi-chevron-right"</span><span style="color:#808080">></</span><span style="color:#569CD6">i</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">p</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">a</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">ul</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav nav-treeview"</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">li</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-item"</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">a</span><span style="color:#9CDCFE"> href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"./index.html"</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-link active"</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">i</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-icon bi bi-circle"</span><span style="color:#808080">></</span><span style="color:#569CD6">i</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">p</span><span style="color:#808080">></span><span style="color:#D4D4D4">Level 2 Active</span><span style="color:#808080"></</span><span style="color:#569CD6">p</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">a</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">li</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">li</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-item"</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">a</span><span style="color:#9CDCFE"> href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"./index.html"</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-link"</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">i</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-icon bi bi-circle"</span><span style="color:#808080">></</span><span style="color:#569CD6">i</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">p</span><span style="color:#808080">></span><span style="color:#D4D4D4">Level 2</span><span style="color:#808080"></</span><span style="color:#569CD6">p</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">a</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">li</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">ul</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">li</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">ul</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#6A9955"> <!--end::Sidebar Menu--></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">nav</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">div</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#6A9955"> <!--end::Sidebar Wrapper--></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"></</span><span style="color:#569CD6">aside</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#6A9955"><!--end::Sidebar--></span></span>
|
|
||||||
<span class="line"></span></code></pre>
|
|
||||||
<h2 id="alternate-logo">Alternate Logo</h2>
|
|
||||||
<p>
|
|
||||||
You can use two logo images instead of logo with text, you only need to change the
|
|
||||||
markup to this:
|
|
||||||
</p>
|
|
||||||
<pre
|
|
||||||
class="astro-code dark-plus"
|
|
||||||
style="background-color: #1e1e1e; color: #d4d4d4; overflow-x: auto"
|
|
||||||
tabindex="0"
|
|
||||||
data-language="html"
|
|
||||||
><code><span class="line"><span style="color:#808080"><</span><span style="color:#569CD6">div</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"sidebar-brand"</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">a</span><span style="color:#9CDCFE"> href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"./index.html"</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"brand-link logo-switch"</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">img</span></span>
|
|
||||||
<span class="line"><span style="color:#9CDCFE"> src</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"./assets/img/AdminLTELogo.png"</span></span>
|
|
||||||
<span class="line"><span style="color:#9CDCFE"> alt</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"AdminLTE Logo Small"</span></span>
|
|
||||||
<span class="line"><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"brand-image-xl logo-xs opacity-75 shadow"</span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> /></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">img</span></span>
|
|
||||||
<span class="line"><span style="color:#9CDCFE"> src</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"./assets/img/AdminLTEFullLogo.png"</span></span>
|
|
||||||
<span class="line"><span style="color:#9CDCFE"> alt</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"AdminLTE Logo Large"</span></span>
|
|
||||||
<span class="line"><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"brand-image-xs logo-xl opacity-75"</span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> /></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">a</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"></</span><span style="color:#569CD6">div</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"></span></code></pre>
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Content-->
|
|
||||||
</main>
|
|
||||||
<!--end::App Main-->
|
|
||||||
<!--begin::Footer-->
|
|
||||||
<footer class="app-footer">
|
|
||||||
<!--begin::To the end-->
|
|
||||||
<div class="float-end d-none d-sm-inline">Anything you want</div>
|
|
||||||
<!--end::To the end-->
|
|
||||||
<!--begin::Copyright-->
|
|
||||||
<strong>
|
|
||||||
Copyright © 2014-2024
|
|
||||||
<a href="https://adminlte.io" class="text-decoration-none">AdminLTE.io</a>.
|
|
||||||
</strong>
|
|
||||||
All rights reserved.
|
|
||||||
<!--end::Copyright-->
|
|
||||||
</footer>
|
|
||||||
<!--end::Footer-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Wrapper-->
|
|
||||||
<!--begin::Script-->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/browser/overlayscrollbars.browser.es6.min.js"
|
|
||||||
integrity="sha256-dghWARbRe2eLlIJ56wNB+b760ywulqK3DzZYEpsg2fQ="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)--><!--begin::Required Plugin(popperjs for Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js"
|
|
||||||
integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(popperjs for Bootstrap 5)--><!--begin::Required Plugin(Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js"
|
|
||||||
integrity="sha384-0pUGZvbkm6XF6gxjEnlmuGrJXVbNuzT9qBBavbLwCsOGabYfZo0T0to5eqruptLy"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(Bootstrap 5)--><!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<script src="../../../../dist/js/adminlte.js"></script>
|
|
||||||
<!--end::Required Plugin(AdminLTE)--><!--begin::OverlayScrollbars Configure-->
|
|
||||||
<script>
|
|
||||||
const SELECTOR_SIDEBAR_WRAPPER = '.sidebar-wrapper';
|
|
||||||
const Default = {
|
|
||||||
scrollbarTheme: 'os-theme-light',
|
|
||||||
scrollbarAutoHide: 'leave',
|
|
||||||
scrollbarClickScroll: true,
|
|
||||||
};
|
|
||||||
document.addEventListener('DOMContentLoaded', function () {
|
|
||||||
const sidebarWrapper = document.querySelector(SELECTOR_SIDEBAR_WRAPPER);
|
|
||||||
if (sidebarWrapper && typeof OverlayScrollbarsGlobal?.OverlayScrollbars !== 'undefined') {
|
|
||||||
OverlayScrollbarsGlobal.OverlayScrollbars(sidebarWrapper, {
|
|
||||||
scrollbars: {
|
|
||||||
theme: Default.scrollbarTheme,
|
|
||||||
autoHide: Default.scrollbarAutoHide,
|
|
||||||
clickScroll: Default.scrollbarClickScroll,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<!--end::OverlayScrollbars Configure-->
|
|
||||||
<!--end::Script-->
|
|
||||||
</body>
|
|
||||||
<!--end::Body-->
|
|
||||||
</html>
|
|
@ -1,832 +0,0 @@
|
|||||||
<!doctype html>
|
|
||||||
<html lang="en">
|
|
||||||
<!--begin::Head-->
|
|
||||||
<head>
|
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
||||||
<title>FAQ | AdminLTE 4</title>
|
|
||||||
<!--begin::Primary Meta Tags-->
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<meta name="title" content="FAQ | AdminLTE 4" />
|
|
||||||
<meta name="author" content="ColorlibHQ" />
|
|
||||||
<meta
|
|
||||||
name="description"
|
|
||||||
content="AdminLTE is a Free Bootstrap 5 Admin Dashboard, 30 example pages using Vanilla JS."
|
|
||||||
/>
|
|
||||||
<meta
|
|
||||||
name="keywords"
|
|
||||||
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"
|
|
||||||
/>
|
|
||||||
<!--end::Primary Meta Tags-->
|
|
||||||
<!--begin::Fonts-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/@fontsource/source-sans-3@5.0.12/index.css"
|
|
||||||
integrity="sha256-tXJfXfp6Ewt1ilPzLDtQnJV4hclT9XuaZUKyUvmyr+Q="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Fonts-->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/styles/overlayscrollbars.min.css"
|
|
||||||
integrity="sha256-tZHrRjVqNSRyWg2wbppGnT833E/Ys0DHWGwT04GiqQg="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<!--begin::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"
|
|
||||||
integrity="sha256-9kPW/n5nn53j4WMRYAxe9c1rCY96Oogo/MKSVdKzPmI="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<link rel="stylesheet" href="../../../dist/css/adminlte.css" />
|
|
||||||
<!--end::Required Plugin(AdminLTE)-->
|
|
||||||
<style>
|
|
||||||
[data-astro-image] {
|
|
||||||
width: 100%;
|
|
||||||
height: auto;
|
|
||||||
object-fit: var(--fit);
|
|
||||||
object-position: var(--pos);
|
|
||||||
aspect-ratio: var(--w) / var(--h);
|
|
||||||
}
|
|
||||||
[data-astro-image='responsive'] {
|
|
||||||
max-width: calc(var(--w) * 1px);
|
|
||||||
max-height: calc(var(--h) * 1px);
|
|
||||||
}
|
|
||||||
[data-astro-image='fixed'] {
|
|
||||||
width: calc(var(--w) * 1px);
|
|
||||||
height: calc(var(--h) * 1px);
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<!--end::Head-->
|
|
||||||
<!--begin::Body-->
|
|
||||||
<body class="layout-fixed sidebar-expand-lg bg-body-tertiary">
|
|
||||||
<!--begin::App Wrapper-->
|
|
||||||
<div class="app-wrapper">
|
|
||||||
<!--begin::Header-->
|
|
||||||
<nav class="app-header navbar navbar-expand bg-body">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<!--begin::Start Navbar Links-->
|
|
||||||
<ul class="navbar-nav">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" data-lte-toggle="sidebar" href="#" role="button">
|
|
||||||
<i class="bi bi-list"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item d-none d-md-block"><a href="#" class="nav-link">Home</a></li>
|
|
||||||
<li class="nav-item d-none d-md-block"><a href="#" class="nav-link">Contact</a></li>
|
|
||||||
</ul>
|
|
||||||
<!--end::Start Navbar Links-->
|
|
||||||
<!--begin::End Navbar Links-->
|
|
||||||
<ul class="navbar-nav ms-auto">
|
|
||||||
<!--begin::Navbar Search-->
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" data-widget="navbar-search" href="#" role="button">
|
|
||||||
<i class="bi bi-search"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Navbar Search-->
|
|
||||||
<!--begin::Messages Dropdown Menu-->
|
|
||||||
<li class="nav-item dropdown">
|
|
||||||
<a class="nav-link" data-bs-toggle="dropdown" href="#">
|
|
||||||
<i class="bi bi-chat-text"></i>
|
|
||||||
<span class="navbar-badge badge text-bg-danger">3</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user1-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
Brad Diesel
|
|
||||||
<span class="float-end fs-7 text-danger"
|
|
||||||
><i class="bi bi-star-fill"></i
|
|
||||||
></span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">Call me whenever you can...</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user8-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
John Pierce
|
|
||||||
<span class="float-end fs-7 text-secondary">
|
|
||||||
<i class="bi bi-star-fill"></i>
|
|
||||||
</span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">I got your message bro</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user3-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
Nora Silvester
|
|
||||||
<span class="float-end fs-7 text-warning">
|
|
||||||
<i class="bi bi-star-fill"></i>
|
|
||||||
</span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">The subject goes here</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item dropdown-footer">See All Messages</a>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<!--end::Messages Dropdown Menu-->
|
|
||||||
<!--begin::Notifications Dropdown Menu-->
|
|
||||||
<li class="nav-item dropdown">
|
|
||||||
<a class="nav-link" data-bs-toggle="dropdown" href="#">
|
|
||||||
<i class="bi bi-bell-fill"></i>
|
|
||||||
<span class="navbar-badge badge text-bg-warning">15</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<span class="dropdown-item dropdown-header">15 Notifications</span>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-envelope me-2"></i> 4 new messages
|
|
||||||
<span class="float-end text-secondary fs-7">3 mins</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-people-fill me-2"></i> 8 friend requests
|
|
||||||
<span class="float-end text-secondary fs-7">12 hours</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-file-earmark-fill me-2"></i> 3 new reports
|
|
||||||
<span class="float-end text-secondary fs-7">2 days</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item dropdown-footer"> See All Notifications </a>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<!--end::Notifications Dropdown Menu-->
|
|
||||||
<!--begin::Fullscreen Toggle-->
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" href="#" data-lte-toggle="fullscreen">
|
|
||||||
<i data-lte-icon="maximize" class="bi bi-arrows-fullscreen"></i>
|
|
||||||
<i data-lte-icon="minimize" class="bi bi-fullscreen-exit" style="display: none"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Fullscreen Toggle-->
|
|
||||||
<!--begin::User Menu Dropdown-->
|
|
||||||
<li class="nav-item dropdown user-menu">
|
|
||||||
<a href="#" class="nav-link dropdown-toggle" data-bs-toggle="dropdown">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user2-160x160.jpg"
|
|
||||||
class="user-image rounded-circle shadow"
|
|
||||||
alt="User Image"
|
|
||||||
/>
|
|
||||||
<span class="d-none d-md-inline">Alexander Pierce</span>
|
|
||||||
</a>
|
|
||||||
<ul class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<!--begin::User Image-->
|
|
||||||
<li class="user-header text-bg-primary">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user2-160x160.jpg"
|
|
||||||
class="rounded-circle shadow"
|
|
||||||
alt="User Image"
|
|
||||||
/>
|
|
||||||
<p>
|
|
||||||
Alexander Pierce - Web Developer
|
|
||||||
<small>Member since Nov. 2023</small>
|
|
||||||
</p>
|
|
||||||
</li>
|
|
||||||
<!--end::User Image-->
|
|
||||||
<!--begin::Menu Body-->
|
|
||||||
<li class="user-body">
|
|
||||||
<!--begin::Row-->
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-4 text-center"><a href="#">Followers</a></div>
|
|
||||||
<div class="col-4 text-center"><a href="#">Sales</a></div>
|
|
||||||
<div class="col-4 text-center"><a href="#">Friends</a></div>
|
|
||||||
</div>
|
|
||||||
<!--end::Row-->
|
|
||||||
</li>
|
|
||||||
<!--end::Menu Body-->
|
|
||||||
<!--begin::Menu Footer-->
|
|
||||||
<li class="user-footer">
|
|
||||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
|
||||||
<a href="#" class="btn btn-default btn-flat float-end">Sign out</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Menu Footer-->
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<!--end::User Menu Dropdown-->
|
|
||||||
</ul>
|
|
||||||
<!--end::End Navbar Links-->
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</nav>
|
|
||||||
<!--end::Header-->
|
|
||||||
<!--begin::Sidebar-->
|
|
||||||
<aside class="app-sidebar bg-body-secondary shadow" data-bs-theme="dark">
|
|
||||||
<!--begin::Sidebar Brand-->
|
|
||||||
<div class="sidebar-brand">
|
|
||||||
<!--begin::Brand Link-->
|
|
||||||
<a href="../index.html" class="brand-link">
|
|
||||||
<!--begin::Brand Image-->
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/AdminLTELogo.png"
|
|
||||||
alt="AdminLTE Logo"
|
|
||||||
class="brand-image opacity-75 shadow"
|
|
||||||
/>
|
|
||||||
<!--end::Brand Image-->
|
|
||||||
<!--begin::Brand Text-->
|
|
||||||
<span class="brand-text fw-light">AdminLTE 4</span>
|
|
||||||
<!--end::Brand Text-->
|
|
||||||
</a>
|
|
||||||
<!--end::Brand Link-->
|
|
||||||
</div>
|
|
||||||
<!--end::Sidebar Brand-->
|
|
||||||
<!--begin::Sidebar Wrapper-->
|
|
||||||
<div class="sidebar-wrapper">
|
|
||||||
<nav class="mt-2">
|
|
||||||
<!--begin::Sidebar Menu-->
|
|
||||||
<ul
|
|
||||||
class="nav sidebar-menu flex-column"
|
|
||||||
data-lte-toggle="treeview"
|
|
||||||
role="menu"
|
|
||||||
data-accordion="false"
|
|
||||||
>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-speedometer"></i>
|
|
||||||
<p>
|
|
||||||
Dashboard
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../index.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../index2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../index3.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../generate/theme.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-palette"></i>
|
|
||||||
<p>Theme Generate</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-seam-fill"></i>
|
|
||||||
<p>
|
|
||||||
Widgets
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../widgets/small-box.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Small Box</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../widgets/info-box.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>info Box</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../widgets/cards.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Cards</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-clipboard-fill"></i>
|
|
||||||
<p>
|
|
||||||
Layout Options
|
|
||||||
<span class="nav-badge badge text-bg-secondary me-3">6</span>
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/unfixed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Default Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/fixed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Fixed Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/layout-custom-area.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Layout <small>+ Custom Area </small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/sidebar-mini.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/collapsed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini <small>+ Collapsed</small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/logo-switch.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini <small>+ Logo Switch</small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/layout-rtl.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Layout RTL</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-tree-fill"></i>
|
|
||||||
<p>
|
|
||||||
UI Elements
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../UI/general.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>General</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../UI/icons.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Icons</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../UI/timeline.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Timeline</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-pencil-square"></i>
|
|
||||||
<p>
|
|
||||||
Forms
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../forms/general.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>General Elements</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-table"></i>
|
|
||||||
<p>
|
|
||||||
Tables
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../tables/simple.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Simple Tables</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">EXAMPLES</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Auth
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Version 1
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/login.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Login</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/register.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Register</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Version 2
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/login-v2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Login</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/register-v2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Register</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/lockscreen.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Lockscreen</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">DOCUMENTATIONS</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/introduction.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-download"></i>
|
|
||||||
<p>Installation</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/layout.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-grip-horizontal"></i>
|
|
||||||
<p>Layout</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/color-mode.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-star-half"></i>
|
|
||||||
<p>Color Mode</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-ui-checks-grid"></i>
|
|
||||||
<p>
|
|
||||||
Components
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/components/main-header.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Main Header</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/components/main-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Main Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-filetype-js"></i>
|
|
||||||
<p>
|
|
||||||
Javascript
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/javascript/treeview.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Treeview</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/browser-support.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-browser-edge"></i>
|
|
||||||
<p>Browser Support</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/how-to-contribute.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-hand-thumbs-up-fill"></i>
|
|
||||||
<p>How To Contribute</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/faq.html" class="nav-link active">
|
|
||||||
<i class="nav-icon bi bi-question-circle-fill"></i>
|
|
||||||
<p>FAQ</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/license.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-patch-check-fill"></i>
|
|
||||||
<p>License</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">MULTI LEVEL EXAMPLE</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>Level 1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>
|
|
||||||
Level 1
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Level 2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>
|
|
||||||
Level 2
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Level 2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>Level 1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">LABELS</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-danger"></i>
|
|
||||||
<p class="text">Important</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-warning"></i>
|
|
||||||
<p>Warning</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-info"></i>
|
|
||||||
<p>Informational</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
<!--end::Sidebar Menu-->
|
|
||||||
</nav>
|
|
||||||
</div>
|
|
||||||
<!--end::Sidebar Wrapper-->
|
|
||||||
</aside>
|
|
||||||
<!--end::Sidebar-->
|
|
||||||
<!--begin::App Main-->
|
|
||||||
<main class="app-main">
|
|
||||||
<!--begin::App Content Header-->
|
|
||||||
<div class="app-content-header">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<!--begin::Row-->
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-sm-6"><h3 class="mb-0">FAQ</h3></div>
|
|
||||||
<div class="col-sm-6">
|
|
||||||
<ol class="breadcrumb float-sm-end">
|
|
||||||
<li class="breadcrumb-item"><a href="#">Docs</a></li>
|
|
||||||
<li class="breadcrumb-item active" aria-current="page">FAQ</li>
|
|
||||||
</ol>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Row-->
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Content Header-->
|
|
||||||
<!--begin::App Content-->
|
|
||||||
<div class="app-content">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<h4 id="can-adminlte-be-used-with-wordpress">Can AdminLTE be used with WordPress?</h4>
|
|
||||||
<p>
|
|
||||||
AdminLTE is an HTML template that can be used for any purpose. However, it is not made
|
|
||||||
to be easily installed on WordPress. It will require some effort and enough knowledge
|
|
||||||
of the WordPress script to do so.
|
|
||||||
</p>
|
|
||||||
<h4 id="is-there-an-integration-guide-for-php-frameworks-such-as-yii-or-symfony">
|
|
||||||
Is there an integration guide for PHP frameworks such as Yii or Symfony?
|
|
||||||
</h4>
|
|
||||||
<p>
|
|
||||||
Short answer, no. However, there are forks and tutorials around the web that provide
|
|
||||||
info on how to integrate with many different frameworks. There are even versions of
|
|
||||||
AdminLTE that are integrated with jQuery ajax, AngularJS and/or MVC5 ASP .NET.
|
|
||||||
</p>
|
|
||||||
<h4 id="how-do-i-get-notified-of-new-adminlte-versions">
|
|
||||||
How do I get notified of new AdminLTE versions?
|
|
||||||
</h4>
|
|
||||||
<p>
|
|
||||||
You may watch the
|
|
||||||
<a href="https://github.com/ColorlibHQ/AdminLTE">releases on GitHub</a>.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Content-->
|
|
||||||
</main>
|
|
||||||
<!--end::App Main-->
|
|
||||||
<!--begin::Footer-->
|
|
||||||
<footer class="app-footer">
|
|
||||||
<!--begin::To the end-->
|
|
||||||
<div class="float-end d-none d-sm-inline">Anything you want</div>
|
|
||||||
<!--end::To the end-->
|
|
||||||
<!--begin::Copyright-->
|
|
||||||
<strong>
|
|
||||||
Copyright © 2014-2024
|
|
||||||
<a href="https://adminlte.io" class="text-decoration-none">AdminLTE.io</a>.
|
|
||||||
</strong>
|
|
||||||
All rights reserved.
|
|
||||||
<!--end::Copyright-->
|
|
||||||
</footer>
|
|
||||||
<!--end::Footer-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Wrapper-->
|
|
||||||
<!--begin::Script-->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/browser/overlayscrollbars.browser.es6.min.js"
|
|
||||||
integrity="sha256-dghWARbRe2eLlIJ56wNB+b760ywulqK3DzZYEpsg2fQ="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)--><!--begin::Required Plugin(popperjs for Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js"
|
|
||||||
integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(popperjs for Bootstrap 5)--><!--begin::Required Plugin(Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js"
|
|
||||||
integrity="sha384-0pUGZvbkm6XF6gxjEnlmuGrJXVbNuzT9qBBavbLwCsOGabYfZo0T0to5eqruptLy"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(Bootstrap 5)--><!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<script src="../../../dist/js/adminlte.js"></script>
|
|
||||||
<!--end::Required Plugin(AdminLTE)--><!--begin::OverlayScrollbars Configure-->
|
|
||||||
<script>
|
|
||||||
const SELECTOR_SIDEBAR_WRAPPER = '.sidebar-wrapper';
|
|
||||||
const Default = {
|
|
||||||
scrollbarTheme: 'os-theme-light',
|
|
||||||
scrollbarAutoHide: 'leave',
|
|
||||||
scrollbarClickScroll: true,
|
|
||||||
};
|
|
||||||
document.addEventListener('DOMContentLoaded', function () {
|
|
||||||
const sidebarWrapper = document.querySelector(SELECTOR_SIDEBAR_WRAPPER);
|
|
||||||
if (sidebarWrapper && typeof OverlayScrollbarsGlobal?.OverlayScrollbars !== 'undefined') {
|
|
||||||
OverlayScrollbarsGlobal.OverlayScrollbars(sidebarWrapper, {
|
|
||||||
scrollbars: {
|
|
||||||
theme: Default.scrollbarTheme,
|
|
||||||
autoHide: Default.scrollbarAutoHide,
|
|
||||||
clickScroll: Default.scrollbarClickScroll,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<!--end::OverlayScrollbars Configure-->
|
|
||||||
<!--end::Script-->
|
|
||||||
</body>
|
|
||||||
<!--end::Body-->
|
|
||||||
</html>
|
|
@ -1,906 +0,0 @@
|
|||||||
<!doctype html>
|
|
||||||
<html lang="en">
|
|
||||||
<!--begin::Head-->
|
|
||||||
<head>
|
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
||||||
<title>How To Contribute | AdminLTE 4</title>
|
|
||||||
<!--begin::Primary Meta Tags-->
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<meta name="title" content="How To Contribute | AdminLTE 4" />
|
|
||||||
<meta name="author" content="ColorlibHQ" />
|
|
||||||
<meta
|
|
||||||
name="description"
|
|
||||||
content="AdminLTE is a Free Bootstrap 5 Admin Dashboard, 30 example pages using Vanilla JS."
|
|
||||||
/>
|
|
||||||
<meta
|
|
||||||
name="keywords"
|
|
||||||
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"
|
|
||||||
/>
|
|
||||||
<!--end::Primary Meta Tags-->
|
|
||||||
<!--begin::Fonts-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/@fontsource/source-sans-3@5.0.12/index.css"
|
|
||||||
integrity="sha256-tXJfXfp6Ewt1ilPzLDtQnJV4hclT9XuaZUKyUvmyr+Q="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Fonts-->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/styles/overlayscrollbars.min.css"
|
|
||||||
integrity="sha256-tZHrRjVqNSRyWg2wbppGnT833E/Ys0DHWGwT04GiqQg="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<!--begin::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"
|
|
||||||
integrity="sha256-9kPW/n5nn53j4WMRYAxe9c1rCY96Oogo/MKSVdKzPmI="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<link rel="stylesheet" href="../../../dist/css/adminlte.css" />
|
|
||||||
<!--end::Required Plugin(AdminLTE)-->
|
|
||||||
<style>
|
|
||||||
[data-astro-image] {
|
|
||||||
width: 100%;
|
|
||||||
height: auto;
|
|
||||||
object-fit: var(--fit);
|
|
||||||
object-position: var(--pos);
|
|
||||||
aspect-ratio: var(--w) / var(--h);
|
|
||||||
}
|
|
||||||
[data-astro-image='responsive'] {
|
|
||||||
max-width: calc(var(--w) * 1px);
|
|
||||||
max-height: calc(var(--h) * 1px);
|
|
||||||
}
|
|
||||||
[data-astro-image='fixed'] {
|
|
||||||
width: calc(var(--w) * 1px);
|
|
||||||
height: calc(var(--h) * 1px);
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<!--end::Head-->
|
|
||||||
<!--begin::Body-->
|
|
||||||
<body class="layout-fixed sidebar-expand-lg bg-body-tertiary">
|
|
||||||
<!--begin::App Wrapper-->
|
|
||||||
<div class="app-wrapper">
|
|
||||||
<!--begin::Header-->
|
|
||||||
<nav class="app-header navbar navbar-expand bg-body">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<!--begin::Start Navbar Links-->
|
|
||||||
<ul class="navbar-nav">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" data-lte-toggle="sidebar" href="#" role="button">
|
|
||||||
<i class="bi bi-list"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item d-none d-md-block"><a href="#" class="nav-link">Home</a></li>
|
|
||||||
<li class="nav-item d-none d-md-block"><a href="#" class="nav-link">Contact</a></li>
|
|
||||||
</ul>
|
|
||||||
<!--end::Start Navbar Links-->
|
|
||||||
<!--begin::End Navbar Links-->
|
|
||||||
<ul class="navbar-nav ms-auto">
|
|
||||||
<!--begin::Navbar Search-->
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" data-widget="navbar-search" href="#" role="button">
|
|
||||||
<i class="bi bi-search"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Navbar Search-->
|
|
||||||
<!--begin::Messages Dropdown Menu-->
|
|
||||||
<li class="nav-item dropdown">
|
|
||||||
<a class="nav-link" data-bs-toggle="dropdown" href="#">
|
|
||||||
<i class="bi bi-chat-text"></i>
|
|
||||||
<span class="navbar-badge badge text-bg-danger">3</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user1-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
Brad Diesel
|
|
||||||
<span class="float-end fs-7 text-danger"
|
|
||||||
><i class="bi bi-star-fill"></i
|
|
||||||
></span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">Call me whenever you can...</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user8-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
John Pierce
|
|
||||||
<span class="float-end fs-7 text-secondary">
|
|
||||||
<i class="bi bi-star-fill"></i>
|
|
||||||
</span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">I got your message bro</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user3-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
Nora Silvester
|
|
||||||
<span class="float-end fs-7 text-warning">
|
|
||||||
<i class="bi bi-star-fill"></i>
|
|
||||||
</span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">The subject goes here</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item dropdown-footer">See All Messages</a>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<!--end::Messages Dropdown Menu-->
|
|
||||||
<!--begin::Notifications Dropdown Menu-->
|
|
||||||
<li class="nav-item dropdown">
|
|
||||||
<a class="nav-link" data-bs-toggle="dropdown" href="#">
|
|
||||||
<i class="bi bi-bell-fill"></i>
|
|
||||||
<span class="navbar-badge badge text-bg-warning">15</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<span class="dropdown-item dropdown-header">15 Notifications</span>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-envelope me-2"></i> 4 new messages
|
|
||||||
<span class="float-end text-secondary fs-7">3 mins</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-people-fill me-2"></i> 8 friend requests
|
|
||||||
<span class="float-end text-secondary fs-7">12 hours</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-file-earmark-fill me-2"></i> 3 new reports
|
|
||||||
<span class="float-end text-secondary fs-7">2 days</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item dropdown-footer"> See All Notifications </a>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<!--end::Notifications Dropdown Menu-->
|
|
||||||
<!--begin::Fullscreen Toggle-->
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" href="#" data-lte-toggle="fullscreen">
|
|
||||||
<i data-lte-icon="maximize" class="bi bi-arrows-fullscreen"></i>
|
|
||||||
<i data-lte-icon="minimize" class="bi bi-fullscreen-exit" style="display: none"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Fullscreen Toggle-->
|
|
||||||
<!--begin::User Menu Dropdown-->
|
|
||||||
<li class="nav-item dropdown user-menu">
|
|
||||||
<a href="#" class="nav-link dropdown-toggle" data-bs-toggle="dropdown">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user2-160x160.jpg"
|
|
||||||
class="user-image rounded-circle shadow"
|
|
||||||
alt="User Image"
|
|
||||||
/>
|
|
||||||
<span class="d-none d-md-inline">Alexander Pierce</span>
|
|
||||||
</a>
|
|
||||||
<ul class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<!--begin::User Image-->
|
|
||||||
<li class="user-header text-bg-primary">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user2-160x160.jpg"
|
|
||||||
class="rounded-circle shadow"
|
|
||||||
alt="User Image"
|
|
||||||
/>
|
|
||||||
<p>
|
|
||||||
Alexander Pierce - Web Developer
|
|
||||||
<small>Member since Nov. 2023</small>
|
|
||||||
</p>
|
|
||||||
</li>
|
|
||||||
<!--end::User Image-->
|
|
||||||
<!--begin::Menu Body-->
|
|
||||||
<li class="user-body">
|
|
||||||
<!--begin::Row-->
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-4 text-center"><a href="#">Followers</a></div>
|
|
||||||
<div class="col-4 text-center"><a href="#">Sales</a></div>
|
|
||||||
<div class="col-4 text-center"><a href="#">Friends</a></div>
|
|
||||||
</div>
|
|
||||||
<!--end::Row-->
|
|
||||||
</li>
|
|
||||||
<!--end::Menu Body-->
|
|
||||||
<!--begin::Menu Footer-->
|
|
||||||
<li class="user-footer">
|
|
||||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
|
||||||
<a href="#" class="btn btn-default btn-flat float-end">Sign out</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Menu Footer-->
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<!--end::User Menu Dropdown-->
|
|
||||||
</ul>
|
|
||||||
<!--end::End Navbar Links-->
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</nav>
|
|
||||||
<!--end::Header-->
|
|
||||||
<!--begin::Sidebar-->
|
|
||||||
<aside class="app-sidebar bg-body-secondary shadow" data-bs-theme="dark">
|
|
||||||
<!--begin::Sidebar Brand-->
|
|
||||||
<div class="sidebar-brand">
|
|
||||||
<!--begin::Brand Link-->
|
|
||||||
<a href="../index.html" class="brand-link">
|
|
||||||
<!--begin::Brand Image-->
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/AdminLTELogo.png"
|
|
||||||
alt="AdminLTE Logo"
|
|
||||||
class="brand-image opacity-75 shadow"
|
|
||||||
/>
|
|
||||||
<!--end::Brand Image-->
|
|
||||||
<!--begin::Brand Text-->
|
|
||||||
<span class="brand-text fw-light">AdminLTE 4</span>
|
|
||||||
<!--end::Brand Text-->
|
|
||||||
</a>
|
|
||||||
<!--end::Brand Link-->
|
|
||||||
</div>
|
|
||||||
<!--end::Sidebar Brand-->
|
|
||||||
<!--begin::Sidebar Wrapper-->
|
|
||||||
<div class="sidebar-wrapper">
|
|
||||||
<nav class="mt-2">
|
|
||||||
<!--begin::Sidebar Menu-->
|
|
||||||
<ul
|
|
||||||
class="nav sidebar-menu flex-column"
|
|
||||||
data-lte-toggle="treeview"
|
|
||||||
role="menu"
|
|
||||||
data-accordion="false"
|
|
||||||
>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-speedometer"></i>
|
|
||||||
<p>
|
|
||||||
Dashboard
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../index.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../index2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../index3.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../generate/theme.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-palette"></i>
|
|
||||||
<p>Theme Generate</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-seam-fill"></i>
|
|
||||||
<p>
|
|
||||||
Widgets
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../widgets/small-box.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Small Box</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../widgets/info-box.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>info Box</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../widgets/cards.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Cards</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-clipboard-fill"></i>
|
|
||||||
<p>
|
|
||||||
Layout Options
|
|
||||||
<span class="nav-badge badge text-bg-secondary me-3">6</span>
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/unfixed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Default Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/fixed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Fixed Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/layout-custom-area.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Layout <small>+ Custom Area </small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/sidebar-mini.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/collapsed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini <small>+ Collapsed</small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/logo-switch.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini <small>+ Logo Switch</small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/layout-rtl.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Layout RTL</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-tree-fill"></i>
|
|
||||||
<p>
|
|
||||||
UI Elements
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../UI/general.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>General</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../UI/icons.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Icons</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../UI/timeline.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Timeline</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-pencil-square"></i>
|
|
||||||
<p>
|
|
||||||
Forms
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../forms/general.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>General Elements</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-table"></i>
|
|
||||||
<p>
|
|
||||||
Tables
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../tables/simple.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Simple Tables</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">EXAMPLES</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Auth
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Version 1
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/login.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Login</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/register.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Register</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Version 2
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/login-v2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Login</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/register-v2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Register</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/lockscreen.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Lockscreen</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">DOCUMENTATIONS</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/introduction.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-download"></i>
|
|
||||||
<p>Installation</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/layout.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-grip-horizontal"></i>
|
|
||||||
<p>Layout</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/color-mode.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-star-half"></i>
|
|
||||||
<p>Color Mode</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-ui-checks-grid"></i>
|
|
||||||
<p>
|
|
||||||
Components
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/components/main-header.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Main Header</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/components/main-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Main Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-filetype-js"></i>
|
|
||||||
<p>
|
|
||||||
Javascript
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/javascript/treeview.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Treeview</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/browser-support.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-browser-edge"></i>
|
|
||||||
<p>Browser Support</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/how-to-contribute.html" class="nav-link active">
|
|
||||||
<i class="nav-icon bi bi-hand-thumbs-up-fill"></i>
|
|
||||||
<p>How To Contribute</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/faq.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-question-circle-fill"></i>
|
|
||||||
<p>FAQ</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/license.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-patch-check-fill"></i>
|
|
||||||
<p>License</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">MULTI LEVEL EXAMPLE</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>Level 1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>
|
|
||||||
Level 1
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Level 2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>
|
|
||||||
Level 2
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Level 2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>Level 1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">LABELS</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-danger"></i>
|
|
||||||
<p class="text">Important</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-warning"></i>
|
|
||||||
<p>Warning</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-info"></i>
|
|
||||||
<p>Informational</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
<!--end::Sidebar Menu-->
|
|
||||||
</nav>
|
|
||||||
</div>
|
|
||||||
<!--end::Sidebar Wrapper-->
|
|
||||||
</aside>
|
|
||||||
<!--end::Sidebar-->
|
|
||||||
<!--begin::App Main-->
|
|
||||||
<main class="app-main">
|
|
||||||
<!--begin::App Content Header-->
|
|
||||||
<div class="app-content-header">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<!--begin::Row-->
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-sm-6"><h3 class="mb-0">How To Contribute</h3></div>
|
|
||||||
<div class="col-sm-6">
|
|
||||||
<ol class="breadcrumb float-sm-end">
|
|
||||||
<li class="breadcrumb-item"><a href="#">Docs</a></li>
|
|
||||||
<li class="breadcrumb-item active" aria-current="page">How To Contribute</li>
|
|
||||||
</ol>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Row-->
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Content Header-->
|
|
||||||
<!--begin::App Content-->
|
|
||||||
<div class="app-content">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<h1 id="contributing-to-adminlte">Contributing to AdminLTE</h1>
|
|
||||||
<p>
|
|
||||||
Contributions are always <strong>welcome and recommended</strong>! Here is how for
|
|
||||||
beginner’s:
|
|
||||||
<a href="https://youtu.be/GbqSvJs-6W4">Get started with open source click here</a>
|
|
||||||
</p>
|
|
||||||
<ol>
|
|
||||||
<li>
|
|
||||||
<p>Contribution Requirements :</p>
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
When you contribute, you agree to give a non-exclusive license to AdminLTE.io to
|
|
||||||
use that contribution in any context as we (AdminLTE.io) see appropriate.
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
If you use content provided by another party, it must be appropriately licensed
|
|
||||||
using an <a href="https://opensource.org/licenses">open source</a> license.
|
|
||||||
</li>
|
|
||||||
<li>Contributions are only accepted through GitHub pull requests.</li>
|
|
||||||
<li>
|
|
||||||
Finally, contributed code must work in all supported browsers (see above for
|
|
||||||
browser support).
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<p>Installation :</p>
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
Fork the repository (<a href="https://help.github.com/articles/fork-a-repo/"
|
|
||||||
>here is the guide</a
|
|
||||||
>).
|
|
||||||
</li>
|
|
||||||
<li>Clone to your machine</li>
|
|
||||||
</ul>
|
|
||||||
<pre
|
|
||||||
class="astro-code dark-plus"
|
|
||||||
style="background-color: #1e1e1e; color: #d4d4d4; overflow-x: auto"
|
|
||||||
tabindex="0"
|
|
||||||
data-language="bash"
|
|
||||||
><code><span class="line"><span style="color:#DCDCAA">git</span><span style="color:#CE9178"> clone</span><span style="color:#CE9178"> https://github.com/YOUR_USERNAME/AdminLTE.git</span></span>
|
|
||||||
<span class="line"></span></code></pre>
|
|
||||||
<ul>
|
|
||||||
<li>Create a new branch from <code>master</code></li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<p>Compile dist files (Development) :</p>
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
To compile the dist files you need Node.js 18 or higher/npm (node package
|
|
||||||
manager)
|
|
||||||
</li>
|
|
||||||
<li><code>npm install</code> (install npm deps)</li>
|
|
||||||
<li>
|
|
||||||
<code>npm run dev</code> (developer mode, autocompile with browsersync support
|
|
||||||
for live demo)
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
Make your changes only in <code>./src</code> Folder OR
|
|
||||||
<code>package.json</code> in any files which are necessary for contribution
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
Do not make changes in <code>./dist/**</code> Because it contains compiled files
|
|
||||||
and do not include in PR (Pull Request)
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<code>npm run production</code> (compile css/js files and test all pages are
|
|
||||||
perfectly working fine, before creating a pull request)
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<p>Create a pull request to <code>master</code> branch</p>
|
|
||||||
</li>
|
|
||||||
</ol>
|
|
||||||
<h2 id="online-one-click-setup-for-contributing">
|
|
||||||
Online one-click setup for contributing
|
|
||||||
</h2>
|
|
||||||
<p>
|
|
||||||
You can use <a href="https://docs.github.com/en/codespaces">Codespace</a> an online
|
|
||||||
IDE which is free for Open Source for working on issues or making PRs (Pull Requests).
|
|
||||||
With a single click it will launch a workspace and automatically:
|
|
||||||
</p>
|
|
||||||
<ul>
|
|
||||||
<li>clone the <code>AdminLTE</code> repo.</li>
|
|
||||||
<li>
|
|
||||||
Open with <a href="https://docs.github.com/en/codespaces">Codespace</a> or
|
|
||||||
<a href="https://gitpod.io/from-referrer/"
|
|
||||||
><img src="https://gitpod.io/button/open-in-gitpod.svg" alt="Open in Gitpod"
|
|
||||||
/></a>
|
|
||||||
</li>
|
|
||||||
<li>install the dependencies.</li>
|
|
||||||
<li>run <code>npm run dev</code> to start the server.</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Content-->
|
|
||||||
</main>
|
|
||||||
<!--end::App Main-->
|
|
||||||
<!--begin::Footer-->
|
|
||||||
<footer class="app-footer">
|
|
||||||
<!--begin::To the end-->
|
|
||||||
<div class="float-end d-none d-sm-inline">Anything you want</div>
|
|
||||||
<!--end::To the end-->
|
|
||||||
<!--begin::Copyright-->
|
|
||||||
<strong>
|
|
||||||
Copyright © 2014-2024
|
|
||||||
<a href="https://adminlte.io" class="text-decoration-none">AdminLTE.io</a>.
|
|
||||||
</strong>
|
|
||||||
All rights reserved.
|
|
||||||
<!--end::Copyright-->
|
|
||||||
</footer>
|
|
||||||
<!--end::Footer-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Wrapper-->
|
|
||||||
<!--begin::Script-->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/browser/overlayscrollbars.browser.es6.min.js"
|
|
||||||
integrity="sha256-dghWARbRe2eLlIJ56wNB+b760ywulqK3DzZYEpsg2fQ="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)--><!--begin::Required Plugin(popperjs for Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js"
|
|
||||||
integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(popperjs for Bootstrap 5)--><!--begin::Required Plugin(Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js"
|
|
||||||
integrity="sha384-0pUGZvbkm6XF6gxjEnlmuGrJXVbNuzT9qBBavbLwCsOGabYfZo0T0to5eqruptLy"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(Bootstrap 5)--><!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<script src="../../../dist/js/adminlte.js"></script>
|
|
||||||
<!--end::Required Plugin(AdminLTE)--><!--begin::OverlayScrollbars Configure-->
|
|
||||||
<script>
|
|
||||||
const SELECTOR_SIDEBAR_WRAPPER = '.sidebar-wrapper';
|
|
||||||
const Default = {
|
|
||||||
scrollbarTheme: 'os-theme-light',
|
|
||||||
scrollbarAutoHide: 'leave',
|
|
||||||
scrollbarClickScroll: true,
|
|
||||||
};
|
|
||||||
document.addEventListener('DOMContentLoaded', function () {
|
|
||||||
const sidebarWrapper = document.querySelector(SELECTOR_SIDEBAR_WRAPPER);
|
|
||||||
if (sidebarWrapper && typeof OverlayScrollbarsGlobal?.OverlayScrollbars !== 'undefined') {
|
|
||||||
OverlayScrollbarsGlobal.OverlayScrollbars(sidebarWrapper, {
|
|
||||||
scrollbars: {
|
|
||||||
theme: Default.scrollbarTheme,
|
|
||||||
autoHide: Default.scrollbarAutoHide,
|
|
||||||
clickScroll: Default.scrollbarClickScroll,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<!--end::OverlayScrollbars Configure-->
|
|
||||||
<!--end::Script-->
|
|
||||||
</body>
|
|
||||||
<!--end::Body-->
|
|
||||||
</html>
|
|
@ -1,895 +0,0 @@
|
|||||||
<!doctype html>
|
|
||||||
<html lang="en">
|
|
||||||
<!--begin::Head-->
|
|
||||||
<head>
|
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
||||||
<title>Introduction | AdminLTE 4</title>
|
|
||||||
<!--begin::Primary Meta Tags-->
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<meta name="title" content="Introduction | AdminLTE 4" />
|
|
||||||
<meta name="author" content="ColorlibHQ" />
|
|
||||||
<meta
|
|
||||||
name="description"
|
|
||||||
content="AdminLTE is a Free Bootstrap 5 Admin Dashboard, 30 example pages using Vanilla JS."
|
|
||||||
/>
|
|
||||||
<meta
|
|
||||||
name="keywords"
|
|
||||||
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"
|
|
||||||
/>
|
|
||||||
<!--end::Primary Meta Tags-->
|
|
||||||
<!--begin::Fonts-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/@fontsource/source-sans-3@5.0.12/index.css"
|
|
||||||
integrity="sha256-tXJfXfp6Ewt1ilPzLDtQnJV4hclT9XuaZUKyUvmyr+Q="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Fonts-->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/styles/overlayscrollbars.min.css"
|
|
||||||
integrity="sha256-tZHrRjVqNSRyWg2wbppGnT833E/Ys0DHWGwT04GiqQg="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<!--begin::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"
|
|
||||||
integrity="sha256-9kPW/n5nn53j4WMRYAxe9c1rCY96Oogo/MKSVdKzPmI="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<link rel="stylesheet" href="../../../dist/css/adminlte.css" />
|
|
||||||
<!--end::Required Plugin(AdminLTE)-->
|
|
||||||
<style>
|
|
||||||
[data-astro-image] {
|
|
||||||
width: 100%;
|
|
||||||
height: auto;
|
|
||||||
object-fit: var(--fit);
|
|
||||||
object-position: var(--pos);
|
|
||||||
aspect-ratio: var(--w) / var(--h);
|
|
||||||
}
|
|
||||||
[data-astro-image='responsive'] {
|
|
||||||
max-width: calc(var(--w) * 1px);
|
|
||||||
max-height: calc(var(--h) * 1px);
|
|
||||||
}
|
|
||||||
[data-astro-image='fixed'] {
|
|
||||||
width: calc(var(--w) * 1px);
|
|
||||||
height: calc(var(--h) * 1px);
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<!--end::Head-->
|
|
||||||
<!--begin::Body-->
|
|
||||||
<body class="layout-fixed sidebar-expand-lg bg-body-tertiary">
|
|
||||||
<!--begin::App Wrapper-->
|
|
||||||
<div class="app-wrapper">
|
|
||||||
<!--begin::Header-->
|
|
||||||
<nav class="app-header navbar navbar-expand bg-body">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<!--begin::Start Navbar Links-->
|
|
||||||
<ul class="navbar-nav">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" data-lte-toggle="sidebar" href="#" role="button">
|
|
||||||
<i class="bi bi-list"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item d-none d-md-block"><a href="#" class="nav-link">Home</a></li>
|
|
||||||
<li class="nav-item d-none d-md-block"><a href="#" class="nav-link">Contact</a></li>
|
|
||||||
</ul>
|
|
||||||
<!--end::Start Navbar Links-->
|
|
||||||
<!--begin::End Navbar Links-->
|
|
||||||
<ul class="navbar-nav ms-auto">
|
|
||||||
<!--begin::Navbar Search-->
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" data-widget="navbar-search" href="#" role="button">
|
|
||||||
<i class="bi bi-search"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Navbar Search-->
|
|
||||||
<!--begin::Messages Dropdown Menu-->
|
|
||||||
<li class="nav-item dropdown">
|
|
||||||
<a class="nav-link" data-bs-toggle="dropdown" href="#">
|
|
||||||
<i class="bi bi-chat-text"></i>
|
|
||||||
<span class="navbar-badge badge text-bg-danger">3</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user1-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
Brad Diesel
|
|
||||||
<span class="float-end fs-7 text-danger"
|
|
||||||
><i class="bi bi-star-fill"></i
|
|
||||||
></span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">Call me whenever you can...</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user8-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
John Pierce
|
|
||||||
<span class="float-end fs-7 text-secondary">
|
|
||||||
<i class="bi bi-star-fill"></i>
|
|
||||||
</span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">I got your message bro</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user3-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
Nora Silvester
|
|
||||||
<span class="float-end fs-7 text-warning">
|
|
||||||
<i class="bi bi-star-fill"></i>
|
|
||||||
</span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">The subject goes here</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item dropdown-footer">See All Messages</a>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<!--end::Messages Dropdown Menu-->
|
|
||||||
<!--begin::Notifications Dropdown Menu-->
|
|
||||||
<li class="nav-item dropdown">
|
|
||||||
<a class="nav-link" data-bs-toggle="dropdown" href="#">
|
|
||||||
<i class="bi bi-bell-fill"></i>
|
|
||||||
<span class="navbar-badge badge text-bg-warning">15</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<span class="dropdown-item dropdown-header">15 Notifications</span>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-envelope me-2"></i> 4 new messages
|
|
||||||
<span class="float-end text-secondary fs-7">3 mins</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-people-fill me-2"></i> 8 friend requests
|
|
||||||
<span class="float-end text-secondary fs-7">12 hours</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-file-earmark-fill me-2"></i> 3 new reports
|
|
||||||
<span class="float-end text-secondary fs-7">2 days</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item dropdown-footer"> See All Notifications </a>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<!--end::Notifications Dropdown Menu-->
|
|
||||||
<!--begin::Fullscreen Toggle-->
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" href="#" data-lte-toggle="fullscreen">
|
|
||||||
<i data-lte-icon="maximize" class="bi bi-arrows-fullscreen"></i>
|
|
||||||
<i data-lte-icon="minimize" class="bi bi-fullscreen-exit" style="display: none"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Fullscreen Toggle-->
|
|
||||||
<!--begin::User Menu Dropdown-->
|
|
||||||
<li class="nav-item dropdown user-menu">
|
|
||||||
<a href="#" class="nav-link dropdown-toggle" data-bs-toggle="dropdown">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user2-160x160.jpg"
|
|
||||||
class="user-image rounded-circle shadow"
|
|
||||||
alt="User Image"
|
|
||||||
/>
|
|
||||||
<span class="d-none d-md-inline">Alexander Pierce</span>
|
|
||||||
</a>
|
|
||||||
<ul class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<!--begin::User Image-->
|
|
||||||
<li class="user-header text-bg-primary">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user2-160x160.jpg"
|
|
||||||
class="rounded-circle shadow"
|
|
||||||
alt="User Image"
|
|
||||||
/>
|
|
||||||
<p>
|
|
||||||
Alexander Pierce - Web Developer
|
|
||||||
<small>Member since Nov. 2023</small>
|
|
||||||
</p>
|
|
||||||
</li>
|
|
||||||
<!--end::User Image-->
|
|
||||||
<!--begin::Menu Body-->
|
|
||||||
<li class="user-body">
|
|
||||||
<!--begin::Row-->
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-4 text-center"><a href="#">Followers</a></div>
|
|
||||||
<div class="col-4 text-center"><a href="#">Sales</a></div>
|
|
||||||
<div class="col-4 text-center"><a href="#">Friends</a></div>
|
|
||||||
</div>
|
|
||||||
<!--end::Row-->
|
|
||||||
</li>
|
|
||||||
<!--end::Menu Body-->
|
|
||||||
<!--begin::Menu Footer-->
|
|
||||||
<li class="user-footer">
|
|
||||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
|
||||||
<a href="#" class="btn btn-default btn-flat float-end">Sign out</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Menu Footer-->
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<!--end::User Menu Dropdown-->
|
|
||||||
</ul>
|
|
||||||
<!--end::End Navbar Links-->
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</nav>
|
|
||||||
<!--end::Header-->
|
|
||||||
<!--begin::Sidebar-->
|
|
||||||
<aside class="app-sidebar bg-body-secondary shadow" data-bs-theme="dark">
|
|
||||||
<!--begin::Sidebar Brand-->
|
|
||||||
<div class="sidebar-brand">
|
|
||||||
<!--begin::Brand Link-->
|
|
||||||
<a href="../index.html" class="brand-link">
|
|
||||||
<!--begin::Brand Image-->
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/AdminLTELogo.png"
|
|
||||||
alt="AdminLTE Logo"
|
|
||||||
class="brand-image opacity-75 shadow"
|
|
||||||
/>
|
|
||||||
<!--end::Brand Image-->
|
|
||||||
<!--begin::Brand Text-->
|
|
||||||
<span class="brand-text fw-light">AdminLTE 4</span>
|
|
||||||
<!--end::Brand Text-->
|
|
||||||
</a>
|
|
||||||
<!--end::Brand Link-->
|
|
||||||
</div>
|
|
||||||
<!--end::Sidebar Brand-->
|
|
||||||
<!--begin::Sidebar Wrapper-->
|
|
||||||
<div class="sidebar-wrapper">
|
|
||||||
<nav class="mt-2">
|
|
||||||
<!--begin::Sidebar Menu-->
|
|
||||||
<ul
|
|
||||||
class="nav sidebar-menu flex-column"
|
|
||||||
data-lte-toggle="treeview"
|
|
||||||
role="menu"
|
|
||||||
data-accordion="false"
|
|
||||||
>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-speedometer"></i>
|
|
||||||
<p>
|
|
||||||
Dashboard
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../index.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../index2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../index3.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../generate/theme.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-palette"></i>
|
|
||||||
<p>Theme Generate</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-seam-fill"></i>
|
|
||||||
<p>
|
|
||||||
Widgets
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../widgets/small-box.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Small Box</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../widgets/info-box.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>info Box</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../widgets/cards.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Cards</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-clipboard-fill"></i>
|
|
||||||
<p>
|
|
||||||
Layout Options
|
|
||||||
<span class="nav-badge badge text-bg-secondary me-3">6</span>
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/unfixed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Default Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/fixed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Fixed Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/layout-custom-area.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Layout <small>+ Custom Area </small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/sidebar-mini.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/collapsed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini <small>+ Collapsed</small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/logo-switch.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini <small>+ Logo Switch</small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/layout-rtl.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Layout RTL</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-tree-fill"></i>
|
|
||||||
<p>
|
|
||||||
UI Elements
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../UI/general.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>General</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../UI/icons.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Icons</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../UI/timeline.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Timeline</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-pencil-square"></i>
|
|
||||||
<p>
|
|
||||||
Forms
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../forms/general.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>General Elements</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-table"></i>
|
|
||||||
<p>
|
|
||||||
Tables
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../tables/simple.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Simple Tables</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">EXAMPLES</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Auth
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Version 1
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/login.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Login</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/register.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Register</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Version 2
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/login-v2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Login</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/register-v2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Register</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/lockscreen.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Lockscreen</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">DOCUMENTATIONS</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/introduction.html" class="nav-link active">
|
|
||||||
<i class="nav-icon bi bi-download"></i>
|
|
||||||
<p>Installation</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/layout.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-grip-horizontal"></i>
|
|
||||||
<p>Layout</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/color-mode.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-star-half"></i>
|
|
||||||
<p>Color Mode</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-ui-checks-grid"></i>
|
|
||||||
<p>
|
|
||||||
Components
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/components/main-header.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Main Header</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/components/main-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Main Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-filetype-js"></i>
|
|
||||||
<p>
|
|
||||||
Javascript
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/javascript/treeview.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Treeview</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/browser-support.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-browser-edge"></i>
|
|
||||||
<p>Browser Support</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/how-to-contribute.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-hand-thumbs-up-fill"></i>
|
|
||||||
<p>How To Contribute</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/faq.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-question-circle-fill"></i>
|
|
||||||
<p>FAQ</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/license.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-patch-check-fill"></i>
|
|
||||||
<p>License</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">MULTI LEVEL EXAMPLE</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>Level 1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>
|
|
||||||
Level 1
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Level 2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>
|
|
||||||
Level 2
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Level 2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>Level 1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">LABELS</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-danger"></i>
|
|
||||||
<p class="text">Important</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-warning"></i>
|
|
||||||
<p>Warning</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-info"></i>
|
|
||||||
<p>Informational</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
<!--end::Sidebar Menu-->
|
|
||||||
</nav>
|
|
||||||
</div>
|
|
||||||
<!--end::Sidebar Wrapper-->
|
|
||||||
</aside>
|
|
||||||
<!--end::Sidebar-->
|
|
||||||
<!--begin::App Main-->
|
|
||||||
<main class="app-main">
|
|
||||||
<!--begin::App Content Header-->
|
|
||||||
<div class="app-content-header">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<!--begin::Row-->
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-sm-6"><h3 class="mb-0">Introduction</h3></div>
|
|
||||||
<div class="col-sm-6">
|
|
||||||
<ol class="breadcrumb float-sm-end">
|
|
||||||
<li class="breadcrumb-item"><a href="#">Docs</a></li>
|
|
||||||
<li class="breadcrumb-item active" aria-current="page">Introduction</li>
|
|
||||||
</ol>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Row-->
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Content Header-->
|
|
||||||
<!--begin::App Content-->
|
|
||||||
<div class="app-content">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<h2 id="quick-start">Quick start</h2>
|
|
||||||
<p>There are multiple ways to install AdminLTE.</p>
|
|
||||||
<h3 id="download--changelog">Download & Changelog:</h3>
|
|
||||||
<p>
|
|
||||||
Always Recommended to download from GitHub latest release
|
|
||||||
<a href="https://github.com/ColorlibHQ/AdminLTE/releases/latest">AdminLTE 4</a> for
|
|
||||||
bug free and latest features.<br />
|
|
||||||
Visit the <a href="https://github.com/ColorlibHQ/AdminLTE/releases">releases</a> page
|
|
||||||
to view the changelog.<br />
|
|
||||||
Legacy Releases are
|
|
||||||
<a href="https://github.com/ColorlibHQ/AdminLTE/releases/tag/v3.2.0">AdminLTE 3</a> /
|
|
||||||
<a href="https://github.com/ColorlibHQ/AdminLTE/releases/tag/v2.4.18">AdminLTE 2</a> /
|
|
||||||
<a href="https://github.com/ColorlibHQ/AdminLTE/releases/tag/1.3.1">AdminLTE 1</a>.
|
|
||||||
</p>
|
|
||||||
<h2 id="stable-release">Stable release</h2>
|
|
||||||
<h3 id="grab-from-jsdelivr-cdn">
|
|
||||||
Grab from <a href="https://www.jsdelivr.com/package/npm/admin-lte">jsdelivr</a> CDN:
|
|
||||||
</h3>
|
|
||||||
<p>
|
|
||||||
<em
|
|
||||||
><strong>Important Note</strong>: You needed to add separately cdn links for plugins
|
|
||||||
in your project.</em
|
|
||||||
>
|
|
||||||
</p>
|
|
||||||
<pre
|
|
||||||
class="astro-code dark-plus"
|
|
||||||
style="background-color: #1e1e1e; color: #d4d4d4; overflow-x: auto"
|
|
||||||
tabindex="0"
|
|
||||||
data-language="html"
|
|
||||||
><code><span class="line"><span style="color:#808080"><</span><span style="color:#569CD6">script</span></span>
|
|
||||||
<span class="line"><span style="color:#9CDCFE"> src</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"https://cdn.jsdelivr.net/npm/admin-lte@4.0.0-beta3/dist/js/adminlte.min.js"</span></span>
|
|
||||||
<span class="line"><span style="color:#9CDCFE"> crossorigin</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"anonymous"</span></span>
|
|
||||||
<span class="line"><span style="color:#808080">></</span><span style="color:#569CD6">script</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"></span></code></pre>
|
|
||||||
<pre
|
|
||||||
class="astro-code dark-plus"
|
|
||||||
style="background-color: #1e1e1e; color: #d4d4d4; overflow-x: auto"
|
|
||||||
tabindex="0"
|
|
||||||
data-language="html"
|
|
||||||
><code><span class="line"><span style="color:#808080"><</span><span style="color:#569CD6">link</span></span>
|
|
||||||
<span class="line"><span style="color:#9CDCFE"> rel</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"stylesheet"</span></span>
|
|
||||||
<span class="line"><span style="color:#9CDCFE"> href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"https://cdn.jsdelivr.net/npm/admin-lte@4.0.0-beta3/dist/css/adminlte.min.css"</span></span>
|
|
||||||
<span class="line"><span style="color:#9CDCFE"> crossorigin</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"anonymous"</span></span>
|
|
||||||
<span class="line"><span style="color:#808080">/></span></span>
|
|
||||||
<span class="line"></span></code></pre>
|
|
||||||
<h3 id="using-the-command-line">Using The Command Line:</h3>
|
|
||||||
<p>
|
|
||||||
<em
|
|
||||||
><strong>Important Note</strong>: To install it via npm/Yarn, you need at least
|
|
||||||
Node.js 14 or higher.</em
|
|
||||||
>
|
|
||||||
</p>
|
|
||||||
<h4 id="via-npm">Via npm</h4>
|
|
||||||
<pre
|
|
||||||
class="astro-code dark-plus"
|
|
||||||
style="background-color: #1e1e1e; color: #d4d4d4; overflow-x: auto"
|
|
||||||
tabindex="0"
|
|
||||||
data-language="bash"
|
|
||||||
><code><span class="line"><span style="color:#DCDCAA">npm</span><span style="color:#CE9178"> install</span><span style="color:#CE9178"> admin-lte@4.0.0-beta3</span><span style="color:#569CD6"> --save</span></span>
|
|
||||||
<span class="line"></span></code></pre>
|
|
||||||
<h4 id="via-yarn">Via Yarn</h4>
|
|
||||||
<pre
|
|
||||||
class="astro-code dark-plus"
|
|
||||||
style="background-color: #1e1e1e; color: #d4d4d4; overflow-x: auto"
|
|
||||||
tabindex="0"
|
|
||||||
data-language="bash"
|
|
||||||
><code><span class="line"><span style="color:#DCDCAA">yarn</span><span style="color:#CE9178"> add</span><span style="color:#CE9178"> admin-lte@4.0.0-beta3</span></span>
|
|
||||||
<span class="line"></span></code></pre>
|
|
||||||
<h4 id="via-composer">Via Composer</h4>
|
|
||||||
<pre
|
|
||||||
class="astro-code dark-plus"
|
|
||||||
style="background-color: #1e1e1e; color: #d4d4d4; overflow-x: auto"
|
|
||||||
tabindex="0"
|
|
||||||
data-language="bash"
|
|
||||||
><code><span class="line"><span style="color:#DCDCAA">composer</span><span style="color:#CE9178"> require</span><span style="color:#CE9178"> "almasaeed2010/adminlte=4.0.0-beta3"</span></span>
|
|
||||||
<span class="line"></span></code></pre>
|
|
||||||
<h4 id="via-git">Via Git</h4>
|
|
||||||
<pre
|
|
||||||
class="astro-code dark-plus"
|
|
||||||
style="background-color: #1e1e1e; color: #d4d4d4; overflow-x: auto"
|
|
||||||
tabindex="0"
|
|
||||||
data-language="bash"
|
|
||||||
><code><span class="line"><span style="color:#DCDCAA">git</span><span style="color:#CE9178"> clone</span><span style="color:#CE9178"> https://github.com/ColorlibHQ/AdminLTE.git</span></span>
|
|
||||||
<span class="line"></span></code></pre>
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Content-->
|
|
||||||
</main>
|
|
||||||
<!--end::App Main-->
|
|
||||||
<!--begin::Footer-->
|
|
||||||
<footer class="app-footer">
|
|
||||||
<!--begin::To the end-->
|
|
||||||
<div class="float-end d-none d-sm-inline">Anything you want</div>
|
|
||||||
<!--end::To the end-->
|
|
||||||
<!--begin::Copyright-->
|
|
||||||
<strong>
|
|
||||||
Copyright © 2014-2024
|
|
||||||
<a href="https://adminlte.io" class="text-decoration-none">AdminLTE.io</a>.
|
|
||||||
</strong>
|
|
||||||
All rights reserved.
|
|
||||||
<!--end::Copyright-->
|
|
||||||
</footer>
|
|
||||||
<!--end::Footer-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Wrapper-->
|
|
||||||
<!--begin::Script-->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/browser/overlayscrollbars.browser.es6.min.js"
|
|
||||||
integrity="sha256-dghWARbRe2eLlIJ56wNB+b760ywulqK3DzZYEpsg2fQ="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)--><!--begin::Required Plugin(popperjs for Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js"
|
|
||||||
integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(popperjs for Bootstrap 5)--><!--begin::Required Plugin(Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js"
|
|
||||||
integrity="sha384-0pUGZvbkm6XF6gxjEnlmuGrJXVbNuzT9qBBavbLwCsOGabYfZo0T0to5eqruptLy"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(Bootstrap 5)--><!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<script src="../../../dist/js/adminlte.js"></script>
|
|
||||||
<!--end::Required Plugin(AdminLTE)--><!--begin::OverlayScrollbars Configure-->
|
|
||||||
<script>
|
|
||||||
const SELECTOR_SIDEBAR_WRAPPER = '.sidebar-wrapper';
|
|
||||||
const Default = {
|
|
||||||
scrollbarTheme: 'os-theme-light',
|
|
||||||
scrollbarAutoHide: 'leave',
|
|
||||||
scrollbarClickScroll: true,
|
|
||||||
};
|
|
||||||
document.addEventListener('DOMContentLoaded', function () {
|
|
||||||
const sidebarWrapper = document.querySelector(SELECTOR_SIDEBAR_WRAPPER);
|
|
||||||
if (sidebarWrapper && typeof OverlayScrollbarsGlobal?.OverlayScrollbars !== 'undefined') {
|
|
||||||
OverlayScrollbarsGlobal.OverlayScrollbars(sidebarWrapper, {
|
|
||||||
scrollbars: {
|
|
||||||
theme: Default.scrollbarTheme,
|
|
||||||
autoHide: Default.scrollbarAutoHide,
|
|
||||||
clickScroll: Default.scrollbarClickScroll,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<!--end::OverlayScrollbars Configure-->
|
|
||||||
<!--end::Script-->
|
|
||||||
</body>
|
|
||||||
<!--end::Body-->
|
|
||||||
</html>
|
|
@ -1,847 +0,0 @@
|
|||||||
<!doctype html>
|
|
||||||
<html lang="en">
|
|
||||||
<!--begin::Head-->
|
|
||||||
<head>
|
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
||||||
<title>Treeview Plugin | AdminLTE 4</title>
|
|
||||||
<!--begin::Primary Meta Tags-->
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<meta name="title" content="Treeview Plugin | AdminLTE 4" />
|
|
||||||
<meta name="author" content="ColorlibHQ" />
|
|
||||||
<meta
|
|
||||||
name="description"
|
|
||||||
content="AdminLTE is a Free Bootstrap 5 Admin Dashboard, 30 example pages using Vanilla JS."
|
|
||||||
/>
|
|
||||||
<meta
|
|
||||||
name="keywords"
|
|
||||||
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"
|
|
||||||
/>
|
|
||||||
<!--end::Primary Meta Tags-->
|
|
||||||
<!--begin::Fonts-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/@fontsource/source-sans-3@5.0.12/index.css"
|
|
||||||
integrity="sha256-tXJfXfp6Ewt1ilPzLDtQnJV4hclT9XuaZUKyUvmyr+Q="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Fonts-->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/styles/overlayscrollbars.min.css"
|
|
||||||
integrity="sha256-tZHrRjVqNSRyWg2wbppGnT833E/Ys0DHWGwT04GiqQg="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<!--begin::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"
|
|
||||||
integrity="sha256-9kPW/n5nn53j4WMRYAxe9c1rCY96Oogo/MKSVdKzPmI="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<link rel="stylesheet" href="../../../../dist/css/adminlte.css" />
|
|
||||||
<!--end::Required Plugin(AdminLTE)-->
|
|
||||||
<style>
|
|
||||||
[data-astro-image] {
|
|
||||||
width: 100%;
|
|
||||||
height: auto;
|
|
||||||
object-fit: var(--fit);
|
|
||||||
object-position: var(--pos);
|
|
||||||
aspect-ratio: var(--w) / var(--h);
|
|
||||||
}
|
|
||||||
[data-astro-image='responsive'] {
|
|
||||||
max-width: calc(var(--w) * 1px);
|
|
||||||
max-height: calc(var(--h) * 1px);
|
|
||||||
}
|
|
||||||
[data-astro-image='fixed'] {
|
|
||||||
width: calc(var(--w) * 1px);
|
|
||||||
height: calc(var(--h) * 1px);
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<!--end::Head-->
|
|
||||||
<!--begin::Body-->
|
|
||||||
<body class="layout-fixed sidebar-expand-lg bg-body-tertiary">
|
|
||||||
<!--begin::App Wrapper-->
|
|
||||||
<div class="app-wrapper">
|
|
||||||
<!--begin::Header-->
|
|
||||||
<nav class="app-header navbar navbar-expand bg-body">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<!--begin::Start Navbar Links-->
|
|
||||||
<ul class="navbar-nav">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" data-lte-toggle="sidebar" href="#" role="button">
|
|
||||||
<i class="bi bi-list"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item d-none d-md-block"><a href="#" class="nav-link">Home</a></li>
|
|
||||||
<li class="nav-item d-none d-md-block"><a href="#" class="nav-link">Contact</a></li>
|
|
||||||
</ul>
|
|
||||||
<!--end::Start Navbar Links-->
|
|
||||||
<!--begin::End Navbar Links-->
|
|
||||||
<ul class="navbar-nav ms-auto">
|
|
||||||
<!--begin::Navbar Search-->
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" data-widget="navbar-search" href="#" role="button">
|
|
||||||
<i class="bi bi-search"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Navbar Search-->
|
|
||||||
<!--begin::Messages Dropdown Menu-->
|
|
||||||
<li class="nav-item dropdown">
|
|
||||||
<a class="nav-link" data-bs-toggle="dropdown" href="#">
|
|
||||||
<i class="bi bi-chat-text"></i>
|
|
||||||
<span class="navbar-badge badge text-bg-danger">3</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../../dist/assets/img/user1-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
Brad Diesel
|
|
||||||
<span class="float-end fs-7 text-danger"
|
|
||||||
><i class="bi bi-star-fill"></i
|
|
||||||
></span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">Call me whenever you can...</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../../dist/assets/img/user8-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
John Pierce
|
|
||||||
<span class="float-end fs-7 text-secondary">
|
|
||||||
<i class="bi bi-star-fill"></i>
|
|
||||||
</span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">I got your message bro</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../../dist/assets/img/user3-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
Nora Silvester
|
|
||||||
<span class="float-end fs-7 text-warning">
|
|
||||||
<i class="bi bi-star-fill"></i>
|
|
||||||
</span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">The subject goes here</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item dropdown-footer">See All Messages</a>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<!--end::Messages Dropdown Menu-->
|
|
||||||
<!--begin::Notifications Dropdown Menu-->
|
|
||||||
<li class="nav-item dropdown">
|
|
||||||
<a class="nav-link" data-bs-toggle="dropdown" href="#">
|
|
||||||
<i class="bi bi-bell-fill"></i>
|
|
||||||
<span class="navbar-badge badge text-bg-warning">15</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<span class="dropdown-item dropdown-header">15 Notifications</span>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-envelope me-2"></i> 4 new messages
|
|
||||||
<span class="float-end text-secondary fs-7">3 mins</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-people-fill me-2"></i> 8 friend requests
|
|
||||||
<span class="float-end text-secondary fs-7">12 hours</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-file-earmark-fill me-2"></i> 3 new reports
|
|
||||||
<span class="float-end text-secondary fs-7">2 days</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item dropdown-footer"> See All Notifications </a>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<!--end::Notifications Dropdown Menu-->
|
|
||||||
<!--begin::Fullscreen Toggle-->
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" href="#" data-lte-toggle="fullscreen">
|
|
||||||
<i data-lte-icon="maximize" class="bi bi-arrows-fullscreen"></i>
|
|
||||||
<i data-lte-icon="minimize" class="bi bi-fullscreen-exit" style="display: none"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Fullscreen Toggle-->
|
|
||||||
<!--begin::User Menu Dropdown-->
|
|
||||||
<li class="nav-item dropdown user-menu">
|
|
||||||
<a href="#" class="nav-link dropdown-toggle" data-bs-toggle="dropdown">
|
|
||||||
<img
|
|
||||||
src="../../../../dist/assets/img/user2-160x160.jpg"
|
|
||||||
class="user-image rounded-circle shadow"
|
|
||||||
alt="User Image"
|
|
||||||
/>
|
|
||||||
<span class="d-none d-md-inline">Alexander Pierce</span>
|
|
||||||
</a>
|
|
||||||
<ul class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<!--begin::User Image-->
|
|
||||||
<li class="user-header text-bg-primary">
|
|
||||||
<img
|
|
||||||
src="../../../../dist/assets/img/user2-160x160.jpg"
|
|
||||||
class="rounded-circle shadow"
|
|
||||||
alt="User Image"
|
|
||||||
/>
|
|
||||||
<p>
|
|
||||||
Alexander Pierce - Web Developer
|
|
||||||
<small>Member since Nov. 2023</small>
|
|
||||||
</p>
|
|
||||||
</li>
|
|
||||||
<!--end::User Image-->
|
|
||||||
<!--begin::Menu Body-->
|
|
||||||
<li class="user-body">
|
|
||||||
<!--begin::Row-->
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-4 text-center"><a href="#">Followers</a></div>
|
|
||||||
<div class="col-4 text-center"><a href="#">Sales</a></div>
|
|
||||||
<div class="col-4 text-center"><a href="#">Friends</a></div>
|
|
||||||
</div>
|
|
||||||
<!--end::Row-->
|
|
||||||
</li>
|
|
||||||
<!--end::Menu Body-->
|
|
||||||
<!--begin::Menu Footer-->
|
|
||||||
<li class="user-footer">
|
|
||||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
|
||||||
<a href="#" class="btn btn-default btn-flat float-end">Sign out</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Menu Footer-->
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<!--end::User Menu Dropdown-->
|
|
||||||
</ul>
|
|
||||||
<!--end::End Navbar Links-->
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</nav>
|
|
||||||
<!--end::Header-->
|
|
||||||
<!--begin::Sidebar-->
|
|
||||||
<aside class="app-sidebar bg-body-secondary shadow" data-bs-theme="dark">
|
|
||||||
<!--begin::Sidebar Brand-->
|
|
||||||
<div class="sidebar-brand">
|
|
||||||
<!--begin::Brand Link-->
|
|
||||||
<a href="../../index.html" class="brand-link">
|
|
||||||
<!--begin::Brand Image-->
|
|
||||||
<img
|
|
||||||
src="../../../../dist/assets/img/AdminLTELogo.png"
|
|
||||||
alt="AdminLTE Logo"
|
|
||||||
class="brand-image opacity-75 shadow"
|
|
||||||
/>
|
|
||||||
<!--end::Brand Image-->
|
|
||||||
<!--begin::Brand Text-->
|
|
||||||
<span class="brand-text fw-light">AdminLTE 4</span>
|
|
||||||
<!--end::Brand Text-->
|
|
||||||
</a>
|
|
||||||
<!--end::Brand Link-->
|
|
||||||
</div>
|
|
||||||
<!--end::Sidebar Brand-->
|
|
||||||
<!--begin::Sidebar Wrapper-->
|
|
||||||
<div class="sidebar-wrapper">
|
|
||||||
<nav class="mt-2">
|
|
||||||
<!--begin::Sidebar Menu-->
|
|
||||||
<ul
|
|
||||||
class="nav sidebar-menu flex-column"
|
|
||||||
data-lte-toggle="treeview"
|
|
||||||
role="menu"
|
|
||||||
data-accordion="false"
|
|
||||||
>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-speedometer"></i>
|
|
||||||
<p>
|
|
||||||
Dashboard
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../index.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../index2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../index3.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../generate/theme.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-palette"></i>
|
|
||||||
<p>Theme Generate</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-seam-fill"></i>
|
|
||||||
<p>
|
|
||||||
Widgets
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../widgets/small-box.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Small Box</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../widgets/info-box.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>info Box</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../widgets/cards.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Cards</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-clipboard-fill"></i>
|
|
||||||
<p>
|
|
||||||
Layout Options
|
|
||||||
<span class="nav-badge badge text-bg-secondary me-3">6</span>
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../layout/unfixed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Default Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../layout/fixed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Fixed Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../layout/layout-custom-area.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Layout <small>+ Custom Area </small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../layout/sidebar-mini.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../layout/collapsed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini <small>+ Collapsed</small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../layout/logo-switch.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini <small>+ Logo Switch</small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../layout/layout-rtl.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Layout RTL</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-tree-fill"></i>
|
|
||||||
<p>
|
|
||||||
UI Elements
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../UI/general.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>General</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../UI/icons.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Icons</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../UI/timeline.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Timeline</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-pencil-square"></i>
|
|
||||||
<p>
|
|
||||||
Forms
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../forms/general.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>General Elements</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-table"></i>
|
|
||||||
<p>
|
|
||||||
Tables
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../tables/simple.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Simple Tables</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">EXAMPLES</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Auth
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Version 1
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../examples/login.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Login</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../examples/register.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Register</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Version 2
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../examples/login-v2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Login</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../examples/register-v2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Register</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../examples/lockscreen.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Lockscreen</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">DOCUMENTATIONS</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../docs/introduction.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-download"></i>
|
|
||||||
<p>Installation</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../docs/layout.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-grip-horizontal"></i>
|
|
||||||
<p>Layout</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../docs/color-mode.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-star-half"></i>
|
|
||||||
<p>Color Mode</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-ui-checks-grid"></i>
|
|
||||||
<p>
|
|
||||||
Components
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../docs/components/main-header.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Main Header</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../docs/components/main-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Main Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item menu-open">
|
|
||||||
<a href="#" class="nav-link active">
|
|
||||||
<i class="nav-icon bi bi-filetype-js"></i>
|
|
||||||
<p>
|
|
||||||
Javascript
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../docs/javascript/treeview.html" class="nav-link active">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Treeview</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../docs/browser-support.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-browser-edge"></i>
|
|
||||||
<p>Browser Support</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../docs/how-to-contribute.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-hand-thumbs-up-fill"></i>
|
|
||||||
<p>How To Contribute</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../docs/faq.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-question-circle-fill"></i>
|
|
||||||
<p>FAQ</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../../docs/license.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-patch-check-fill"></i>
|
|
||||||
<p>License</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">MULTI LEVEL EXAMPLE</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>Level 1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>
|
|
||||||
Level 1
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Level 2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>
|
|
||||||
Level 2
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Level 2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>Level 1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">LABELS</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-danger"></i>
|
|
||||||
<p class="text">Important</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-warning"></i>
|
|
||||||
<p>Warning</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-info"></i>
|
|
||||||
<p>Informational</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
<!--end::Sidebar Menu-->
|
|
||||||
</nav>
|
|
||||||
</div>
|
|
||||||
<!--end::Sidebar Wrapper-->
|
|
||||||
</aside>
|
|
||||||
<!--end::Sidebar-->
|
|
||||||
<!--begin::App Main-->
|
|
||||||
<main class="app-main">
|
|
||||||
<!--begin::App Content Header-->
|
|
||||||
<div class="app-content-header">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<!--begin::Row-->
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-sm-6"><h3 class="mb-0">Treeview Plugin</h3></div>
|
|
||||||
<div class="col-sm-6">
|
|
||||||
<ol class="breadcrumb float-sm-end">
|
|
||||||
<li class="breadcrumb-item"><a href="#">Docs</a></li>
|
|
||||||
<li class="breadcrumb-item active" aria-current="page">Treeview Plugin</li>
|
|
||||||
</ol>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Row-->
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Content Header-->
|
|
||||||
<!--begin::App Content-->
|
|
||||||
<div class="app-content">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<p>
|
|
||||||
The Treeview plugin converts a nested list into a tree view where sub menus can be
|
|
||||||
expanded.
|
|
||||||
</p>
|
|
||||||
<h5 id="usage">Usage</h5>
|
|
||||||
<p>This plugin can be used as the data api.</p>
|
|
||||||
<p><strong>Data API</strong></p>
|
|
||||||
<p>
|
|
||||||
Add <code>data-lte-toggle="treeview"</code> to any ul or ol element to
|
|
||||||
activate the plugin.
|
|
||||||
</p>
|
|
||||||
<pre
|
|
||||||
class="astro-code dark-plus"
|
|
||||||
style="background-color: #1e1e1e; color: #d4d4d4; overflow-x: auto"
|
|
||||||
tabindex="0"
|
|
||||||
data-language="html"
|
|
||||||
><code><span class="line"><span style="color:#808080"><</span><span style="color:#569CD6">ul</span><span style="color:#9CDCFE"> data-lte-toggle</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"treeview"</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">li</span><span style="color:#808080">><</span><span style="color:#569CD6">a</span><span style="color:#9CDCFE"> href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"#"</span><span style="color:#808080">></span><span style="color:#D4D4D4">One Level</span><span style="color:#808080"></</span><span style="color:#569CD6">a</span><span style="color:#808080">></</span><span style="color:#569CD6">li</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">li</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-item menu-open"</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">a</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-link"</span><span style="color:#9CDCFE"> href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"#"</span><span style="color:#808080">></span><span style="color:#D4D4D4">Multilevel</span><span style="color:#808080"></</span><span style="color:#569CD6">a</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">ul</span><span style="color:#9CDCFE"> class</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"nav-treeview"</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> <</span><span style="color:#569CD6">li</span><span style="color:#808080">><</span><span style="color:#569CD6">a</span><span style="color:#9CDCFE"> href</span><span style="color:#D4D4D4">=</span><span style="color:#CE9178">"#"</span><span style="color:#808080">></span><span style="color:#D4D4D4">Level 2</span><span style="color:#808080"></</span><span style="color:#569CD6">a</span><span style="color:#808080">></</span><span style="color:#569CD6">li</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">ul</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"> </</span><span style="color:#569CD6">li</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"><span style="color:#808080"></</span><span style="color:#569CD6">ul</span><span style="color:#808080">></span></span>
|
|
||||||
<span class="line"></span></code></pre>
|
|
||||||
<h5 id="example">Example</h5>
|
|
||||||
<ul data-lte-toggle="treeview">
|
|
||||||
<li><a href="#">One Level</a></li>
|
|
||||||
<li class="nav-item menu-open">
|
|
||||||
<a class="nav-link" href="#"><p>Multilevel</p></a>
|
|
||||||
<ul class="nav-treeview">
|
|
||||||
<li><a href="#">Level 2</a></li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Content-->
|
|
||||||
</main>
|
|
||||||
<!--end::App Main-->
|
|
||||||
<!--begin::Footer-->
|
|
||||||
<footer class="app-footer">
|
|
||||||
<!--begin::To the end-->
|
|
||||||
<div class="float-end d-none d-sm-inline">Anything you want</div>
|
|
||||||
<!--end::To the end-->
|
|
||||||
<!--begin::Copyright-->
|
|
||||||
<strong>
|
|
||||||
Copyright © 2014-2024
|
|
||||||
<a href="https://adminlte.io" class="text-decoration-none">AdminLTE.io</a>.
|
|
||||||
</strong>
|
|
||||||
All rights reserved.
|
|
||||||
<!--end::Copyright-->
|
|
||||||
</footer>
|
|
||||||
<!--end::Footer-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Wrapper-->
|
|
||||||
<!--begin::Script-->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/browser/overlayscrollbars.browser.es6.min.js"
|
|
||||||
integrity="sha256-dghWARbRe2eLlIJ56wNB+b760ywulqK3DzZYEpsg2fQ="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)--><!--begin::Required Plugin(popperjs for Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js"
|
|
||||||
integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(popperjs for Bootstrap 5)--><!--begin::Required Plugin(Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js"
|
|
||||||
integrity="sha384-0pUGZvbkm6XF6gxjEnlmuGrJXVbNuzT9qBBavbLwCsOGabYfZo0T0to5eqruptLy"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(Bootstrap 5)--><!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<script src="../../../../dist/js/adminlte.js"></script>
|
|
||||||
<!--end::Required Plugin(AdminLTE)--><!--begin::OverlayScrollbars Configure-->
|
|
||||||
<script>
|
|
||||||
const SELECTOR_SIDEBAR_WRAPPER = '.sidebar-wrapper';
|
|
||||||
const Default = {
|
|
||||||
scrollbarTheme: 'os-theme-light',
|
|
||||||
scrollbarAutoHide: 'leave',
|
|
||||||
scrollbarClickScroll: true,
|
|
||||||
};
|
|
||||||
document.addEventListener('DOMContentLoaded', function () {
|
|
||||||
const sidebarWrapper = document.querySelector(SELECTOR_SIDEBAR_WRAPPER);
|
|
||||||
if (sidebarWrapper && typeof OverlayScrollbarsGlobal?.OverlayScrollbars !== 'undefined') {
|
|
||||||
OverlayScrollbarsGlobal.OverlayScrollbars(sidebarWrapper, {
|
|
||||||
scrollbars: {
|
|
||||||
theme: Default.scrollbarTheme,
|
|
||||||
autoHide: Default.scrollbarAutoHide,
|
|
||||||
clickScroll: Default.scrollbarClickScroll,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<!--end::OverlayScrollbars Configure-->
|
|
||||||
<!--end::Script-->
|
|
||||||
</body>
|
|
||||||
<!--end::Body-->
|
|
||||||
</html>
|
|
@ -1,839 +0,0 @@
|
|||||||
<!doctype html>
|
|
||||||
<html lang="en">
|
|
||||||
<!--begin::Head-->
|
|
||||||
<head>
|
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
||||||
<title>Layout | AdminLTE 4</title>
|
|
||||||
<!--begin::Primary Meta Tags-->
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<meta name="title" content="Layout | AdminLTE 4" />
|
|
||||||
<meta name="author" content="ColorlibHQ" />
|
|
||||||
<meta
|
|
||||||
name="description"
|
|
||||||
content="AdminLTE is a Free Bootstrap 5 Admin Dashboard, 30 example pages using Vanilla JS."
|
|
||||||
/>
|
|
||||||
<meta
|
|
||||||
name="keywords"
|
|
||||||
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"
|
|
||||||
/>
|
|
||||||
<!--end::Primary Meta Tags-->
|
|
||||||
<!--begin::Fonts-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/@fontsource/source-sans-3@5.0.12/index.css"
|
|
||||||
integrity="sha256-tXJfXfp6Ewt1ilPzLDtQnJV4hclT9XuaZUKyUvmyr+Q="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Fonts-->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/styles/overlayscrollbars.min.css"
|
|
||||||
integrity="sha256-tZHrRjVqNSRyWg2wbppGnT833E/Ys0DHWGwT04GiqQg="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<!--begin::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"
|
|
||||||
integrity="sha256-9kPW/n5nn53j4WMRYAxe9c1rCY96Oogo/MKSVdKzPmI="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<link rel="stylesheet" href="../../../dist/css/adminlte.css" />
|
|
||||||
<!--end::Required Plugin(AdminLTE)-->
|
|
||||||
</head>
|
|
||||||
<!--end::Head-->
|
|
||||||
<!--begin::Body-->
|
|
||||||
<body class="layout-fixed sidebar-expand-lg bg-body-tertiary">
|
|
||||||
<!--begin::App Wrapper-->
|
|
||||||
<div class="app-wrapper">
|
|
||||||
<!--begin::Header-->
|
|
||||||
<nav class="app-header navbar navbar-expand bg-body">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<!--begin::Start Navbar Links-->
|
|
||||||
<ul class="navbar-nav">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" data-lte-toggle="sidebar" href="#" role="button">
|
|
||||||
<i class="bi bi-list"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item d-none d-md-block"><a href="#" class="nav-link">Home</a></li>
|
|
||||||
<li class="nav-item d-none d-md-block"><a href="#" class="nav-link">Contact</a></li>
|
|
||||||
</ul>
|
|
||||||
<!--end::Start Navbar Links-->
|
|
||||||
<!--begin::End Navbar Links-->
|
|
||||||
<ul class="navbar-nav ms-auto">
|
|
||||||
<!--begin::Navbar Search-->
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" data-widget="navbar-search" href="#" role="button">
|
|
||||||
<i class="bi bi-search"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Navbar Search-->
|
|
||||||
<!--begin::Messages Dropdown Menu-->
|
|
||||||
<li class="nav-item dropdown">
|
|
||||||
<a class="nav-link" data-bs-toggle="dropdown" href="#">
|
|
||||||
<i class="bi bi-chat-text"></i>
|
|
||||||
<span class="navbar-badge badge text-bg-danger">3</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user1-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
Brad Diesel
|
|
||||||
<span class="float-end fs-7 text-danger"
|
|
||||||
><i class="bi bi-star-fill"></i
|
|
||||||
></span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">Call me whenever you can...</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user8-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
John Pierce
|
|
||||||
<span class="float-end fs-7 text-secondary">
|
|
||||||
<i class="bi bi-star-fill"></i>
|
|
||||||
</span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">I got your message bro</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user3-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
Nora Silvester
|
|
||||||
<span class="float-end fs-7 text-warning">
|
|
||||||
<i class="bi bi-star-fill"></i>
|
|
||||||
</span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">The subject goes here</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item dropdown-footer">See All Messages</a>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<!--end::Messages Dropdown Menu-->
|
|
||||||
<!--begin::Notifications Dropdown Menu-->
|
|
||||||
<li class="nav-item dropdown">
|
|
||||||
<a class="nav-link" data-bs-toggle="dropdown" href="#">
|
|
||||||
<i class="bi bi-bell-fill"></i>
|
|
||||||
<span class="navbar-badge badge text-bg-warning">15</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<span class="dropdown-item dropdown-header">15 Notifications</span>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-envelope me-2"></i> 4 new messages
|
|
||||||
<span class="float-end text-secondary fs-7">3 mins</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-people-fill me-2"></i> 8 friend requests
|
|
||||||
<span class="float-end text-secondary fs-7">12 hours</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-file-earmark-fill me-2"></i> 3 new reports
|
|
||||||
<span class="float-end text-secondary fs-7">2 days</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item dropdown-footer"> See All Notifications </a>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<!--end::Notifications Dropdown Menu-->
|
|
||||||
<!--begin::Fullscreen Toggle-->
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" href="#" data-lte-toggle="fullscreen">
|
|
||||||
<i data-lte-icon="maximize" class="bi bi-arrows-fullscreen"></i>
|
|
||||||
<i data-lte-icon="minimize" class="bi bi-fullscreen-exit" style="display: none"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Fullscreen Toggle-->
|
|
||||||
<!--begin::User Menu Dropdown-->
|
|
||||||
<li class="nav-item dropdown user-menu">
|
|
||||||
<a href="#" class="nav-link dropdown-toggle" data-bs-toggle="dropdown">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user2-160x160.jpg"
|
|
||||||
class="user-image rounded-circle shadow"
|
|
||||||
alt="User Image"
|
|
||||||
/>
|
|
||||||
<span class="d-none d-md-inline">Alexander Pierce</span>
|
|
||||||
</a>
|
|
||||||
<ul class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<!--begin::User Image-->
|
|
||||||
<li class="user-header text-bg-primary">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user2-160x160.jpg"
|
|
||||||
class="rounded-circle shadow"
|
|
||||||
alt="User Image"
|
|
||||||
/>
|
|
||||||
<p>
|
|
||||||
Alexander Pierce - Web Developer
|
|
||||||
<small>Member since Nov. 2023</small>
|
|
||||||
</p>
|
|
||||||
</li>
|
|
||||||
<!--end::User Image-->
|
|
||||||
<!--begin::Menu Body-->
|
|
||||||
<li class="user-body">
|
|
||||||
<!--begin::Row-->
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-4 text-center"><a href="#">Followers</a></div>
|
|
||||||
<div class="col-4 text-center"><a href="#">Sales</a></div>
|
|
||||||
<div class="col-4 text-center"><a href="#">Friends</a></div>
|
|
||||||
</div>
|
|
||||||
<!--end::Row-->
|
|
||||||
</li>
|
|
||||||
<!--end::Menu Body-->
|
|
||||||
<!--begin::Menu Footer-->
|
|
||||||
<li class="user-footer">
|
|
||||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
|
||||||
<a href="#" class="btn btn-default btn-flat float-end">Sign out</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Menu Footer-->
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<!--end::User Menu Dropdown-->
|
|
||||||
</ul>
|
|
||||||
<!--end::End Navbar Links-->
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</nav>
|
|
||||||
<!--end::Header-->
|
|
||||||
<!--begin::Sidebar-->
|
|
||||||
<aside class="app-sidebar bg-body-secondary shadow" data-bs-theme="dark">
|
|
||||||
<!--begin::Sidebar Brand-->
|
|
||||||
<div class="sidebar-brand">
|
|
||||||
<!--begin::Brand Link-->
|
|
||||||
<a href="../index.html" class="brand-link">
|
|
||||||
<!--begin::Brand Image-->
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/AdminLTELogo.png"
|
|
||||||
alt="AdminLTE Logo"
|
|
||||||
class="brand-image opacity-75 shadow"
|
|
||||||
/>
|
|
||||||
<!--end::Brand Image-->
|
|
||||||
<!--begin::Brand Text-->
|
|
||||||
<span class="brand-text fw-light">AdminLTE 4</span>
|
|
||||||
<!--end::Brand Text-->
|
|
||||||
</a>
|
|
||||||
<!--end::Brand Link-->
|
|
||||||
</div>
|
|
||||||
<!--end::Sidebar Brand-->
|
|
||||||
<!--begin::Sidebar Wrapper-->
|
|
||||||
<div class="sidebar-wrapper">
|
|
||||||
<nav class="mt-2">
|
|
||||||
<!--begin::Sidebar Menu-->
|
|
||||||
<ul
|
|
||||||
class="nav sidebar-menu flex-column"
|
|
||||||
data-lte-toggle="treeview"
|
|
||||||
role="menu"
|
|
||||||
data-accordion="false"
|
|
||||||
>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-speedometer"></i>
|
|
||||||
<p>
|
|
||||||
Dashboard
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../index.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../index2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../index3.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../generate/theme.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-palette"></i>
|
|
||||||
<p>Theme Generate</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-seam-fill"></i>
|
|
||||||
<p>
|
|
||||||
Widgets
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../widgets/small-box.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Small Box</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../widgets/info-box.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>info Box</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../widgets/cards.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Cards</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-clipboard-fill"></i>
|
|
||||||
<p>
|
|
||||||
Layout Options
|
|
||||||
<span class="nav-badge badge text-bg-secondary me-3">6</span>
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/unfixed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Default Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/fixed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Fixed Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/layout-custom-area.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Layout <small>+ Custom Area </small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/sidebar-mini.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/collapsed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini <small>+ Collapsed</small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/logo-switch.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini <small>+ Logo Switch</small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/layout-rtl.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Layout RTL</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-tree-fill"></i>
|
|
||||||
<p>
|
|
||||||
UI Elements
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../UI/general.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>General</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../UI/icons.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Icons</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../UI/timeline.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Timeline</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-pencil-square"></i>
|
|
||||||
<p>
|
|
||||||
Forms
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../forms/general.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>General Elements</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-table"></i>
|
|
||||||
<p>
|
|
||||||
Tables
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../tables/simple.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Simple Tables</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">EXAMPLES</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Auth
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Version 1
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/login.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Login</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/register.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Register</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Version 2
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/login-v2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Login</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/register-v2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Register</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/lockscreen.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Lockscreen</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">DOCUMENTATIONS</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/introduction.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-download"></i>
|
|
||||||
<p>Installation</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/layout.html" class="nav-link active">
|
|
||||||
<i class="nav-icon bi bi-grip-horizontal"></i>
|
|
||||||
<p>Layout</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/color-mode.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-star-half"></i>
|
|
||||||
<p>Color Mode</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-ui-checks-grid"></i>
|
|
||||||
<p>
|
|
||||||
Components
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/components/main-header.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Main Header</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/components/main-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Main Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-filetype-js"></i>
|
|
||||||
<p>
|
|
||||||
Javascript
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/javascript/treeview.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Treeview</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/browser-support.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-browser-edge"></i>
|
|
||||||
<p>Browser Support</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/how-to-contribute.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-hand-thumbs-up-fill"></i>
|
|
||||||
<p>How To Contribute</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/faq.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-question-circle-fill"></i>
|
|
||||||
<p>FAQ</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/license.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-patch-check-fill"></i>
|
|
||||||
<p>License</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">MULTI LEVEL EXAMPLE</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>Level 1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>
|
|
||||||
Level 1
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Level 2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>
|
|
||||||
Level 2
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Level 2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>Level 1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">LABELS</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-danger"></i>
|
|
||||||
<p class="text">Important</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-warning"></i>
|
|
||||||
<p>Warning</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-info"></i>
|
|
||||||
<p>Informational</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
<!--end::Sidebar Menu-->
|
|
||||||
</nav>
|
|
||||||
</div>
|
|
||||||
<!--end::Sidebar Wrapper-->
|
|
||||||
</aside>
|
|
||||||
<!--end::Sidebar-->
|
|
||||||
<!--begin::App Main-->
|
|
||||||
<main class="app-main">
|
|
||||||
<!--begin::App Content Header-->
|
|
||||||
<div class="app-content-header">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<!--begin::Row-->
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-sm-6"><h3 class="mb-0">Layout</h3></div>
|
|
||||||
<div class="col-sm-6">
|
|
||||||
<ol class="breadcrumb float-sm-end">
|
|
||||||
<li class="breadcrumb-item"><a href="#">Docs</a></li>
|
|
||||||
<li class="breadcrumb-item active" aria-current="page">Layout</li>
|
|
||||||
</ol>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Row-->
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Content Header-->
|
|
||||||
<!--begin::App Content-->
|
|
||||||
<div class="app-content">
|
|
||||||
<div class="container-fluid">
|
|
||||||
<div class="callout callout-info mb-4">
|
|
||||||
<h5 class="fw-bold">Tips</h5>
|
|
||||||
<p>
|
|
||||||
The
|
|
||||||
<a
|
|
||||||
href="/starter.html"
|
|
||||||
target="_blank"
|
|
||||||
rel="noopener noreferrer"
|
|
||||||
class="callout-link"
|
|
||||||
>
|
|
||||||
starter page
|
|
||||||
</a>
|
|
||||||
is a good place to start building your app if you’d like to start from scratch.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<p>The layout consists of five major parts:</p>
|
|
||||||
<ul>
|
|
||||||
<li>Wrapper <code>.app-wrapper</code> . A div that wraps the whole site.</li>
|
|
||||||
<li>Main Header <code>.app-header</code> . Contains the logo and navbar.</li>
|
|
||||||
<li>
|
|
||||||
Main Sidebar <code>.app-sidebar</code> . Contains the sidebar user panel and menu.
|
|
||||||
</li>
|
|
||||||
<li>Content <code>.app-main</code> . Contains the page header and content.</li>
|
|
||||||
<li>Main Footer <code>.app-footer</code> . Contains the footer.</li>
|
|
||||||
</ul>
|
|
||||||
<h4>Layout Options</h4>
|
|
||||||
<p>
|
|
||||||
AdminLTE v4 provides a set of options to apply to your main layout. Each one of these
|
|
||||||
classes can be added to the
|
|
||||||
<code>body</code> tag to get the desired goal.
|
|
||||||
</p>
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
Fixed Sidebar: use the class <code>.layout-fixed</code> to get a fixed sidebar.
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
Mini Sidebar on Toggle: use the class
|
|
||||||
<code>.sidebar-expand-* .sidebar-mini</code>
|
|
||||||
to have a collapsed sidebar upon loading.
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
Collapsed Sidebar: use the class
|
|
||||||
<code>.sidebar-expand-* .sidebar-mini .sidebar-collapse</code> to have a collapsed
|
|
||||||
sidebar upon loading.
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<!-- /.container-fluid -->
|
|
||||||
</div>
|
|
||||||
<!--end::App Content-->
|
|
||||||
</main>
|
|
||||||
<!--end::App Main-->
|
|
||||||
<!--begin::Footer-->
|
|
||||||
<footer class="app-footer">
|
|
||||||
<!--begin::To the end-->
|
|
||||||
<div class="float-end d-none d-sm-inline">Anything you want</div>
|
|
||||||
<!--end::To the end-->
|
|
||||||
<!--begin::Copyright-->
|
|
||||||
<strong>
|
|
||||||
Copyright © 2014-2024
|
|
||||||
<a href="https://adminlte.io" class="text-decoration-none">AdminLTE.io</a>.
|
|
||||||
</strong>
|
|
||||||
All rights reserved.
|
|
||||||
<!--end::Copyright-->
|
|
||||||
</footer>
|
|
||||||
<!--end::Footer-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Wrapper-->
|
|
||||||
<!--begin::Script-->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/browser/overlayscrollbars.browser.es6.min.js"
|
|
||||||
integrity="sha256-dghWARbRe2eLlIJ56wNB+b760ywulqK3DzZYEpsg2fQ="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)--><!--begin::Required Plugin(popperjs for Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js"
|
|
||||||
integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(popperjs for Bootstrap 5)--><!--begin::Required Plugin(Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js"
|
|
||||||
integrity="sha384-0pUGZvbkm6XF6gxjEnlmuGrJXVbNuzT9qBBavbLwCsOGabYfZo0T0to5eqruptLy"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(Bootstrap 5)--><!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<script src="../../../dist/js/adminlte.js"></script>
|
|
||||||
<!--end::Required Plugin(AdminLTE)--><!--begin::OverlayScrollbars Configure-->
|
|
||||||
<script>
|
|
||||||
const SELECTOR_SIDEBAR_WRAPPER = '.sidebar-wrapper';
|
|
||||||
const Default = {
|
|
||||||
scrollbarTheme: 'os-theme-light',
|
|
||||||
scrollbarAutoHide: 'leave',
|
|
||||||
scrollbarClickScroll: true,
|
|
||||||
};
|
|
||||||
document.addEventListener('DOMContentLoaded', function () {
|
|
||||||
const sidebarWrapper = document.querySelector(SELECTOR_SIDEBAR_WRAPPER);
|
|
||||||
if (sidebarWrapper && typeof OverlayScrollbarsGlobal?.OverlayScrollbars !== 'undefined') {
|
|
||||||
OverlayScrollbarsGlobal.OverlayScrollbars(sidebarWrapper, {
|
|
||||||
scrollbars: {
|
|
||||||
theme: Default.scrollbarTheme,
|
|
||||||
autoHide: Default.scrollbarAutoHide,
|
|
||||||
clickScroll: Default.scrollbarClickScroll,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<!--end::OverlayScrollbars Configure-->
|
|
||||||
<!--end::Script-->
|
|
||||||
</body>
|
|
||||||
<!--end::Body-->
|
|
||||||
</html>
|
|
@ -1,830 +0,0 @@
|
|||||||
<!doctype html>
|
|
||||||
<html lang="en">
|
|
||||||
<!--begin::Head-->
|
|
||||||
<head>
|
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
||||||
<title>License | AdminLTE 4</title>
|
|
||||||
<!--begin::Primary Meta Tags-->
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<meta name="title" content="License | AdminLTE 4" />
|
|
||||||
<meta name="author" content="ColorlibHQ" />
|
|
||||||
<meta
|
|
||||||
name="description"
|
|
||||||
content="AdminLTE is a Free Bootstrap 5 Admin Dashboard, 30 example pages using Vanilla JS."
|
|
||||||
/>
|
|
||||||
<meta
|
|
||||||
name="keywords"
|
|
||||||
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"
|
|
||||||
/>
|
|
||||||
<!--end::Primary Meta Tags-->
|
|
||||||
<!--begin::Fonts-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/@fontsource/source-sans-3@5.0.12/index.css"
|
|
||||||
integrity="sha256-tXJfXfp6Ewt1ilPzLDtQnJV4hclT9XuaZUKyUvmyr+Q="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Fonts-->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/styles/overlayscrollbars.min.css"
|
|
||||||
integrity="sha256-tZHrRjVqNSRyWg2wbppGnT833E/Ys0DHWGwT04GiqQg="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<!--begin::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"
|
|
||||||
integrity="sha256-9kPW/n5nn53j4WMRYAxe9c1rCY96Oogo/MKSVdKzPmI="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<link rel="stylesheet" href="../../../dist/css/adminlte.css" />
|
|
||||||
<!--end::Required Plugin(AdminLTE)-->
|
|
||||||
<style>
|
|
||||||
[data-astro-image] {
|
|
||||||
width: 100%;
|
|
||||||
height: auto;
|
|
||||||
object-fit: var(--fit);
|
|
||||||
object-position: var(--pos);
|
|
||||||
aspect-ratio: var(--w) / var(--h);
|
|
||||||
}
|
|
||||||
[data-astro-image='responsive'] {
|
|
||||||
max-width: calc(var(--w) * 1px);
|
|
||||||
max-height: calc(var(--h) * 1px);
|
|
||||||
}
|
|
||||||
[data-astro-image='fixed'] {
|
|
||||||
width: calc(var(--w) * 1px);
|
|
||||||
height: calc(var(--h) * 1px);
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<!--end::Head-->
|
|
||||||
<!--begin::Body-->
|
|
||||||
<body class="layout-fixed sidebar-expand-lg bg-body-tertiary">
|
|
||||||
<!--begin::App Wrapper-->
|
|
||||||
<div class="app-wrapper">
|
|
||||||
<!--begin::Header-->
|
|
||||||
<nav class="app-header navbar navbar-expand bg-body">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<!--begin::Start Navbar Links-->
|
|
||||||
<ul class="navbar-nav">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" data-lte-toggle="sidebar" href="#" role="button">
|
|
||||||
<i class="bi bi-list"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item d-none d-md-block"><a href="#" class="nav-link">Home</a></li>
|
|
||||||
<li class="nav-item d-none d-md-block"><a href="#" class="nav-link">Contact</a></li>
|
|
||||||
</ul>
|
|
||||||
<!--end::Start Navbar Links-->
|
|
||||||
<!--begin::End Navbar Links-->
|
|
||||||
<ul class="navbar-nav ms-auto">
|
|
||||||
<!--begin::Navbar Search-->
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" data-widget="navbar-search" href="#" role="button">
|
|
||||||
<i class="bi bi-search"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Navbar Search-->
|
|
||||||
<!--begin::Messages Dropdown Menu-->
|
|
||||||
<li class="nav-item dropdown">
|
|
||||||
<a class="nav-link" data-bs-toggle="dropdown" href="#">
|
|
||||||
<i class="bi bi-chat-text"></i>
|
|
||||||
<span class="navbar-badge badge text-bg-danger">3</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user1-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
Brad Diesel
|
|
||||||
<span class="float-end fs-7 text-danger"
|
|
||||||
><i class="bi bi-star-fill"></i
|
|
||||||
></span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">Call me whenever you can...</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user8-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
John Pierce
|
|
||||||
<span class="float-end fs-7 text-secondary">
|
|
||||||
<i class="bi bi-star-fill"></i>
|
|
||||||
</span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">I got your message bro</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user3-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
Nora Silvester
|
|
||||||
<span class="float-end fs-7 text-warning">
|
|
||||||
<i class="bi bi-star-fill"></i>
|
|
||||||
</span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">The subject goes here</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item dropdown-footer">See All Messages</a>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<!--end::Messages Dropdown Menu-->
|
|
||||||
<!--begin::Notifications Dropdown Menu-->
|
|
||||||
<li class="nav-item dropdown">
|
|
||||||
<a class="nav-link" data-bs-toggle="dropdown" href="#">
|
|
||||||
<i class="bi bi-bell-fill"></i>
|
|
||||||
<span class="navbar-badge badge text-bg-warning">15</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<span class="dropdown-item dropdown-header">15 Notifications</span>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-envelope me-2"></i> 4 new messages
|
|
||||||
<span class="float-end text-secondary fs-7">3 mins</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-people-fill me-2"></i> 8 friend requests
|
|
||||||
<span class="float-end text-secondary fs-7">12 hours</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-file-earmark-fill me-2"></i> 3 new reports
|
|
||||||
<span class="float-end text-secondary fs-7">2 days</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item dropdown-footer"> See All Notifications </a>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<!--end::Notifications Dropdown Menu-->
|
|
||||||
<!--begin::Fullscreen Toggle-->
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" href="#" data-lte-toggle="fullscreen">
|
|
||||||
<i data-lte-icon="maximize" class="bi bi-arrows-fullscreen"></i>
|
|
||||||
<i data-lte-icon="minimize" class="bi bi-fullscreen-exit" style="display: none"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Fullscreen Toggle-->
|
|
||||||
<!--begin::User Menu Dropdown-->
|
|
||||||
<li class="nav-item dropdown user-menu">
|
|
||||||
<a href="#" class="nav-link dropdown-toggle" data-bs-toggle="dropdown">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user2-160x160.jpg"
|
|
||||||
class="user-image rounded-circle shadow"
|
|
||||||
alt="User Image"
|
|
||||||
/>
|
|
||||||
<span class="d-none d-md-inline">Alexander Pierce</span>
|
|
||||||
</a>
|
|
||||||
<ul class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<!--begin::User Image-->
|
|
||||||
<li class="user-header text-bg-primary">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user2-160x160.jpg"
|
|
||||||
class="rounded-circle shadow"
|
|
||||||
alt="User Image"
|
|
||||||
/>
|
|
||||||
<p>
|
|
||||||
Alexander Pierce - Web Developer
|
|
||||||
<small>Member since Nov. 2023</small>
|
|
||||||
</p>
|
|
||||||
</li>
|
|
||||||
<!--end::User Image-->
|
|
||||||
<!--begin::Menu Body-->
|
|
||||||
<li class="user-body">
|
|
||||||
<!--begin::Row-->
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-4 text-center"><a href="#">Followers</a></div>
|
|
||||||
<div class="col-4 text-center"><a href="#">Sales</a></div>
|
|
||||||
<div class="col-4 text-center"><a href="#">Friends</a></div>
|
|
||||||
</div>
|
|
||||||
<!--end::Row-->
|
|
||||||
</li>
|
|
||||||
<!--end::Menu Body-->
|
|
||||||
<!--begin::Menu Footer-->
|
|
||||||
<li class="user-footer">
|
|
||||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
|
||||||
<a href="#" class="btn btn-default btn-flat float-end">Sign out</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Menu Footer-->
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<!--end::User Menu Dropdown-->
|
|
||||||
</ul>
|
|
||||||
<!--end::End Navbar Links-->
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</nav>
|
|
||||||
<!--end::Header-->
|
|
||||||
<!--begin::Sidebar-->
|
|
||||||
<aside class="app-sidebar bg-body-secondary shadow" data-bs-theme="dark">
|
|
||||||
<!--begin::Sidebar Brand-->
|
|
||||||
<div class="sidebar-brand">
|
|
||||||
<!--begin::Brand Link-->
|
|
||||||
<a href="../index.html" class="brand-link">
|
|
||||||
<!--begin::Brand Image-->
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/AdminLTELogo.png"
|
|
||||||
alt="AdminLTE Logo"
|
|
||||||
class="brand-image opacity-75 shadow"
|
|
||||||
/>
|
|
||||||
<!--end::Brand Image-->
|
|
||||||
<!--begin::Brand Text-->
|
|
||||||
<span class="brand-text fw-light">AdminLTE 4</span>
|
|
||||||
<!--end::Brand Text-->
|
|
||||||
</a>
|
|
||||||
<!--end::Brand Link-->
|
|
||||||
</div>
|
|
||||||
<!--end::Sidebar Brand-->
|
|
||||||
<!--begin::Sidebar Wrapper-->
|
|
||||||
<div class="sidebar-wrapper">
|
|
||||||
<nav class="mt-2">
|
|
||||||
<!--begin::Sidebar Menu-->
|
|
||||||
<ul
|
|
||||||
class="nav sidebar-menu flex-column"
|
|
||||||
data-lte-toggle="treeview"
|
|
||||||
role="menu"
|
|
||||||
data-accordion="false"
|
|
||||||
>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-speedometer"></i>
|
|
||||||
<p>
|
|
||||||
Dashboard
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../index.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../index2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../index3.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Dashboard v3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../generate/theme.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-palette"></i>
|
|
||||||
<p>Theme Generate</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-seam-fill"></i>
|
|
||||||
<p>
|
|
||||||
Widgets
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../widgets/small-box.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Small Box</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../widgets/info-box.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>info Box</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../widgets/cards.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Cards</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-clipboard-fill"></i>
|
|
||||||
<p>
|
|
||||||
Layout Options
|
|
||||||
<span class="nav-badge badge text-bg-secondary me-3">6</span>
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/unfixed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Default Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/fixed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Fixed Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/layout-custom-area.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Layout <small>+ Custom Area </small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/sidebar-mini.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/collapsed-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini <small>+ Collapsed</small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/logo-switch.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Sidebar Mini <small>+ Logo Switch</small></p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../layout/layout-rtl.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Layout RTL</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-tree-fill"></i>
|
|
||||||
<p>
|
|
||||||
UI Elements
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../UI/general.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>General</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../UI/icons.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Icons</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../UI/timeline.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Timeline</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-pencil-square"></i>
|
|
||||||
<p>
|
|
||||||
Forms
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../forms/general.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>General Elements</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-table"></i>
|
|
||||||
<p>
|
|
||||||
Tables
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../tables/simple.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Simple Tables</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">EXAMPLES</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Auth
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Version 1
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/login.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Login</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/register.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Register</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-box-arrow-in-right"></i>
|
|
||||||
<p>
|
|
||||||
Version 2
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/login-v2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Login</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/register-v2.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Register</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../examples/lockscreen.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Lockscreen</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">DOCUMENTATIONS</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/introduction.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-download"></i>
|
|
||||||
<p>Installation</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/layout.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-grip-horizontal"></i>
|
|
||||||
<p>Layout</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/color-mode.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-star-half"></i>
|
|
||||||
<p>Color Mode</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-ui-checks-grid"></i>
|
|
||||||
<p>
|
|
||||||
Components
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/components/main-header.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Main Header</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/components/main-sidebar.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Main Sidebar</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-filetype-js"></i>
|
|
||||||
<p>
|
|
||||||
Javascript
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/javascript/treeview.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Treeview</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/browser-support.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-browser-edge"></i>
|
|
||||||
<p>Browser Support</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/how-to-contribute.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-hand-thumbs-up-fill"></i>
|
|
||||||
<p>How To Contribute</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/faq.html" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-question-circle-fill"></i>
|
|
||||||
<p>FAQ</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="../docs/license.html" class="nav-link active">
|
|
||||||
<i class="nav-icon bi bi-patch-check-fill"></i>
|
|
||||||
<p>License</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">MULTI LEVEL EXAMPLE</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>Level 1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>
|
|
||||||
Level 1
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Level 2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>
|
|
||||||
Level 2
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Level 2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>Level 1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-header">LABELS</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-danger"></i>
|
|
||||||
<p class="text">Important</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-warning"></i>
|
|
||||||
<p>Warning</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle text-info"></i>
|
|
||||||
<p>Informational</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
<!--end::Sidebar Menu-->
|
|
||||||
</nav>
|
|
||||||
</div>
|
|
||||||
<!--end::Sidebar Wrapper-->
|
|
||||||
</aside>
|
|
||||||
<!--end::Sidebar-->
|
|
||||||
<!--begin::App Main-->
|
|
||||||
<main class="app-main">
|
|
||||||
<!--begin::App Content Header-->
|
|
||||||
<div class="app-content-header">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<!--begin::Row-->
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-sm-6"><h3 class="mb-0">License</h3></div>
|
|
||||||
<div class="col-sm-6">
|
|
||||||
<ol class="breadcrumb float-sm-end">
|
|
||||||
<li class="breadcrumb-item"><a href="#">Docs</a></li>
|
|
||||||
<li class="breadcrumb-item active" aria-current="page">License</li>
|
|
||||||
</ol>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Row-->
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Content Header-->
|
|
||||||
<!--begin::App Content-->
|
|
||||||
<div class="app-content">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<p>
|
|
||||||
AdminLTE is an open source project that is licensed under the
|
|
||||||
<a href="https://opensource.org/licenses/MIT">MIT license</a>. This allows you to do
|
|
||||||
pretty much anything you want as long as you include the copyright in “all copies or
|
|
||||||
substantial portions of the Software.” Attribution is not required (though very much
|
|
||||||
appreciated).
|
|
||||||
</p>
|
|
||||||
<h5 class="text-bold text-dark mt-3">
|
|
||||||
What You Are <span class="text-success">Allowed</span> To Do With AdminLTE
|
|
||||||
</h5>
|
|
||||||
<ul>
|
|
||||||
<li>Use in commercial projects.</li>
|
|
||||||
<li>Use in personal/private projects.</li>
|
|
||||||
<li>Modify and change the work.</li>
|
|
||||||
<li>Distribute the code.</li>
|
|
||||||
<li>
|
|
||||||
Sublicense: incorporate the work into something that has a more restrictive license.
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Content-->
|
|
||||||
</main>
|
|
||||||
<!--end::App Main-->
|
|
||||||
<!--begin::Footer-->
|
|
||||||
<footer class="app-footer">
|
|
||||||
<!--begin::To the end-->
|
|
||||||
<div class="float-end d-none d-sm-inline">Anything you want</div>
|
|
||||||
<!--end::To the end-->
|
|
||||||
<!--begin::Copyright-->
|
|
||||||
<strong>
|
|
||||||
Copyright © 2014-2024
|
|
||||||
<a href="https://adminlte.io" class="text-decoration-none">AdminLTE.io</a>.
|
|
||||||
</strong>
|
|
||||||
All rights reserved.
|
|
||||||
<!--end::Copyright-->
|
|
||||||
</footer>
|
|
||||||
<!--end::Footer-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Wrapper-->
|
|
||||||
<!--begin::Script-->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/browser/overlayscrollbars.browser.es6.min.js"
|
|
||||||
integrity="sha256-dghWARbRe2eLlIJ56wNB+b760ywulqK3DzZYEpsg2fQ="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)--><!--begin::Required Plugin(popperjs for Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js"
|
|
||||||
integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(popperjs for Bootstrap 5)--><!--begin::Required Plugin(Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js"
|
|
||||||
integrity="sha384-0pUGZvbkm6XF6gxjEnlmuGrJXVbNuzT9qBBavbLwCsOGabYfZo0T0to5eqruptLy"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(Bootstrap 5)--><!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<script src="../../../dist/js/adminlte.js"></script>
|
|
||||||
<!--end::Required Plugin(AdminLTE)--><!--begin::OverlayScrollbars Configure-->
|
|
||||||
<script>
|
|
||||||
const SELECTOR_SIDEBAR_WRAPPER = '.sidebar-wrapper';
|
|
||||||
const Default = {
|
|
||||||
scrollbarTheme: 'os-theme-light',
|
|
||||||
scrollbarAutoHide: 'leave',
|
|
||||||
scrollbarClickScroll: true,
|
|
||||||
};
|
|
||||||
document.addEventListener('DOMContentLoaded', function () {
|
|
||||||
const sidebarWrapper = document.querySelector(SELECTOR_SIDEBAR_WRAPPER);
|
|
||||||
if (sidebarWrapper && typeof OverlayScrollbarsGlobal?.OverlayScrollbars !== 'undefined') {
|
|
||||||
OverlayScrollbarsGlobal.OverlayScrollbars(sidebarWrapper, {
|
|
||||||
scrollbars: {
|
|
||||||
theme: Default.scrollbarTheme,
|
|
||||||
autoHide: Default.scrollbarAutoHide,
|
|
||||||
clickScroll: Default.scrollbarClickScroll,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<!--end::OverlayScrollbars Configure-->
|
|
||||||
<!--end::Script-->
|
|
||||||
</body>
|
|
||||||
<!--end::Body-->
|
|
||||||
</html>
|
|
@ -1,132 +0,0 @@
|
|||||||
<!doctype html>
|
|
||||||
<html lang="en">
|
|
||||||
<!--begin::Head-->
|
|
||||||
<head>
|
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
||||||
<title>AdminLTE 4 | Lockscreen</title>
|
|
||||||
<!--begin::Primary Meta Tags-->
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<meta name="title" content="AdminLTE 4 | Lockscreen" />
|
|
||||||
<meta name="author" content="ColorlibHQ" />
|
|
||||||
<meta
|
|
||||||
name="description"
|
|
||||||
content="AdminLTE is a Free Bootstrap 5 Admin Dashboard, 30 example pages using Vanilla JS."
|
|
||||||
/>
|
|
||||||
<meta
|
|
||||||
name="keywords"
|
|
||||||
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"
|
|
||||||
/>
|
|
||||||
<!--end::Primary Meta Tags-->
|
|
||||||
<!--begin::Fonts-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/@fontsource/source-sans-3@5.0.12/index.css"
|
|
||||||
integrity="sha256-tXJfXfp6Ewt1ilPzLDtQnJV4hclT9XuaZUKyUvmyr+Q="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Fonts-->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/styles/overlayscrollbars.min.css"
|
|
||||||
integrity="sha256-tZHrRjVqNSRyWg2wbppGnT833E/Ys0DHWGwT04GiqQg="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<!--begin::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"
|
|
||||||
integrity="sha256-9kPW/n5nn53j4WMRYAxe9c1rCY96Oogo/MKSVdKzPmI="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<link rel="stylesheet" href="../../../dist/css/adminlte.css" />
|
|
||||||
<!--end::Required Plugin(AdminLTE)-->
|
|
||||||
</head>
|
|
||||||
<!--end::Head-->
|
|
||||||
<!--begin::Body-->
|
|
||||||
<body class="lockscreen bg-body-secondary">
|
|
||||||
<div class="lockscreen-wrapper">
|
|
||||||
<div class="lockscreen-logo">
|
|
||||||
<a href="../index2.html"><b>Admin</b>LTE</a>
|
|
||||||
</div>
|
|
||||||
<div class="lockscreen-name">John Doe</div>
|
|
||||||
<div class="lockscreen-item">
|
|
||||||
<div class="lockscreen-image">
|
|
||||||
<img src="../../../dist/assets/img/user1-128x128.jpg" alt="User Image" />
|
|
||||||
</div>
|
|
||||||
<form class="lockscreen-credentials">
|
|
||||||
<div class="input-group">
|
|
||||||
<input type="password" class="form-control shadow-none" placeholder="password" />
|
|
||||||
<div class="input-group-text border-0 bg-transparent px-1">
|
|
||||||
<button type="button" class="btn shadow-none">
|
|
||||||
<i class="bi bi-box-arrow-right text-body-secondary"></i>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
<div class="help-block text-center">Enter your password to retrieve your session</div>
|
|
||||||
<div class="text-center">
|
|
||||||
<a href="login.html" class="text-decoration-none">Or sign in as a different user</a>
|
|
||||||
</div>
|
|
||||||
<div class="lockscreen-footer text-center">
|
|
||||||
Copyright © 2014-2024
|
|
||||||
<b
|
|
||||||
><a
|
|
||||||
href="https://adminlte.io"
|
|
||||||
class="link-primary link-offset-2 link-underline-opacity-25 link-underline-opacity-100-hover"
|
|
||||||
>AdminLTE.io</a
|
|
||||||
></b
|
|
||||||
>
|
|
||||||
<br />
|
|
||||||
All rights reserved
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/browser/overlayscrollbars.browser.es6.min.js"
|
|
||||||
integrity="sha256-dghWARbRe2eLlIJ56wNB+b760ywulqK3DzZYEpsg2fQ="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)--><!--begin::Required Plugin(popperjs for Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js"
|
|
||||||
integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(popperjs for Bootstrap 5)--><!--begin::Required Plugin(Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js"
|
|
||||||
integrity="sha384-0pUGZvbkm6XF6gxjEnlmuGrJXVbNuzT9qBBavbLwCsOGabYfZo0T0to5eqruptLy"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(Bootstrap 5)--><!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<script src="undefined/js/adminlte.js"></script>
|
|
||||||
<!--end::Required Plugin(AdminLTE)--><!--begin::OverlayScrollbars Configure-->
|
|
||||||
<script>
|
|
||||||
const SELECTOR_SIDEBAR_WRAPPER = '.sidebar-wrapper';
|
|
||||||
const Default = {
|
|
||||||
scrollbarTheme: 'os-theme-light',
|
|
||||||
scrollbarAutoHide: 'leave',
|
|
||||||
scrollbarClickScroll: true,
|
|
||||||
};
|
|
||||||
document.addEventListener('DOMContentLoaded', function () {
|
|
||||||
const sidebarWrapper = document.querySelector(SELECTOR_SIDEBAR_WRAPPER);
|
|
||||||
if (sidebarWrapper && typeof OverlayScrollbarsGlobal?.OverlayScrollbars !== 'undefined') {
|
|
||||||
OverlayScrollbarsGlobal.OverlayScrollbars(sidebarWrapper, {
|
|
||||||
scrollbars: {
|
|
||||||
theme: Default.scrollbarTheme,
|
|
||||||
autoHide: Default.scrollbarAutoHide,
|
|
||||||
clickScroll: Default.scrollbarClickScroll,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<!--end::OverlayScrollbars Configure-->
|
|
||||||
</body>
|
|
||||||
<!--end::Body-->
|
|
||||||
</html>
|
|
@ -1,160 +0,0 @@
|
|||||||
<!doctype html>
|
|
||||||
<html lang="en">
|
|
||||||
<!--begin::Head-->
|
|
||||||
<head>
|
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
||||||
<title>AdminLTE 4 | Login Page v2</title>
|
|
||||||
<!--begin::Primary Meta Tags-->
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<meta name="title" content="AdminLTE 4 | Login Page v2" />
|
|
||||||
<meta name="author" content="ColorlibHQ" />
|
|
||||||
<meta
|
|
||||||
name="description"
|
|
||||||
content="AdminLTE is a Free Bootstrap 5 Admin Dashboard, 30 example pages using Vanilla JS."
|
|
||||||
/>
|
|
||||||
<meta
|
|
||||||
name="keywords"
|
|
||||||
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"
|
|
||||||
/>
|
|
||||||
<!--end::Primary Meta Tags-->
|
|
||||||
<!--begin::Fonts-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/@fontsource/source-sans-3@5.0.12/index.css"
|
|
||||||
integrity="sha256-tXJfXfp6Ewt1ilPzLDtQnJV4hclT9XuaZUKyUvmyr+Q="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Fonts-->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/styles/overlayscrollbars.min.css"
|
|
||||||
integrity="sha256-tZHrRjVqNSRyWg2wbppGnT833E/Ys0DHWGwT04GiqQg="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<!--begin::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"
|
|
||||||
integrity="sha256-9kPW/n5nn53j4WMRYAxe9c1rCY96Oogo/MKSVdKzPmI="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<link rel="stylesheet" href="../../../dist/css/adminlte.css" />
|
|
||||||
<!--end::Required Plugin(AdminLTE)-->
|
|
||||||
</head>
|
|
||||||
<!--end::Head-->
|
|
||||||
<!--begin::Body-->
|
|
||||||
<body class="login-page bg-body-secondary">
|
|
||||||
<div class="login-box">
|
|
||||||
<div class="card card-outline card-primary">
|
|
||||||
<div class="card-header">
|
|
||||||
<a
|
|
||||||
href="../index2.html"
|
|
||||||
class="link-dark text-center link-offset-2 link-opacity-100 link-opacity-50-hover"
|
|
||||||
>
|
|
||||||
<h1 class="mb-0"><b>Admin</b>LTE</h1>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
<div class="card-body login-card-body">
|
|
||||||
<p class="login-box-msg">Sign in to start your session</p>
|
|
||||||
<form action="../index3.html" method="post">
|
|
||||||
<div class="input-group mb-1">
|
|
||||||
<div class="form-floating">
|
|
||||||
<input id="loginEmail" type="email" class="form-control" value="" placeholder="" />
|
|
||||||
<label for="loginEmail">Email</label>
|
|
||||||
</div>
|
|
||||||
<div class="input-group-text"><span class="bi bi-envelope"></span></div>
|
|
||||||
</div>
|
|
||||||
<div class="input-group mb-1">
|
|
||||||
<div class="form-floating">
|
|
||||||
<input id="loginPassword" type="password" class="form-control" placeholder="" />
|
|
||||||
<label for="loginPassword">Password</label>
|
|
||||||
</div>
|
|
||||||
<div class="input-group-text"><span class="bi bi-lock-fill"></span></div>
|
|
||||||
</div>
|
|
||||||
<!--begin::Row-->
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-8 d-inline-flex align-items-center">
|
|
||||||
<div class="form-check">
|
|
||||||
<input class="form-check-input" type="checkbox" value="" id="flexCheckDefault" />
|
|
||||||
<label class="form-check-label" for="flexCheckDefault"> Remember Me </label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- /.col -->
|
|
||||||
<div class="col-4">
|
|
||||||
<div class="d-grid gap-2">
|
|
||||||
<button type="submit" class="btn btn-primary">Sign In</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- /.col -->
|
|
||||||
</div>
|
|
||||||
<!--end::Row-->
|
|
||||||
</form>
|
|
||||||
<div class="social-auth-links text-center mb-3 d-grid gap-2">
|
|
||||||
<p>- OR -</p>
|
|
||||||
<a href="#" class="btn btn-primary">
|
|
||||||
<i class="bi bi-facebook me-2"></i> Sign in using Facebook
|
|
||||||
</a>
|
|
||||||
<a href="#" class="btn btn-danger">
|
|
||||||
<i class="bi bi-google me-2"></i> Sign in using Google+
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
<!-- /.social-auth-links -->
|
|
||||||
<p class="mb-1"><a href="forgot-password.html">I forgot my password</a></p>
|
|
||||||
<p class="mb-0">
|
|
||||||
<a href="register.html" class="text-center"> Register a new membership </a>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<!-- /.login-card-body -->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- /.login-box -->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/browser/overlayscrollbars.browser.es6.min.js"
|
|
||||||
integrity="sha256-dghWARbRe2eLlIJ56wNB+b760ywulqK3DzZYEpsg2fQ="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)--><!--begin::Required Plugin(popperjs for Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js"
|
|
||||||
integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(popperjs for Bootstrap 5)--><!--begin::Required Plugin(Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js"
|
|
||||||
integrity="sha384-0pUGZvbkm6XF6gxjEnlmuGrJXVbNuzT9qBBavbLwCsOGabYfZo0T0to5eqruptLy"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(Bootstrap 5)--><!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<script src="../../../dist/js/adminlte.js"></script>
|
|
||||||
<!--end::Required Plugin(AdminLTE)--><!--begin::OverlayScrollbars Configure-->
|
|
||||||
<script>
|
|
||||||
const SELECTOR_SIDEBAR_WRAPPER = '.sidebar-wrapper';
|
|
||||||
const Default = {
|
|
||||||
scrollbarTheme: 'os-theme-light',
|
|
||||||
scrollbarAutoHide: 'leave',
|
|
||||||
scrollbarClickScroll: true,
|
|
||||||
};
|
|
||||||
document.addEventListener('DOMContentLoaded', function () {
|
|
||||||
const sidebarWrapper = document.querySelector(SELECTOR_SIDEBAR_WRAPPER);
|
|
||||||
if (sidebarWrapper && typeof OverlayScrollbarsGlobal?.OverlayScrollbars !== 'undefined') {
|
|
||||||
OverlayScrollbarsGlobal.OverlayScrollbars(sidebarWrapper, {
|
|
||||||
scrollbars: {
|
|
||||||
theme: Default.scrollbarTheme,
|
|
||||||
autoHide: Default.scrollbarAutoHide,
|
|
||||||
clickScroll: Default.scrollbarClickScroll,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<!--end::OverlayScrollbars Configure-->
|
|
||||||
<!--end::Script-->
|
|
||||||
</body>
|
|
||||||
<!--end::Body-->
|
|
||||||
</html>
|
|
@ -1,150 +0,0 @@
|
|||||||
<!doctype html>
|
|
||||||
<html lang="en">
|
|
||||||
<!--begin::Head-->
|
|
||||||
<head>
|
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
||||||
<title>AdminLTE 4 | Login Page</title>
|
|
||||||
<!--begin::Primary Meta Tags-->
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<meta name="title" content="AdminLTE 4 | Login Page" />
|
|
||||||
<meta name="author" content="ColorlibHQ" />
|
|
||||||
<meta
|
|
||||||
name="description"
|
|
||||||
content="AdminLTE is a Free Bootstrap 5 Admin Dashboard, 30 example pages using Vanilla JS."
|
|
||||||
/>
|
|
||||||
<meta
|
|
||||||
name="keywords"
|
|
||||||
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"
|
|
||||||
/>
|
|
||||||
<!--end::Primary Meta Tags-->
|
|
||||||
<!--begin::Fonts-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/@fontsource/source-sans-3@5.0.12/index.css"
|
|
||||||
integrity="sha256-tXJfXfp6Ewt1ilPzLDtQnJV4hclT9XuaZUKyUvmyr+Q="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Fonts-->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/styles/overlayscrollbars.min.css"
|
|
||||||
integrity="sha256-tZHrRjVqNSRyWg2wbppGnT833E/Ys0DHWGwT04GiqQg="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<!--begin::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"
|
|
||||||
integrity="sha256-9kPW/n5nn53j4WMRYAxe9c1rCY96Oogo/MKSVdKzPmI="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<link rel="stylesheet" href="../../../dist/css/adminlte.css" />
|
|
||||||
<!--end::Required Plugin(AdminLTE)-->
|
|
||||||
</head>
|
|
||||||
<!--end::Head-->
|
|
||||||
<!--begin::Body-->
|
|
||||||
<body class="login-page bg-body-secondary">
|
|
||||||
<div class="login-box">
|
|
||||||
<div class="login-logo">
|
|
||||||
<a href="../index2.html"><b>Admin</b>LTE</a>
|
|
||||||
</div>
|
|
||||||
<!-- /.login-logo -->
|
|
||||||
<div class="card">
|
|
||||||
<div class="card-body login-card-body">
|
|
||||||
<p class="login-box-msg">Sign in to start your session</p>
|
|
||||||
<form action="../index3.html" method="post">
|
|
||||||
<div class="input-group mb-3">
|
|
||||||
<input type="email" class="form-control" placeholder="Email" />
|
|
||||||
<div class="input-group-text"><span class="bi bi-envelope"></span></div>
|
|
||||||
</div>
|
|
||||||
<div class="input-group mb-3">
|
|
||||||
<input type="password" class="form-control" placeholder="Password" />
|
|
||||||
<div class="input-group-text"><span class="bi bi-lock-fill"></span></div>
|
|
||||||
</div>
|
|
||||||
<!--begin::Row-->
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-8">
|
|
||||||
<div class="form-check">
|
|
||||||
<input class="form-check-input" type="checkbox" value="" id="flexCheckDefault" />
|
|
||||||
<label class="form-check-label" for="flexCheckDefault"> Remember Me </label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- /.col -->
|
|
||||||
<div class="col-4">
|
|
||||||
<div class="d-grid gap-2">
|
|
||||||
<button type="submit" class="btn btn-primary">Sign In</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- /.col -->
|
|
||||||
</div>
|
|
||||||
<!--end::Row-->
|
|
||||||
</form>
|
|
||||||
<div class="social-auth-links text-center mb-3 d-grid gap-2">
|
|
||||||
<p>- OR -</p>
|
|
||||||
<a href="#" class="btn btn-primary">
|
|
||||||
<i class="bi bi-facebook me-2"></i> Sign in using Facebook
|
|
||||||
</a>
|
|
||||||
<a href="#" class="btn btn-danger">
|
|
||||||
<i class="bi bi-google me-2"></i> Sign in using Google+
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
<!-- /.social-auth-links -->
|
|
||||||
<p class="mb-1"><a href="forgot-password.html">I forgot my password</a></p>
|
|
||||||
<p class="mb-0">
|
|
||||||
<a href="register.html" class="text-center"> Register a new membership </a>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<!-- /.login-card-body -->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- /.login-box -->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/browser/overlayscrollbars.browser.es6.min.js"
|
|
||||||
integrity="sha256-dghWARbRe2eLlIJ56wNB+b760ywulqK3DzZYEpsg2fQ="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)--><!--begin::Required Plugin(popperjs for Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js"
|
|
||||||
integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(popperjs for Bootstrap 5)--><!--begin::Required Plugin(Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js"
|
|
||||||
integrity="sha384-0pUGZvbkm6XF6gxjEnlmuGrJXVbNuzT9qBBavbLwCsOGabYfZo0T0to5eqruptLy"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(Bootstrap 5)--><!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<script src="../../../dist/js/adminlte.js"></script>
|
|
||||||
<!--end::Required Plugin(AdminLTE)--><!--begin::OverlayScrollbars Configure-->
|
|
||||||
<script>
|
|
||||||
const SELECTOR_SIDEBAR_WRAPPER = '.sidebar-wrapper';
|
|
||||||
const Default = {
|
|
||||||
scrollbarTheme: 'os-theme-light',
|
|
||||||
scrollbarAutoHide: 'leave',
|
|
||||||
scrollbarClickScroll: true,
|
|
||||||
};
|
|
||||||
document.addEventListener('DOMContentLoaded', function () {
|
|
||||||
const sidebarWrapper = document.querySelector(SELECTOR_SIDEBAR_WRAPPER);
|
|
||||||
if (sidebarWrapper && typeof OverlayScrollbarsGlobal?.OverlayScrollbars !== 'undefined') {
|
|
||||||
OverlayScrollbarsGlobal.OverlayScrollbars(sidebarWrapper, {
|
|
||||||
scrollbars: {
|
|
||||||
theme: Default.scrollbarTheme,
|
|
||||||
autoHide: Default.scrollbarAutoHide,
|
|
||||||
clickScroll: Default.scrollbarClickScroll,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<!--end::OverlayScrollbars Configure-->
|
|
||||||
<!--end::Script-->
|
|
||||||
</body>
|
|
||||||
<!--end::Body-->
|
|
||||||
</html>
|
|
@ -1,169 +0,0 @@
|
|||||||
<!doctype html>
|
|
||||||
<html lang="en">
|
|
||||||
<!--begin::Head-->
|
|
||||||
<head>
|
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
||||||
<title>AdminLTE 4 | Register Page v2</title>
|
|
||||||
<!--begin::Primary Meta Tags-->
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<meta name="title" content="AdminLTE 4 | Register Page v2" />
|
|
||||||
<meta name="author" content="ColorlibHQ" />
|
|
||||||
<meta
|
|
||||||
name="description"
|
|
||||||
content="AdminLTE is a Free Bootstrap 5 Admin Dashboard, 30 example pages using Vanilla JS."
|
|
||||||
/>
|
|
||||||
<meta
|
|
||||||
name="keywords"
|
|
||||||
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"
|
|
||||||
/>
|
|
||||||
<!--end::Primary Meta Tags-->
|
|
||||||
<!--begin::Fonts-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/@fontsource/source-sans-3@5.0.12/index.css"
|
|
||||||
integrity="sha256-tXJfXfp6Ewt1ilPzLDtQnJV4hclT9XuaZUKyUvmyr+Q="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Fonts-->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/styles/overlayscrollbars.min.css"
|
|
||||||
integrity="sha256-tZHrRjVqNSRyWg2wbppGnT833E/Ys0DHWGwT04GiqQg="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<!--begin::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"
|
|
||||||
integrity="sha256-9kPW/n5nn53j4WMRYAxe9c1rCY96Oogo/MKSVdKzPmI="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<link rel="stylesheet" href="../../../dist/css/adminlte.css" />
|
|
||||||
<!--end::Required Plugin(AdminLTE)-->
|
|
||||||
</head>
|
|
||||||
<!--end::Head-->
|
|
||||||
<!--begin::Body-->
|
|
||||||
<body class="register-page bg-body-secondary">
|
|
||||||
<div class="register-box">
|
|
||||||
<!-- /.register-logo -->
|
|
||||||
<div class="card card-outline card-primary">
|
|
||||||
<div class="card-header">
|
|
||||||
<a
|
|
||||||
href="../index2.html"
|
|
||||||
class="link-dark text-center link-offset-2 link-opacity-100 link-opacity-50-hover"
|
|
||||||
>
|
|
||||||
<h1 class="mb-0"><b>Admin</b>LTE</h1>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
<div class="card-body register-card-body">
|
|
||||||
<p class="register-box-msg">Register a new membership</p>
|
|
||||||
<form action="../index3.html" method="post">
|
|
||||||
<div class="input-group mb-1">
|
|
||||||
<div class="form-floating">
|
|
||||||
<input id="registerFullName" type="text" class="form-control" placeholder="" />
|
|
||||||
<label for="registerFullName">Full Name</label>
|
|
||||||
</div>
|
|
||||||
<div class="input-group-text"><span class="bi bi-person"></span></div>
|
|
||||||
</div>
|
|
||||||
<div class="input-group mb-1">
|
|
||||||
<div class="form-floating">
|
|
||||||
<input id="registerEmail" type="email" class="form-control" placeholder="" />
|
|
||||||
<label for="registerEmail">Email</label>
|
|
||||||
</div>
|
|
||||||
<div class="input-group-text"><span class="bi bi-envelope"></span></div>
|
|
||||||
</div>
|
|
||||||
<div class="input-group mb-1">
|
|
||||||
<div class="form-floating">
|
|
||||||
<input id="registerPassword" type="password" class="form-control" placeholder="" />
|
|
||||||
<label for="registerPassword">Password</label>
|
|
||||||
</div>
|
|
||||||
<div class="input-group-text"><span class="bi bi-lock-fill"></span></div>
|
|
||||||
</div>
|
|
||||||
<!--begin::Row-->
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-8 d-inline-flex align-items-center">
|
|
||||||
<div class="form-check">
|
|
||||||
<input class="form-check-input" type="checkbox" value="" id="flexCheckDefault" />
|
|
||||||
<label class="form-check-label" for="flexCheckDefault">
|
|
||||||
I agree to the <a href="#">terms</a>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- /.col -->
|
|
||||||
<div class="col-4">
|
|
||||||
<div class="d-grid gap-2">
|
|
||||||
<button type="submit" class="btn btn-primary">Sign In</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- /.col -->
|
|
||||||
</div>
|
|
||||||
<!--end::Row-->
|
|
||||||
</form>
|
|
||||||
<div class="social-auth-links text-center mb-3 d-grid gap-2">
|
|
||||||
<p>- OR -</p>
|
|
||||||
<a href="#" class="btn btn-primary">
|
|
||||||
<i class="bi bi-facebook me-2"></i> Sign in using Facebook
|
|
||||||
</a>
|
|
||||||
<a href="#" class="btn btn-danger">
|
|
||||||
<i class="bi bi-google me-2"></i> Sign in using Google+
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
<!-- /.social-auth-links -->
|
|
||||||
<p class="mb-0">
|
|
||||||
<a href="login.html" class="link-primary text-center"> I already have a membership </a>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<!-- /.register-card-body -->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- /.register-box -->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/browser/overlayscrollbars.browser.es6.min.js"
|
|
||||||
integrity="sha256-dghWARbRe2eLlIJ56wNB+b760ywulqK3DzZYEpsg2fQ="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)--><!--begin::Required Plugin(popperjs for Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js"
|
|
||||||
integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(popperjs for Bootstrap 5)--><!--begin::Required Plugin(Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js"
|
|
||||||
integrity="sha384-0pUGZvbkm6XF6gxjEnlmuGrJXVbNuzT9qBBavbLwCsOGabYfZo0T0to5eqruptLy"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(Bootstrap 5)--><!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<script src="../../../dist/js/adminlte.js"></script>
|
|
||||||
<!--end::Required Plugin(AdminLTE)--><!--begin::OverlayScrollbars Configure-->
|
|
||||||
<script>
|
|
||||||
const SELECTOR_SIDEBAR_WRAPPER = '.sidebar-wrapper';
|
|
||||||
const Default = {
|
|
||||||
scrollbarTheme: 'os-theme-light',
|
|
||||||
scrollbarAutoHide: 'leave',
|
|
||||||
scrollbarClickScroll: true,
|
|
||||||
};
|
|
||||||
document.addEventListener('DOMContentLoaded', function () {
|
|
||||||
const sidebarWrapper = document.querySelector(SELECTOR_SIDEBAR_WRAPPER);
|
|
||||||
if (sidebarWrapper && typeof OverlayScrollbarsGlobal?.OverlayScrollbars !== 'undefined') {
|
|
||||||
OverlayScrollbarsGlobal.OverlayScrollbars(sidebarWrapper, {
|
|
||||||
scrollbars: {
|
|
||||||
theme: Default.scrollbarTheme,
|
|
||||||
autoHide: Default.scrollbarAutoHide,
|
|
||||||
clickScroll: Default.scrollbarClickScroll,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<!--end::OverlayScrollbars Configure-->
|
|
||||||
<!--end::Script-->
|
|
||||||
</body>
|
|
||||||
<!--end::Body-->
|
|
||||||
</html>
|
|
@ -1,155 +0,0 @@
|
|||||||
<!doctype html>
|
|
||||||
<html lang="en">
|
|
||||||
<!--begin::Head-->
|
|
||||||
<head>
|
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
||||||
<title>AdminLTE 4 | Register Page</title>
|
|
||||||
<!--begin::Primary Meta Tags-->
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<meta name="title" content="AdminLTE 4 | Register Page" />
|
|
||||||
<meta name="author" content="ColorlibHQ" />
|
|
||||||
<meta
|
|
||||||
name="description"
|
|
||||||
content="AdminLTE is a Free Bootstrap 5 Admin Dashboard, 30 example pages using Vanilla JS."
|
|
||||||
/>
|
|
||||||
<meta
|
|
||||||
name="keywords"
|
|
||||||
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"
|
|
||||||
/>
|
|
||||||
<!--end::Primary Meta Tags-->
|
|
||||||
<!--begin::Fonts-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/@fontsource/source-sans-3@5.0.12/index.css"
|
|
||||||
integrity="sha256-tXJfXfp6Ewt1ilPzLDtQnJV4hclT9XuaZUKyUvmyr+Q="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Fonts-->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/styles/overlayscrollbars.min.css"
|
|
||||||
integrity="sha256-tZHrRjVqNSRyWg2wbppGnT833E/Ys0DHWGwT04GiqQg="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<!--begin::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"
|
|
||||||
integrity="sha256-9kPW/n5nn53j4WMRYAxe9c1rCY96Oogo/MKSVdKzPmI="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<link rel="stylesheet" href="../../../dist/css/adminlte.css" />
|
|
||||||
<!--end::Required Plugin(AdminLTE)-->
|
|
||||||
</head>
|
|
||||||
<!--end::Head-->
|
|
||||||
<!--begin::Body-->
|
|
||||||
<body class="register-page bg-body-secondary">
|
|
||||||
<div class="register-box">
|
|
||||||
<div class="register-logo">
|
|
||||||
<a href="../index2.html"><b>Admin</b>LTE</a>
|
|
||||||
</div>
|
|
||||||
<!-- /.register-logo -->
|
|
||||||
<div class="card">
|
|
||||||
<div class="card-body register-card-body">
|
|
||||||
<p class="register-box-msg">Register a new membership</p>
|
|
||||||
<form action="../index3.html" method="post">
|
|
||||||
<div class="input-group mb-3">
|
|
||||||
<input type="text" class="form-control" placeholder="Full Name" />
|
|
||||||
<div class="input-group-text"><span class="bi bi-person"></span></div>
|
|
||||||
</div>
|
|
||||||
<div class="input-group mb-3">
|
|
||||||
<input type="email" class="form-control" placeholder="Email" />
|
|
||||||
<div class="input-group-text"><span class="bi bi-envelope"></span></div>
|
|
||||||
</div>
|
|
||||||
<div class="input-group mb-3">
|
|
||||||
<input type="password" class="form-control" placeholder="Password" />
|
|
||||||
<div class="input-group-text"><span class="bi bi-lock-fill"></span></div>
|
|
||||||
</div>
|
|
||||||
<!--begin::Row-->
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-8">
|
|
||||||
<div class="form-check">
|
|
||||||
<input class="form-check-input" type="checkbox" value="" id="flexCheckDefault" />
|
|
||||||
<label class="form-check-label" for="flexCheckDefault">
|
|
||||||
I agree to the <a href="#">terms</a>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- /.col -->
|
|
||||||
<div class="col-4">
|
|
||||||
<div class="d-grid gap-2">
|
|
||||||
<button type="submit" class="btn btn-primary">Sign In</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- /.col -->
|
|
||||||
</div>
|
|
||||||
<!--end::Row-->
|
|
||||||
</form>
|
|
||||||
<div class="social-auth-links text-center mb-3 d-grid gap-2">
|
|
||||||
<p>- OR -</p>
|
|
||||||
<a href="#" class="btn btn-primary">
|
|
||||||
<i class="bi bi-facebook me-2"></i> Sign in using Facebook
|
|
||||||
</a>
|
|
||||||
<a href="#" class="btn btn-danger">
|
|
||||||
<i class="bi bi-google me-2"></i> Sign in using Google+
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
<!-- /.social-auth-links -->
|
|
||||||
<p class="mb-0">
|
|
||||||
<a href="login.html" class="text-center"> I already have a membership </a>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<!-- /.register-card-body -->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- /.register-box -->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/browser/overlayscrollbars.browser.es6.min.js"
|
|
||||||
integrity="sha256-dghWARbRe2eLlIJ56wNB+b760ywulqK3DzZYEpsg2fQ="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)--><!--begin::Required Plugin(popperjs for Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js"
|
|
||||||
integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(popperjs for Bootstrap 5)--><!--begin::Required Plugin(Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js"
|
|
||||||
integrity="sha384-0pUGZvbkm6XF6gxjEnlmuGrJXVbNuzT9qBBavbLwCsOGabYfZo0T0to5eqruptLy"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(Bootstrap 5)--><!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<script src="../../../dist/js/adminlte.js"></script>
|
|
||||||
<!--end::Required Plugin(AdminLTE)--><!--begin::OverlayScrollbars Configure-->
|
|
||||||
<script>
|
|
||||||
const SELECTOR_SIDEBAR_WRAPPER = '.sidebar-wrapper';
|
|
||||||
const Default = {
|
|
||||||
scrollbarTheme: 'os-theme-light',
|
|
||||||
scrollbarAutoHide: 'leave',
|
|
||||||
scrollbarClickScroll: true,
|
|
||||||
};
|
|
||||||
document.addEventListener('DOMContentLoaded', function () {
|
|
||||||
const sidebarWrapper = document.querySelector(SELECTOR_SIDEBAR_WRAPPER);
|
|
||||||
if (sidebarWrapper && typeof OverlayScrollbarsGlobal?.OverlayScrollbars !== 'undefined') {
|
|
||||||
OverlayScrollbarsGlobal.OverlayScrollbars(sidebarWrapper, {
|
|
||||||
scrollbars: {
|
|
||||||
theme: Default.scrollbarTheme,
|
|
||||||
autoHide: Default.scrollbarAutoHide,
|
|
||||||
clickScroll: Default.scrollbarClickScroll,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<!--end::OverlayScrollbars Configure-->
|
|
||||||
<!--end::Script-->
|
|
||||||
</body>
|
|
||||||
<!--end::Body-->
|
|
||||||
</html>
|
|
@ -1,737 +0,0 @@
|
|||||||
<!doctype html>
|
|
||||||
<html lang="en">
|
|
||||||
<!--begin::Head-->
|
|
||||||
<head>
|
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
||||||
<title>AdminLTE 4 | Theme Customize</title>
|
|
||||||
<!--begin::Primary Meta Tags-->
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<meta name="title" content="AdminLTE 4 | Theme Customize" />
|
|
||||||
<meta name="author" content="ColorlibHQ" />
|
|
||||||
<meta
|
|
||||||
name="description"
|
|
||||||
content="AdminLTE is a Free Bootstrap 5 Admin Dashboard, 30 example pages using Vanilla JS."
|
|
||||||
/>
|
|
||||||
<meta
|
|
||||||
name="keywords"
|
|
||||||
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"
|
|
||||||
/>
|
|
||||||
<!--end::Primary Meta Tags-->
|
|
||||||
<!--begin::Fonts-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/@fontsource/source-sans-3@5.0.12/index.css"
|
|
||||||
integrity="sha256-tXJfXfp6Ewt1ilPzLDtQnJV4hclT9XuaZUKyUvmyr+Q="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Fonts-->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/styles/overlayscrollbars.min.css"
|
|
||||||
integrity="sha256-tZHrRjVqNSRyWg2wbppGnT833E/Ys0DHWGwT04GiqQg="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<!--begin::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"
|
|
||||||
integrity="sha256-9kPW/n5nn53j4WMRYAxe9c1rCY96Oogo/MKSVdKzPmI="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<!--end::Third Party Plugin(Bootstrap Icons)-->
|
|
||||||
<!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<link rel="stylesheet" href="../../../dist/css/adminlte.css" />
|
|
||||||
<!--end::Required Plugin(AdminLTE)-->
|
|
||||||
</head>
|
|
||||||
<!--end::Head-->
|
|
||||||
<!--begin::Body-->
|
|
||||||
<body class="sidebar-expand-lg bg-body-tertiary">
|
|
||||||
<!--begin::App Wrapper-->
|
|
||||||
<div class="app-wrapper">
|
|
||||||
<!--begin::Header-->
|
|
||||||
<nav class="app-header navbar navbar-expand bg-body">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<!--begin::Start Navbar Links-->
|
|
||||||
<ul class="navbar-nav">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" data-lte-toggle="sidebar" href="#" role="button">
|
|
||||||
<i class="bi bi-list"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item d-none d-md-block"><a href="#" class="nav-link">Home</a></li>
|
|
||||||
<li class="nav-item d-none d-md-block"><a href="#" class="nav-link">Contact</a></li>
|
|
||||||
</ul>
|
|
||||||
<!--end::Start Navbar Links-->
|
|
||||||
<!--begin::End Navbar Links-->
|
|
||||||
<ul class="navbar-nav ms-auto">
|
|
||||||
<!--begin::Navbar Search-->
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" data-widget="navbar-search" href="#" role="button">
|
|
||||||
<i class="bi bi-search"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Navbar Search-->
|
|
||||||
<!--begin::Messages Dropdown Menu-->
|
|
||||||
<li class="nav-item dropdown">
|
|
||||||
<a class="nav-link" data-bs-toggle="dropdown" href="#">
|
|
||||||
<i class="bi bi-chat-text"></i>
|
|
||||||
<span class="navbar-badge badge text-bg-danger">3</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user1-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
Brad Diesel
|
|
||||||
<span class="float-end fs-7 text-danger"
|
|
||||||
><i class="bi bi-star-fill"></i
|
|
||||||
></span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">Call me whenever you can...</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user8-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
John Pierce
|
|
||||||
<span class="float-end fs-7 text-secondary">
|
|
||||||
<i class="bi bi-star-fill"></i>
|
|
||||||
</span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">I got your message bro</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<!--begin::Message-->
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user3-128x128.jpg"
|
|
||||||
alt="User Avatar"
|
|
||||||
class="img-size-50 rounded-circle me-3"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex-grow-1">
|
|
||||||
<h3 class="dropdown-item-title">
|
|
||||||
Nora Silvester
|
|
||||||
<span class="float-end fs-7 text-warning">
|
|
||||||
<i class="bi bi-star-fill"></i>
|
|
||||||
</span>
|
|
||||||
</h3>
|
|
||||||
<p class="fs-7">The subject goes here</p>
|
|
||||||
<p class="fs-7 text-secondary">
|
|
||||||
<i class="bi bi-clock-fill me-1"></i> 4 Hours Ago
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--end::Message-->
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item dropdown-footer">See All Messages</a>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<!--end::Messages Dropdown Menu-->
|
|
||||||
<!--begin::Notifications Dropdown Menu-->
|
|
||||||
<li class="nav-item dropdown">
|
|
||||||
<a class="nav-link" data-bs-toggle="dropdown" href="#">
|
|
||||||
<i class="bi bi-bell-fill"></i>
|
|
||||||
<span class="navbar-badge badge text-bg-warning">15</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<span class="dropdown-item dropdown-header">15 Notifications</span>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-envelope me-2"></i> 4 new messages
|
|
||||||
<span class="float-end text-secondary fs-7">3 mins</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-people-fill me-2"></i> 8 friend requests
|
|
||||||
<span class="float-end text-secondary fs-7">12 hours</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item">
|
|
||||||
<i class="bi bi-file-earmark-fill me-2"></i> 3 new reports
|
|
||||||
<span class="float-end text-secondary fs-7">2 days</span>
|
|
||||||
</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a href="#" class="dropdown-item dropdown-footer"> See All Notifications </a>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<!--end::Notifications Dropdown Menu-->
|
|
||||||
<!--begin::Fullscreen Toggle-->
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" href="#" data-lte-toggle="fullscreen">
|
|
||||||
<i data-lte-icon="maximize" class="bi bi-arrows-fullscreen"></i>
|
|
||||||
<i data-lte-icon="minimize" class="bi bi-fullscreen-exit" style="display: none"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Fullscreen Toggle-->
|
|
||||||
<!--begin::User Menu Dropdown-->
|
|
||||||
<li class="nav-item dropdown user-menu">
|
|
||||||
<a href="#" class="nav-link dropdown-toggle" data-bs-toggle="dropdown">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user2-160x160.jpg"
|
|
||||||
class="user-image rounded-circle shadow"
|
|
||||||
alt="User Image"
|
|
||||||
/>
|
|
||||||
<span class="d-none d-md-inline">Alexander Pierce</span>
|
|
||||||
</a>
|
|
||||||
<ul class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
|
|
||||||
<!--begin::User Image-->
|
|
||||||
<li class="user-header text-bg-primary">
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/user2-160x160.jpg"
|
|
||||||
class="rounded-circle shadow"
|
|
||||||
alt="User Image"
|
|
||||||
/>
|
|
||||||
<p>
|
|
||||||
Alexander Pierce - Web Developer
|
|
||||||
<small>Member since Nov. 2023</small>
|
|
||||||
</p>
|
|
||||||
</li>
|
|
||||||
<!--end::User Image-->
|
|
||||||
<!--begin::Menu Body-->
|
|
||||||
<li class="user-body">
|
|
||||||
<!--begin::Row-->
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-4 text-center"><a href="#">Followers</a></div>
|
|
||||||
<div class="col-4 text-center"><a href="#">Sales</a></div>
|
|
||||||
<div class="col-4 text-center"><a href="#">Friends</a></div>
|
|
||||||
</div>
|
|
||||||
<!--end::Row-->
|
|
||||||
</li>
|
|
||||||
<!--end::Menu Body-->
|
|
||||||
<!--begin::Menu Footer-->
|
|
||||||
<li class="user-footer">
|
|
||||||
<a href="#" class="btn btn-default btn-flat">Profile</a>
|
|
||||||
<a href="#" class="btn btn-default btn-flat float-end">Sign out</a>
|
|
||||||
</li>
|
|
||||||
<!--end::Menu Footer-->
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<!--end::User Menu Dropdown-->
|
|
||||||
</ul>
|
|
||||||
<!--end::End Navbar Links-->
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</nav>
|
|
||||||
<!--end::Header-->
|
|
||||||
<!--begin::Sidebar-->
|
|
||||||
<aside class="app-sidebar bg-primary shadow" data-bs-theme="dark">
|
|
||||||
<!--begin::Sidebar Brand-->
|
|
||||||
<div class="sidebar-brand">
|
|
||||||
<!--begin::Brand Link-->
|
|
||||||
<a href="../index.html" class="brand-link">
|
|
||||||
<!--begin::Brand Image-->
|
|
||||||
<img
|
|
||||||
src="../../../dist/assets/img/AdminLTELogo.png"
|
|
||||||
alt="AdminLTE Logo"
|
|
||||||
class="brand-image opacity-75 shadow"
|
|
||||||
/>
|
|
||||||
<!--end::Brand Image-->
|
|
||||||
<!--begin::Brand Text-->
|
|
||||||
<span class="brand-text fw-light">AdminLTE 4</span>
|
|
||||||
<!--end::Brand Text-->
|
|
||||||
</a>
|
|
||||||
<!--end::Brand Link-->
|
|
||||||
</div>
|
|
||||||
<!--end::Sidebar Brand-->
|
|
||||||
<!--begin::Sidebar Wrapper-->
|
|
||||||
<div class="sidebar-wrapper">
|
|
||||||
<nav class="mt-2">
|
|
||||||
<!--begin::Sidebar Menu-->
|
|
||||||
<ul
|
|
||||||
class="nav sidebar-menu flex-column"
|
|
||||||
data-lte-toggle="treeview"
|
|
||||||
role="menu"
|
|
||||||
data-accordion="false"
|
|
||||||
>
|
|
||||||
<li class="nav-header">MULTI LEVEL EXAMPLE</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>Level 1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>
|
|
||||||
Level 1
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Level 2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>
|
|
||||||
Level 2
|
|
||||||
<i class="nav-arrow bi bi-chevron-right"></i>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
<ul class="nav nav-treeview">
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-record-circle-fill"></i>
|
|
||||||
<p>Level 3</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle"></i>
|
|
||||||
<p>Level 2</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a href="#" class="nav-link">
|
|
||||||
<i class="nav-icon bi bi-circle-fill"></i>
|
|
||||||
<p>Level 1</p>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
<!--end::Sidebar Menu-->
|
|
||||||
</nav>
|
|
||||||
</div>
|
|
||||||
<!--end::Sidebar Wrapper-->
|
|
||||||
</aside>
|
|
||||||
<!--end::Sidebar-->
|
|
||||||
<!--begin::App Main-->
|
|
||||||
<main class="app-main">
|
|
||||||
<!--begin::App Content Header-->
|
|
||||||
<div class="app-content-header">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<!--begin::Row-->
|
|
||||||
<div class="row">
|
|
||||||
<!--begin::Col-->
|
|
||||||
<div class="col-sm-6"><h3 class="mb-0">Theme Customize</h3></div>
|
|
||||||
<!--end::Col-->
|
|
||||||
<!--begin::Col-->
|
|
||||||
<div class="col-sm-6">
|
|
||||||
<ol class="breadcrumb float-sm-end">
|
|
||||||
<li class="breadcrumb-item"><a href="#">Home</a></li>
|
|
||||||
<li class="breadcrumb-item active" aria-current="page">Theme Customize</li>
|
|
||||||
</ol>
|
|
||||||
</div>
|
|
||||||
<!--end::Col-->
|
|
||||||
</div>
|
|
||||||
<!--end::Row-->
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Content Header-->
|
|
||||||
<!--begin::App Content-->
|
|
||||||
<div class="app-content">
|
|
||||||
<!--begin::Container-->
|
|
||||||
<div class="container-fluid">
|
|
||||||
<!--begin::Row-->
|
|
||||||
<div class="row">
|
|
||||||
<!--begin::Col-->
|
|
||||||
<div class="col-12">
|
|
||||||
<!--begin::Card-->
|
|
||||||
<div class="card">
|
|
||||||
<!--begin::Card Header-->
|
|
||||||
<div class="card-header">
|
|
||||||
<!--begin::Card Title-->
|
|
||||||
<h3 class="card-title">Sidebar Theme</h3>
|
|
||||||
<!--end::Card Title-->
|
|
||||||
<!--begin::Card Toolbar-->
|
|
||||||
<div class="card-tools">
|
|
||||||
<button type="button" class="btn btn-tool" data-lte-toggle="card-collapse">
|
|
||||||
<i data-lte-icon="expand" class="bi bi-plus-lg"></i>
|
|
||||||
<i data-lte-icon="collapse" class="bi bi-dash-lg"></i>
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
class="btn btn-tool"
|
|
||||||
data-lte-toggle="card-remove"
|
|
||||||
title="Remove"
|
|
||||||
>
|
|
||||||
<i class="bi bi-x-lg"></i>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
<!--end::Card Toolbar-->
|
|
||||||
</div>
|
|
||||||
<!--end::Card Header-->
|
|
||||||
<!--begin::Card Body-->
|
|
||||||
<div class="card-body">
|
|
||||||
<!--begin::Row-->
|
|
||||||
<div class="row">
|
|
||||||
<!--begin::Col-->
|
|
||||||
<div class="col-md-3">
|
|
||||||
<select
|
|
||||||
id="sidebar-color-modes"
|
|
||||||
class="form-select form-select-lg"
|
|
||||||
aria-label="Sidebar Color Mode Select"
|
|
||||||
>
|
|
||||||
<option value="">---Select---</option>
|
|
||||||
<option value="dark">Dark</option>
|
|
||||||
<option value="light">Light</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
<!--end::Col-->
|
|
||||||
<!--begin::Col-->
|
|
||||||
<div class="col-md-3">
|
|
||||||
<select
|
|
||||||
id="sidebar-color"
|
|
||||||
class="form-select form-select-lg"
|
|
||||||
aria-label="Sidebar Color Select"
|
|
||||||
>
|
|
||||||
<option value="">---Select---</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
<!--end::Col-->
|
|
||||||
<!--begin::Col-->
|
|
||||||
<div class="col-md-6"><div id="sidebar-color-code" class="w-100"></div></div>
|
|
||||||
<!--end::Col-->
|
|
||||||
</div>
|
|
||||||
<!--end::Row-->
|
|
||||||
</div>
|
|
||||||
<!--end::Card Body-->
|
|
||||||
<!--begin::Card Footer-->
|
|
||||||
<div class="card-footer">
|
|
||||||
Check more color in
|
|
||||||
<a
|
|
||||||
href="https://getbootstrap.com/docs/5.3/utilities/background/"
|
|
||||||
target="_blank"
|
|
||||||
class="link-primary"
|
|
||||||
>Bootstrap Background Colors</a
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
<!--end::Card Footer-->
|
|
||||||
</div>
|
|
||||||
<!--end::Card-->
|
|
||||||
<!--begin::Card-->
|
|
||||||
<div class="card mt-4">
|
|
||||||
<!--begin::Card Header-->
|
|
||||||
<div class="card-header">
|
|
||||||
<!--begin::Card Title-->
|
|
||||||
<h3 class="card-title">Navbar Theme</h3>
|
|
||||||
<!--end::Card Title-->
|
|
||||||
<!--begin::Card Toolbar-->
|
|
||||||
<div class="card-tools">
|
|
||||||
<button type="button" class="btn btn-tool" data-lte-toggle="card-collapse">
|
|
||||||
<i data-lte-icon="expand" class="bi bi-plus-lg"></i>
|
|
||||||
<i data-lte-icon="collapse" class="bi bi-dash-lg"></i>
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
class="btn btn-tool"
|
|
||||||
data-lte-toggle="card-remove"
|
|
||||||
title="Remove"
|
|
||||||
>
|
|
||||||
<i class="bi bi-x-lg"></i>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
<!--end::Card Toolbar-->
|
|
||||||
</div>
|
|
||||||
<!--end::Card Header-->
|
|
||||||
<!--begin::Card Body-->
|
|
||||||
<div class="card-body">
|
|
||||||
<!--begin::Row-->
|
|
||||||
<div class="row">
|
|
||||||
<!--begin::Col-->
|
|
||||||
<div class="col-md-3">
|
|
||||||
<select
|
|
||||||
id="navbar-color-modes"
|
|
||||||
class="form-select form-select-lg"
|
|
||||||
aria-label="Navbar Color Mode Select"
|
|
||||||
>
|
|
||||||
<option value="">---Select---</option>
|
|
||||||
<option value="dark">Dark</option>
|
|
||||||
<option value="light">Light</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
<!--end::Col-->
|
|
||||||
<!--begin::Col-->
|
|
||||||
<div class="col-md-3">
|
|
||||||
<select
|
|
||||||
id="navbar-color"
|
|
||||||
class="form-select form-select-lg"
|
|
||||||
aria-label="Navbar Color Select"
|
|
||||||
>
|
|
||||||
<option value="">---Select---</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
<!--end::Col-->
|
|
||||||
<!--begin::Col-->
|
|
||||||
<div class="col-md-6"><div id="navbar-color-code" class="w-100"></div></div>
|
|
||||||
<!--end::Col-->
|
|
||||||
</div>
|
|
||||||
<!--end::Row-->
|
|
||||||
</div>
|
|
||||||
<!--end::Card Body-->
|
|
||||||
<!--begin::Card Footer-->
|
|
||||||
<div class="card-footer">
|
|
||||||
Check more color in
|
|
||||||
<a
|
|
||||||
href="https://getbootstrap.com/docs/5.3/utilities/background/"
|
|
||||||
target="_blank"
|
|
||||||
class="link-primary"
|
|
||||||
>Bootstrap Background Colors</a
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
<!--end::Card Footer-->
|
|
||||||
</div>
|
|
||||||
<!--end::Card-->
|
|
||||||
</div>
|
|
||||||
<!--end::Col-->
|
|
||||||
</div>
|
|
||||||
<!--end::Row-->
|
|
||||||
</div>
|
|
||||||
<!--end::Container-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Content-->
|
|
||||||
</main>
|
|
||||||
<!--end::App Main-->
|
|
||||||
<!--begin::Footer-->
|
|
||||||
<footer class="app-footer">
|
|
||||||
<!--begin::To the end-->
|
|
||||||
<div class="float-end d-none d-sm-inline">Anything you want</div>
|
|
||||||
<!--end::To the end-->
|
|
||||||
<!--begin::Copyright-->
|
|
||||||
<strong>
|
|
||||||
Copyright © 2014-2024
|
|
||||||
<a href="https://adminlte.io" class="text-decoration-none">AdminLTE.io</a>.
|
|
||||||
</strong>
|
|
||||||
All rights reserved.
|
|
||||||
<!--end::Copyright-->
|
|
||||||
</footer>
|
|
||||||
<!--end::Footer-->
|
|
||||||
</div>
|
|
||||||
<!--end::App Wrapper-->
|
|
||||||
<!--begin::Script-->
|
|
||||||
<!--begin::Third Party Plugin(OverlayScrollbars)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/overlayscrollbars@2.10.1/browser/overlayscrollbars.browser.es6.min.js"
|
|
||||||
integrity="sha256-dghWARbRe2eLlIJ56wNB+b760ywulqK3DzZYEpsg2fQ="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Third Party Plugin(OverlayScrollbars)--><!--begin::Required Plugin(popperjs for Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js"
|
|
||||||
integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(popperjs for Bootstrap 5)--><!--begin::Required Plugin(Bootstrap 5)-->
|
|
||||||
<script
|
|
||||||
src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js"
|
|
||||||
integrity="sha384-0pUGZvbkm6XF6gxjEnlmuGrJXVbNuzT9qBBavbLwCsOGabYfZo0T0to5eqruptLy"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
></script>
|
|
||||||
<!--end::Required Plugin(Bootstrap 5)--><!--begin::Required Plugin(AdminLTE)-->
|
|
||||||
<script src="../../../dist/js/adminlte.js"></script>
|
|
||||||
<!--end::Required Plugin(AdminLTE)--><!--begin::OverlayScrollbars Configure-->
|
|
||||||
<script>
|
|
||||||
const SELECTOR_SIDEBAR_WRAPPER = '.sidebar-wrapper';
|
|
||||||
const Default = {
|
|
||||||
scrollbarTheme: 'os-theme-light',
|
|
||||||
scrollbarAutoHide: 'leave',
|
|
||||||
scrollbarClickScroll: true,
|
|
||||||
};
|
|
||||||
document.addEventListener('DOMContentLoaded', function () {
|
|
||||||
const sidebarWrapper = document.querySelector(SELECTOR_SIDEBAR_WRAPPER);
|
|
||||||
if (sidebarWrapper && typeof OverlayScrollbarsGlobal?.OverlayScrollbars !== 'undefined') {
|
|
||||||
OverlayScrollbarsGlobal.OverlayScrollbars(sidebarWrapper, {
|
|
||||||
scrollbars: {
|
|
||||||
theme: Default.scrollbarTheme,
|
|
||||||
autoHide: Default.scrollbarAutoHide,
|
|
||||||
clickScroll: Default.scrollbarClickScroll,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<!--end::OverlayScrollbars Configure-->
|
|
||||||
<script>
|
|
||||||
document.addEventListener('DOMContentLoaded', () => {
|
|
||||||
const appSidebar = document.querySelector('.app-sidebar');
|
|
||||||
const sidebarColorModes = document.querySelector('#sidebar-color-modes');
|
|
||||||
const sidebarColor = document.querySelector('#sidebar-color');
|
|
||||||
const sidebarColorCode = document.querySelector('#sidebar-color-code');
|
|
||||||
|
|
||||||
const themeBg = [
|
|
||||||
'bg-primary',
|
|
||||||
'bg-primary-subtle',
|
|
||||||
'bg-secondary',
|
|
||||||
'bg-secondary-subtle',
|
|
||||||
'bg-success',
|
|
||||||
'bg-success-subtle',
|
|
||||||
'bg-danger',
|
|
||||||
'bg-danger-subtle',
|
|
||||||
'bg-warning',
|
|
||||||
'bg-warning-subtle',
|
|
||||||
'bg-info',
|
|
||||||
'bg-info-subtle',
|
|
||||||
'bg-light',
|
|
||||||
'bg-light-subtle',
|
|
||||||
'bg-dark',
|
|
||||||
'bg-dark-subtle',
|
|
||||||
'bg-body-secondary',
|
|
||||||
'bg-body-tertiary',
|
|
||||||
'bg-body',
|
|
||||||
'bg-black',
|
|
||||||
'bg-white',
|
|
||||||
'bg-transparent',
|
|
||||||
];
|
|
||||||
|
|
||||||
// loop through each option themeBg array
|
|
||||||
document.querySelector('#sidebar-color').innerHTML = themeBg.map((bg) => {
|
|
||||||
// return option element with value and text
|
|
||||||
return `<option value="${bg}" class="text-${bg}">${bg}</option>`;
|
|
||||||
});
|
|
||||||
|
|
||||||
let sidebarColorMode = '';
|
|
||||||
let sidebarBg = '';
|
|
||||||
|
|
||||||
function updateSidebar() {
|
|
||||||
appSidebar.setAttribute('data-bs-theme', sidebarColorMode);
|
|
||||||
|
|
||||||
sidebarColorCode.innerHTML = `<pre><code class="language-html"><aside class="app-sidebar ${sidebarBg}" data-bs-theme="${sidebarColorMode}">...</aside></code></pre>`;
|
|
||||||
}
|
|
||||||
|
|
||||||
sidebarColorModes.addEventListener('input', (event) => {
|
|
||||||
sidebarColorMode = event.target.value;
|
|
||||||
updateSidebar();
|
|
||||||
});
|
|
||||||
|
|
||||||
sidebarColor.addEventListener('input', (event) => {
|
|
||||||
sidebarBg = event.target.value;
|
|
||||||
|
|
||||||
themeBg.forEach((className) => {
|
|
||||||
appSidebar.classList.remove(className);
|
|
||||||
});
|
|
||||||
|
|
||||||
if (themeBg.includes(sidebarBg)) {
|
|
||||||
appSidebar.classList.add(sidebarBg);
|
|
||||||
}
|
|
||||||
|
|
||||||
updateSidebar();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
document.addEventListener('DOMContentLoaded', () => {
|
|
||||||
const appNavbar = document.querySelector('.app-header');
|
|
||||||
const navbarColorModes = document.querySelector('#navbar-color-modes');
|
|
||||||
const navbarColor = document.querySelector('#navbar-color');
|
|
||||||
const navbarColorCode = document.querySelector('#navbar-color-code');
|
|
||||||
|
|
||||||
const themeBg = [
|
|
||||||
'bg-primary',
|
|
||||||
'bg-primary-subtle',
|
|
||||||
'bg-secondary',
|
|
||||||
'bg-secondary-subtle',
|
|
||||||
'bg-success',
|
|
||||||
'bg-success-subtle',
|
|
||||||
'bg-danger',
|
|
||||||
'bg-danger-subtle',
|
|
||||||
'bg-warning',
|
|
||||||
'bg-warning-subtle',
|
|
||||||
'bg-info',
|
|
||||||
'bg-info-subtle',
|
|
||||||
'bg-light',
|
|
||||||
'bg-light-subtle',
|
|
||||||
'bg-dark',
|
|
||||||
'bg-dark-subtle',
|
|
||||||
'bg-body-secondary',
|
|
||||||
'bg-body-tertiary',
|
|
||||||
'bg-body',
|
|
||||||
'bg-black',
|
|
||||||
'bg-white',
|
|
||||||
'bg-transparent',
|
|
||||||
];
|
|
||||||
|
|
||||||
// loop through each option themeBg array
|
|
||||||
document.querySelector('#navbar-color').innerHTML = themeBg.map((bg) => {
|
|
||||||
// return option element with value and text
|
|
||||||
return `<option value="${bg}" class="text-${bg}">${bg}</option>`;
|
|
||||||
});
|
|
||||||
|
|
||||||
let navbarColorMode = '';
|
|
||||||
let navbarBg = '';
|
|
||||||
|
|
||||||
function updateNavbar() {
|
|
||||||
appNavbar.setAttribute('data-bs-theme', navbarColorMode);
|
|
||||||
navbarColorCode.innerHTML = `<pre><code class="language-html"><nav class="app-header navbar navbar-expand ${navbarBg}" data-bs-theme="${navbarColorMode}">...</nav></code></pre>`;
|
|
||||||
}
|
|
||||||
|
|
||||||
navbarColorModes.addEventListener('input', (event) => {
|
|
||||||
navbarColorMode = event.target.value;
|
|
||||||
updateNavbar();
|
|
||||||
});
|
|
||||||
|
|
||||||
navbarColor.addEventListener('input', (event) => {
|
|
||||||
navbarBg = event.target.value;
|
|
||||||
|
|
||||||
themeBg.forEach((className) => {
|
|
||||||
appNavbar.classList.remove(className);
|
|
||||||
});
|
|
||||||
|
|
||||||
if (themeBg.includes(navbarBg)) {
|
|
||||||
appNavbar.classList.add(navbarBg);
|
|
||||||
}
|
|
||||||
|
|
||||||
updateNavbar();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<!--end::Script-->
|
|
||||||
</body>
|
|
||||||
<!--end::Body-->
|
|
||||||
</html>
|
|