public/front.admin
3
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

INIT

Browse Source
This commit is contained in:
Bartek PC-KADR
2022-04-12 07:26:41 +02:00
commit fbdacea3e3
1363 changed files with 776066 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

165
src/layouts/content-combinations-container-overlay.html Normal file
View File

@@ -0,0 +1,165 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required Meta Tags Always Come First -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Title -->
<title>Overlay - Container | Front - Admin &amp; Dashboard Template</title>
<!-- Favicon -->
<link rel="shortcut icon" href="@@autopath/favicon.ico">
<!-- Font -->
<link href="@@vars.themeFont" rel="stylesheet">
<!-- CSS Implementing Plugins -->
<!-- bundlecss:vendor [@@autopath] -->
<link rel="stylesheet" href="@@autopath/node_modules/bootstrap-icons/font/bootstrap-icons.css">
<!-- CSS Front Template -->
<!-- bundlecss:theme [@@autopath] @@vars.version -->
@@if(layoutBuilder.extend.switcherSupport === false) {
<link rel="stylesheet" href="@@autopath/assets/css/theme@@if(themeAppearance.layoutSkin === 'dark'){-dark}.css">
}
@@if(layoutBuilder.extend.switcherSupport === true) {
<link rel="preload" href="@@autopath/assets/css/theme.css" data-hs-appearance="default" as="style">
<link rel="preload" href="@@autopath/assets/css/theme-dark.css" data-hs-appearance="dark" as="style">
<style data-hs-appearance-onload-styles>
* {
transition: unset !important;
}
body {
opacity: 0;
}
</style>
}
</head>
<body class="bg-light">
@@if(layoutBuilder.extend.switcherSupport === true) {
<script src="@@autopath/assets/js/hs.theme-appearance.js"></script>
}
<!-- ========== MAIN CONTENT ========== -->
<main id="content" role="main" class="main">
<!-- Content -->
<div class="bg-dark">
<div class="content container" style="height: 25rem;">
<!-- Page Header -->
<div class="page-header page-header-light page-header-reset navbar-expand-lg">
<div class="navbar-nav">
<div class="row align-items-center flex-grow-1">
<div class="col">
<!-- Logo -->
@@include("@@autopath/partials/layouts-components/navbar-single-logo-light.html")
<!-- End Logo -->
</div>
<div class="col-auto">
<!-- Navbar -->
<ul class="list-inline">
<li class="list-inline-item d-none d-sm-inline-block">
<!-- Notification -->
@@include("@@autopath/partials/layouts-components/dropdown-notifications-ghost-light.html")
<!-- End Notification -->
</li>
<li class="list-inline-item d-none d-sm-inline-block">
<!-- Apps -->
@@include("@@autopath/partials/layouts-components/dropdown-apps-ghost-light.html")
<!-- End Apps -->
</li>
<li class="list-inline-item d-none d-sm-inline-block">
<!-- Activity -->
<button class="btn btn-ghost-light btn-icon rounded-circle" type="button" data-bs-toggle="offcanvas" data-bs-target="#offcanvasActivityStream" aria-controls="offcanvasActivityStream">
<i class="bi-x-diamond"></i>
</button>
<!-- Activity -->
</li>
<li class="list-inline-item">
<!-- Account -->
@@include("@@autopath/partials/layouts-components/dropdown-user.html")
<!-- End Account -->
</li>
</ul>
<!-- End Navbar -->
</div>
</div>
<!-- End Row -->
</div>
</div>
<!-- End Page Header -->
</div>
</div>
<!-- End Content -->
<!-- Content -->
<div class="content container" style="margin-top: -19rem;">
<!-- Card -->
<div class="card card-centered mb-3 mb-lg-5">
<div class="card-body py-10 my-lg-10">
<img class="img-fluid mb-5" src="@@autopath/assets/svg/layouts/content-combinations-container-overlay.svg" alt="Image Description" data-hs-theme-appearance="default" style="max-width: 15rem;">
<img class="img-fluid shadow-sm mb-5" src="@@autopath/assets/svg/layouts-light/content-combinations-container-overlay.svg" alt="Image Description" data-hs-theme-appearance="dark" style="max-width: 15rem;">
<h1>Overlay Container - Content Combinations</h1>
<p>Customize your overview page layout. Choose the one that best fits your needs.</p>
<a class="btn btn-primary" href="@@autopath/layouts/index.html">Go back to Layouts</a>
</div>
</div>
<!-- End Card -->
<!-- Card -->
<div class="card card-centered">
<div class="card-body py-10">
<img class="avatar avatar-xxl mb-3" src="@@autopath/assets/svg/illustrations/oc-megaphone.svg" alt="Image Description" data-hs-theme-appearance="default">
<img class="avatar avatar-xxl mb-3" src="@@autopath/assets/svg/illustrations-light/oc-megaphone.svg" alt="Image Description" data-hs-theme-appearance="dark">
<p class="card-text">No data to show</p>
<a class="btn btn-white btn-sm" href="@@autopath/index.html">Get Started</a>
</div>
</div>
<!-- End Card -->
</div>
<!-- End Content -->
</main>
<!-- ========== END MAIN CONTENT ========== -->
<!-- Activity -->
@@include("@@autopath/partials/layouts-components/offcanvas-activity.html")
<!-- End Activity -->
<!-- JS Global Compulsory @@deleteLine:build -->
<script src="@@autopath/node_modules/jquery/dist/jquery.min.js"></script>
<script src="@@autopath/node_modules/jquery-migrate/dist/jquery-migrate.min.js"></script>
<script src="@@autopath/node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<!-- JS Implementing Plugins -->
<!-- bundlejs:vendor [@@autopath] -->
<!-- JS Front -->
<!-- bundlejs:theme [@@autopath] -->
<script src="@@autopath/assets/js/hs.core.js"></script>
<script src="@@autopath/assets/js/hs.bs-dropdown.js"></script>
<!-- JS Plugins Init. -->
<script>
(function() {
// INITIALIZATION OF BOOTSTRAP DROPDOWN
// =======================================================
HSBsDropdown.init()
})()
</script>
<!-- Style Switcher JS -->
@@if(layoutBuilder.extend.switcherSupport === true) {
@@include("@@autopath/partials/layouts-components/darkmode-switcher-js.html")
}
<!-- End Style Switcher JS -->
</body>
</html>

171
src/layouts/content-combinations-content-centered.html Normal file
View File

@@ -0,0 +1,171 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required Meta Tags Always Come First -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Title -->
<title>Content Combinations (Centered) | Front - Admin &amp; Dashboard Template</title>
<!-- Favicon -->
<link rel="shortcut icon" href="@@autopath/favicon.ico">
<!-- Font -->
<link href="@@vars.themeFont" rel="stylesheet">
<!-- CSS Implementing Plugins -->
<!-- bundlecss:vendor [@@autopath] -->
<link rel="stylesheet" href="@@autopath/node_modules/bootstrap-icons/font/bootstrap-icons.css">
<!-- CSS Front Template -->
<!-- bundlecss:theme [@@autopath] @@vars.version -->
@@if(layoutBuilder.extend.switcherSupport === false) {
<link rel="stylesheet" href="@@autopath/assets/css/theme@@if(themeAppearance.layoutSkin === 'dark'){-dark}.css">
}
@@if(layoutBuilder.extend.switcherSupport === true) {
<link rel="preload" href="@@autopath/assets/css/theme.css" data-hs-appearance="default" as="style">
<link rel="preload" href="@@autopath/assets/css/theme-dark.css" data-hs-appearance="dark" as="style">
<style data-hs-appearance-onload-styles>
* {
transition: unset !important;
}
body {
opacity: 0;
}
</style>
}
</head>
<body class="has-navbar-vertical-aside navbar-vertical-aside-show-xl">
@@if(layoutBuilder.extend.switcherSupport === true) {
<script src="@@autopath/assets/js/hs.theme-appearance.js"></script>
}
<!-- ========== MAIN CONTENT ========== -->
<!-- Navbar Vertical -->
@@include("@@autopath/partials/sidebar/dark.html", {
"category": "dashboards",
"subcategory": "",
"link": "index.html"
})
<!-- End Navbar Vertical -->
<main id="content" role="main" class="main">
<!-- Content -->
<div class="content container-fluid">
<div class="row justify-content-lg-center">
<div class="col-lg-9">
<!-- Navbar Vertical Toggle -->
<div class="d-flex d-xl-none justify-content-end mb-3">
<button type="button" class="js-navbar-vertical-aside-toggle-invoker navbar-aside-toggler position-static">
<i class="bi-arrow-bar-left navbar-toggler-short-align" data-bs-toggle="tooltip" data-bs-placement="right" title="Collapse"></i>
<i class="bi-arrow-bar-right navbar-toggler-full-align" data-bs-template='<div class="tooltip d-none d-sm-block" role="tooltip"><div class="arrow"></div><div class="tooltip-inner"></div></div>' data-bs-toggle="tooltip" data-bs-placement="right" title="Expand"></i>
</button>
</div>
<!-- End Navbar Vertical Toggle -->
<!-- Card -->
<div class="card card-centered mb-3 mb-lg-5">
<div class="card-body py-10">
<!-- Title -->
<div class="text-center">
<img class="img-fluid mb-5" src="@@autopath/assets/svg/layouts/content-combinations-content-centered.svg" alt="Image Description" data-hs-theme-appearance="default" style="max-width: 15rem;">
<img class="img-fluid shadow-sm mb-5" src="@@autopath/assets/svg/layouts-light/content-combinations-content-centered.svg" alt="Image Description" data-hs-theme-appearance="dark" style="max-width: 15rem;">
<h1>Content Combinations (Centered)</h1>
<p>Customize your overview page layout. Choose the one that best fits your needs.</p>
<a class="btn btn-primary" href="@@autopath/layouts/index.html">Go back to Layouts</a>
</div>
<!-- End Title -->
</div>
</div>
<!-- End Card -->
<!-- Card -->
<div class="card card-centered mb-3 mb-lg-5">
<div class="card-body py-10">
<img class="avatar avatar-xxl mb-3" src="@@autopath/assets/svg/illustrations/oc-megaphone.svg" alt="Image Description" data-hs-theme-appearance="default">
<img class="avatar avatar-xxl mb-3" src="@@autopath/assets/svg/illustrations-light/oc-megaphone.svg" alt="Image Description" data-hs-theme-appearance="dark">
<p class="card-text">No data to show</p>
<a class="btn btn-white btn-sm" href="@@autopath/index.html">Get Started</a>
</div>
</div>
<!-- End Card -->
<!-- Card -->
<div class="card card-centered">
<div class="card-body py-10">
<img class="avatar avatar-xxl mb-3" src="@@autopath/assets/svg/illustrations/oc-megaphone.svg" alt="Image Description" data-hs-theme-appearance="default">
<img class="avatar avatar-xxl mb-3" src="@@autopath/assets/svg/illustrations-light/oc-megaphone.svg" alt="Image Description" data-hs-theme-appearance="dark">
<p class="card-text">No data to show</p>
<a class="btn btn-white btn-sm" href="@@autopath/index.html">Get Started</a>
</div>
</div>
<!-- End Card -->
</div>
</div>
<!-- End Row -->
</div>
<!-- End Content -->
</main>
<!-- ========== END MAIN CONTENT ========== -->
<!-- ========== SECONDARY CONTENTS ========== -->
<!-- Keyboard Shortcuts -->
@@include("@@autopath/partials/layouts-components/offcanvas-shortcuts.html")
<!-- End Keyboard Shortcuts -->
<!-- Activity -->
@@include("@@autopath/partials/layouts-components/offcanvas-activity.html")
<!-- End Activity -->
<!-- Welcome Message -->
@@include("@@autopath/partials/modals/welcome-message.html")
<!-- End Welcome Message -->
<!-- ========== END SECONDARY CONTENTS ========== -->
<!-- JS Global Compulsory @@deleteLine:build -->
<script src="@@autopath/node_modules/jquery/dist/jquery.min.js"></script>
<script src="@@autopath/node_modules/jquery-migrate/dist/jquery-migrate.min.js"></script>
<script src="@@autopath/node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<!-- JS Implementing Plugins -->
<!-- bundlejs:vendor [@@autopath] -->
<script src="@@autopath/assets/vendor/hs-navbar-vertical-aside/dist/hs-navbar-vertical-aside.min.js"></script>
<script src="@@autopath/assets/vendor/hs-form-search/dist/hs-form-search.min.js"></script>
<!-- JS Front -->
<!-- bundlejs:theme [@@autopath] -->
<script src="@@autopath/assets/js/hs.core.js"></script>
<script src="@@autopath/assets/js/hs.bs-dropdown.js"></script>
<!-- JS Plugins Init. -->
<script>
(function() {
// INITIALIZATION OF NAVBAR VERTICAL ASIDE
// =======================================================
new HSSideNav('.js-navbar-vertical-aside').init()
// INITIALIZATION OF BOOTSTRAP DROPDOWN
// =======================================================
HSBsDropdown.init()
// INITIALIZATION OF FORM SEARCH
// =======================================================
new HSFormSearch('.js-form-search')
})()
</script>
<!-- Style Switcher JS -->
@@if(layoutBuilder.extend.switcherSupport === true) {
@@include("@@autopath/partials/layouts-components/darkmode-switcher-js.html")
}
<!-- End Style Switcher JS -->
</body>
</html>

177
src/layouts/content-combinations-overlay.html Normal file
View File

@@ -0,0 +1,177 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required Meta Tags Always Come First -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Title -->
<title>Overlay - Content Combinations | Front - Admin &amp; Dashboard Template</title>
<!-- Favicon -->
<link rel="shortcut icon" href="@@autopath/favicon.ico">
<!-- Font -->
<link href="@@vars.themeFont" rel="stylesheet">
<!-- CSS Implementing Plugins -->
<!-- bundlecss:vendor [@@autopath] -->
<link rel="stylesheet" href="@@autopath/node_modules/bootstrap-icons/font/bootstrap-icons.css">
<!-- CSS Front Template -->
<!-- bundlecss:theme [@@autopath] @@vars.version -->
@@if(layoutBuilder.extend.switcherSupport === false) {
<link rel="stylesheet" href="@@autopath/assets/css/theme@@if(themeAppearance.layoutSkin === 'dark'){-dark}.css">
}
@@if(layoutBuilder.extend.switcherSupport === true) {
<link rel="preload" href="@@autopath/assets/css/theme.css" data-hs-appearance="default" as="style">
<link rel="preload" href="@@autopath/assets/css/theme-dark.css" data-hs-appearance="dark" as="style">
<style data-hs-appearance-onload-styles>
* {
transition: unset !important;
}
body {
opacity: 0;
}
</style>
}
</head>
<body class="footer-offset has-navbar-vertical-aside navbar-vertical-aside-show-xl">
@@if(layoutBuilder.extend.switcherSupport === true) {
<script src="@@autopath/assets/js/hs.theme-appearance.js"></script>
}
<!-- ========== HEADER ========== -->
@@include("@@autopath/partials/navbar/basic.html")
<!-- ========== END HEADER ========== -->
<!-- ========== MAIN CONTENT ========== -->
<!-- Navbar Vertical -->
@@include("@@autopath/partials/sidebar/main.html", {
"category": "dashboards",
"subcategory": "",
"link": "index.html"
})
<!-- End Navbar Vertical -->
<main id="content" role="main" class="main">
<!-- Content -->
<div class="bg-dark">
<div class="content container-fluid" style="height: 25rem;">
<!-- Page Header -->
<div class="page-header page-header-light">
<div class="row align-items-center">
<div class="col">
<h1 class="page-header-title">Dashboard</h1>
</div>
<!-- End Col -->
<div class="col-auto">
<a class="btn btn-primary" href="#">My dashboard</a>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Page Header -->
</div>
</div>
<!-- End Content -->
<!-- Content -->
<div class="content container-fluid" style="margin-top: -18rem;">
<!-- Card -->
<div class="card card-centered mb-3 mb-lg-5">
<div class="card-body py-10 my-lg-10">
<!-- Title -->
<div class="text-center">
<img class="img-fluid mb-5" src="@@autopath/assets/svg/layouts/content-combinations-overlay.svg" alt="Image Description" data-hs-theme-appearance="default" style="max-width: 15rem;">
<img class="img-fluid shadow-sm mb-5" src="@@autopath/assets/svg/layouts-light/content-combinations-overlay.svg" alt="Image Description" data-hs-theme-appearance="dark" style="max-width: 15rem;">
<h1>Overlay - Content Combinations</h1>
<p>Customize your overview page layout. Choose the one that best fits your needs.</p>
<a class="btn btn-primary" href="@@autopath/layouts/index.html">Go back to Layouts</a>
</div>
<!-- End Title -->
</div>
</div>
<!-- End Card -->
<!-- Card -->
<div class="card card-centered">
<div class="card-body py-10">
<img class="avatar avatar-xxl mb-3" src="@@autopath/assets/svg/illustrations/oc-megaphone.svg" alt="Image Description" data-hs-theme-appearance="default">
<img class="avatar avatar-xxl mb-3" src="@@autopath/assets/svg/illustrations-light/oc-megaphone.svg" alt="Image Description" data-hs-theme-appearance="dark">
<p class="card-text">No data to show</p>
<a class="btn btn-white btn-sm" href="@@autopath/index.html">Get Started</a>
</div>
</div>
<!-- End Card -->
</div>
<!-- End Content -->
<!-- Footer -->
@@include("@@autopath/partials/footer/main.html")
<!-- End Footer -->
</main>
<!-- ========== END MAIN CONTENT ========== -->
<!-- ========== SECONDARY CONTENTS ========== -->
<!-- Keyboard Shortcuts -->
@@include("@@autopath/partials/layouts-components/offcanvas-shortcuts.html")
<!-- End Keyboard Shortcuts -->
<!-- Activity -->
@@include("@@autopath/partials/layouts-components/offcanvas-activity.html")
<!-- End Activity -->
<!-- Welcome Message -->
@@include("@@autopath/partials/modals/welcome-message.html")
<!-- End Welcome Message -->
<!-- ========== END SECONDARY CONTENTS ========== -->
<!-- JS Global Compulsory @@deleteLine:build -->
<script src="@@autopath/node_modules/jquery/dist/jquery.min.js"></script>
<script src="@@autopath/node_modules/jquery-migrate/dist/jquery-migrate.min.js"></script>
<script src="@@autopath/node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<!-- JS Implementing Plugins -->
<!-- bundlejs:vendor [@@autopath] -->
<script src="@@autopath/assets/vendor/hs-navbar-vertical-aside/dist/hs-navbar-vertical-aside.min.js"></script>
<script src="@@autopath/assets/vendor/hs-form-search/dist/hs-form-search.min.js"></script>
<!-- JS Front -->
<!-- bundlejs:theme [@@autopath] -->
<script src="@@autopath/assets/js/hs.core.js"></script>
<script src="@@autopath/assets/js/hs.bs-dropdown.js"></script>
<!-- JS Plugins Init. -->
<script>
(function() {
// INITIALIZATION OF NAVBAR VERTICAL ASIDE
// =======================================================
new HSSideNav('.js-navbar-vertical-aside').init()
// INITIALIZATION OF BOOTSTRAP DROPDOWN
// =======================================================
HSBsDropdown.init()
// INITIALIZATION OF FORM SEARCH
// =======================================================
new HSFormSearch('.js-form-search')
})()
</script>
<!-- Style Switcher JS -->
@@if(layoutBuilder.extend.switcherSupport === true) {
@@include("@@autopath/partials/layouts-components/darkmode-switcher-js.html")
}
<!-- End Style Switcher JS -->
</body>
</html>

146
src/layouts/demo-layouts-default-classic.html Normal file
View File

@@ -0,0 +1,146 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required Meta Tags Always Come First -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Title -->
<title>Default (Classic) | Front - Admin &amp; Dashboard Template</title>
<!-- Favicon -->
<link rel="shortcut icon" href="@@autopath/favicon.ico">
<!-- Font -->
<link href="@@vars.themeFont" rel="stylesheet">
<!-- CSS Implementing Plugins -->
<!-- bundlecss:vendor [@@autopath] -->
<link rel="stylesheet" href="@@autopath/node_modules/bootstrap-icons/font/bootstrap-icons.css">
<!-- CSS Front Template -->
<!-- bundlecss:theme [@@autopath] @@vars.version -->
@@if(layoutBuilder.extend.switcherSupport === false) {
<link rel="stylesheet" href="@@autopath/assets/css/theme@@if(themeAppearance.layoutSkin === 'dark'){-dark}.css">
}
@@if(layoutBuilder.extend.switcherSupport === true) {
<link rel="preload" href="@@autopath/assets/css/theme.css" data-hs-appearance="default" as="style">
<link rel="preload" href="@@autopath/assets/css/theme-dark.css" data-hs-appearance="dark" as="style">
<style data-hs-appearance-onload-styles>
* {
transition: unset !important;
}
body {
opacity: 0;
}
</style>
}
</head>
<body class="has-navbar-vertical-aside navbar-vertical-aside-show-xl">
@@if(layoutBuilder.extend.switcherSupport === true) {
<script src="@@autopath/assets/js/hs.theme-appearance.js"></script>
}
<!-- ========== HEADER ========== -->
@@include("@@autopath/partials/navbar/main.html", {
"category": "dashboards",
"subcategory": "",
"link": "index.html"
})
<!-- ========== END HEADER ========== -->
<!-- ========== MAIN CONTENT ========== -->
<main id="content" role="main" class="main">
<!-- Navbar Vertical -->
@@include("@@autopath/partials/sidebar/main.html", {
"category": "dashboards",
"subcategory": "",
"link": "index.html"
})
<!-- End Navbar Vertical -->
<!-- Content -->
<div class="content container">
<div class="row justify-content-lg-center pt-lg-5 pt-xl-10">
<div class="col-lg-9">
<!-- Title -->
<div class="text-center">
<img class="img-fluid mb-5" src="@@autopath/assets/svg/layouts/demo-layouts-default-classic.svg" alt="Image Description" data-hs-theme-appearance="default" style="max-width: 15rem;">
<img class="img-fluid mb-5" src="@@autopath/assets/svg/layouts-light/demo-layouts-default-classic.svg" alt="Image Description" data-hs-theme-appearance="dark" style="max-width: 15rem;">
<h1>Default (Classic)</h1>
<p>Customize your overview page layout. Choose the one that best fits your needs.</p>
<a class="btn btn-primary" href="@@autopath/layouts/index.html">Go back to Layouts</a>
</div>
<!-- End Title -->
</div>
</div>
<!-- End Row -->
</div>
<!-- End Content -->
<!-- Footer -->
@@include("@@autopath/partials/footer/main.html")
<!-- End Footer -->
</main>
<!-- ========== END MAIN CONTENT ========== -->
<!-- ========== SECONDARY CONTENTS ========== -->
<!-- Keyboard Shortcuts -->
@@include("@@autopath/partials/layouts-components/offcanvas-shortcuts.html")
<!-- End Keyboard Shortcuts -->
<!-- Activity -->
@@include("@@autopath/partials/layouts-components/offcanvas-activity.html")
<!-- End Activity -->
<!-- Welcome Message -->
@@include("@@autopath/partials/modals/welcome-message.html")
<!-- End Welcome Message -->
<!-- ========== END SECONDARY CONTENTS ========== -->
<!-- JS Global Compulsory @@deleteLine:build -->
<script src="@@autopath/node_modules/jquery/dist/jquery.min.js"></script>
<script src="@@autopath/node_modules/jquery-migrate/dist/jquery-migrate.min.js"></script>
<script src="@@autopath/node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<!-- JS Implementing Plugins -->
<!-- bundlejs:vendor [@@autopath] -->
<script src="@@autopath/assets/vendor/hs-navbar-vertical-aside/dist/hs-navbar-vertical-aside.min.js"></script>
<script src="@@autopath/assets/vendor/hs-form-search/dist/hs-form-search.min.js"></script>
<!-- JS Front -->
<!-- bundlejs:theme [@@autopath] -->
<script src="@@autopath/assets/js/hs.core.js"></script>
<script src="@@autopath/assets/js/hs.bs-dropdown.js"></script>
<!-- JS Plugins Init. -->
<script>
(function() {
// INITIALIZATION OF NAVBAR VERTICAL ASIDE
// =======================================================
new HSSideNav('.js-navbar-vertical-aside').init()
// INITIALIZATION OF BOOTSTRAP DROPDOWN
// =======================================================
HSBsDropdown.init()
// INITIALIZATION OF FORM SEARCH
// =======================================================
new HSFormSearch('.js-form-search')
})()
</script>
<!-- Style Switcher JS -->
@@if(layoutBuilder.extend.switcherSupport === true) {
@@include("@@autopath/partials/layouts-components/darkmode-switcher-js.html")
}
<!-- End Style Switcher JS -->
</body>
</html>

146
src/layouts/demo-layouts-nav-tabs.html Normal file
View File

@@ -0,0 +1,146 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required Meta Tags Always Come First -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Title -->
<title>Default (Classic) | Front - Admin &amp; Dashboard Template</title>
<!-- Favicon -->
<link rel="shortcut icon" href="@@autopath/favicon.ico">
<!-- Font -->
<link href="@@vars.themeFont" rel="stylesheet">
<!-- CSS Implementing Plugins -->
<!-- bundlecss:vendor [@@autopath] -->
<link rel="stylesheet" href="@@autopath/node_modules/bootstrap-icons/font/bootstrap-icons.css">
<!-- CSS Front Template -->
<!-- bundlecss:theme [@@autopath] @@vars.version -->
@@if(layoutBuilder.extend.switcherSupport === false) {
<link rel="stylesheet" href="@@autopath/assets/css/theme@@if(themeAppearance.layoutSkin === 'dark'){-dark}.css">
}
@@if(layoutBuilder.extend.switcherSupport === true) {
<link rel="preload" href="@@autopath/assets/css/theme.css" data-hs-appearance="default" as="style">
<link rel="preload" href="@@autopath/assets/css/theme-dark.css" data-hs-appearance="dark" as="style">
<style data-hs-appearance-onload-styles>
* {
transition: unset !important;
}
body {
opacity: 0;
}
</style>
}
</head>
<body class="has-navbar-vertical-aside navbar-vertical-aside-show-xl">
@@if(layoutBuilder.extend.switcherSupport === true) {
<script src="@@autopath/assets/js/hs.theme-appearance.js"></script>
}
<!-- ========== HEADER ========== -->
@@include("@@autopath/partials/navbar/main.html", {
"category": "dashboards",
"subcategory": "",
"link": "index.html"
})
<!-- ========== END HEADER ========== -->
<!-- ========== MAIN CONTENT ========== -->
<main id="content" role="main" class="main">
<!-- Navbar Vertical -->
@@include("@@autopath/partials/sidebar/nav-tabs.html", {
"category": "dashboards",
"subcategory": "",
"link": "index.html"
})
<!-- End Navbar Vertical -->
<!-- Content -->
<div class="content container">
<div class="row justify-content-lg-center pt-lg-5 pt-xl-10">
<div class="col-lg-9">
<!-- Title -->
<div class="text-center">
<img class="img-fluid mb-5" src="@@autopath/assets/svg/layouts/demo-layouts-nav-tabs.svg" alt="Image Description" data-hs-theme-appearance="default" style="max-width: 15rem;">
<img class="img-fluid shadow-sm mb-5" src="@@autopath/assets/svg/layouts-light/demo-layouts-nav-tabs.svg" alt="Image Description" data-hs-theme-appearance="dark" style="max-width: 15rem;">
<h1>Nav tabs</h1>
<p>Customize your overview page layout. Choose the one that best fits your needs.</p>
<a class="btn btn-primary" href="@@autopath/layouts/index.html">Go back to Layouts</a>
</div>
<!-- End Title -->
</div>
</div>
<!-- End Row -->
</div>
<!-- End Content -->
<!-- Footer -->
@@include("@@autopath/partials/footer/main.html")
<!-- End Footer -->
</main>
<!-- ========== END MAIN CONTENT ========== -->
<!-- ========== SECONDARY CONTENTS ========== -->
<!-- Keyboard Shortcuts -->
@@include("@@autopath/partials/layouts-components/offcanvas-shortcuts.html")
<!-- End Keyboard Shortcuts -->
<!-- Activity -->
@@include("@@autopath/partials/layouts-components/offcanvas-activity.html")
<!-- End Activity -->
<!-- Welcome Message -->
@@include("@@autopath/partials/modals/welcome-message.html")
<!-- End Welcome Message -->
<!-- ========== END SECONDARY CONTENTS ========== -->
<!-- JS Global Compulsory @@deleteLine:build -->
<script src="@@autopath/node_modules/jquery/dist/jquery.min.js"></script>
<script src="@@autopath/node_modules/jquery-migrate/dist/jquery-migrate.min.js"></script>
<script src="@@autopath/node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<!-- JS Implementing Plugins -->
<!-- bundlejs:vendor [@@autopath] -->
<script src="@@autopath/assets/vendor/hs-navbar-vertical-aside/dist/hs-navbar-vertical-aside.min.js"></script>
<script src="@@autopath/assets/vendor/hs-form-search/dist/hs-form-search.min.js"></script>
<!-- JS Front -->
<!-- bundlejs:theme [@@autopath] -->
<script src="@@autopath/assets/js/hs.core.js"></script>
<script src="@@autopath/assets/js/hs.bs-dropdown.js"></script>
<!-- JS Plugins Init. -->
<script>
(function() {
// INITIALIZATION OF NAVBAR VERTICAL ASIDE
// =======================================================
new HSSideNav('.js-navbar-vertical-aside').init()
// INITIALIZATION OF BOOTSTRAP DROPDOWN
// =======================================================
HSBsDropdown.init()
// INITIALIZATION OF FORM SEARCH
// =======================================================
new HSFormSearch('.js-form-search')
})()
</script>
<!-- Style Switcher JS -->
@@if(layoutBuilder.extend.switcherSupport === true) {
@@include("@@autopath/partials/layouts-components/darkmode-switcher-js.html")
}
<!-- End Style Switcher JS -->
</body>
</html>

116
src/layouts/footer-default-container.html Normal file
View File

@@ -0,0 +1,116 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required Meta Tags Always Come First -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Title -->
<title>Main Footer (Container) | Front - Admin &amp; Dashboard Template</title>
<!-- Favicon -->
<link rel="shortcut icon" href="@@autopath/favicon.ico">
<!-- Font -->
<link href="@@vars.themeFont" rel="stylesheet">
<!-- CSS Implementing Plugins -->
<!-- bundlecss:vendor [@@autopath] -->
<link rel="stylesheet" href="@@autopath/node_modules/bootstrap-icons/font/bootstrap-icons.css">
<!-- CSS Front Template -->
<!-- bundlecss:theme [@@autopath] @@vars.version -->
@@if(layoutBuilder.extend.switcherSupport === false) {
<link rel="stylesheet" href="@@autopath/assets/css/theme@@if(themeAppearance.layoutSkin === 'dark'){-dark}.css">
}
@@if(layoutBuilder.extend.switcherSupport === true) {
<link rel="preload" href="@@autopath/assets/css/theme.css" data-hs-appearance="default" as="style">
<link rel="preload" href="@@autopath/assets/css/theme-dark.css" data-hs-appearance="dark" as="style">
<style data-hs-appearance-onload-styles>
* {
transition: unset !important;
}
body {
opacity: 0;
}
</style>
}
</head>
<body>
@@if(layoutBuilder.extend.switcherSupport === true) {
<script src="@@autopath/assets/js/hs.theme-appearance.js"></script>
}
<!-- ========== MAIN CONTENT ========== -->
<main id="content" role="main" class="main">
<!-- Content -->
<div class="content container-fluid">
<div class="row justify-content-lg-center pt-lg-5 pt-xl-10">
<div class="col-lg-9">
<!-- Title -->
<div class="text-center">
<img class="img-fluid mb-5" src="@@autopath/assets/svg/layouts/footer-default-container.svg" alt="Image Description" data-hs-theme-appearance="default" style="max-width: 15rem;">
<img class="img-fluid shadow-sm mb-5" src="@@autopath/assets/svg/layouts-light/footer-default-container.svg" alt="Image Description" data-hs-theme-appearance="dark" style="max-width: 15rem;">
<h1>Main Footer (Container)</h1>
<p>Customize your overview page layout. Choose the one that best fits your needs.</p>
<a class="btn btn-primary" href="@@autopath/layouts/index.html">Go back to Layouts</a>
</div>
<!-- End Title -->
</div>
</div>
<!-- End Row -->
</div>
<!-- End Content -->
<!-- Footer -->
@@include("@@autopath/partials/footer/container.html")
<!-- End Footer -->
</main>
<!-- ========== END MAIN CONTENT ========== -->
<!-- ========== SECONDARY CONTENTS ========== -->
<!-- Keyboard Shortcuts -->
@@include("@@autopath/partials/layouts-components/offcanvas-shortcuts.html")
<!-- End Keyboard Shortcuts -->
<!-- ========== END SECONDARY CONTENTS ========== -->
<!-- JS Global Compulsory @@deleteLine:build -->
<script src="@@autopath/node_modules/jquery/dist/jquery.min.js"></script>
<script src="@@autopath/node_modules/jquery-migrate/dist/jquery-migrate.min.js"></script>
<script src="@@autopath/node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<!-- JS Implementing Plugins -->
<!-- bundlejs:vendor [@@autopath] -->
<script src="@@autopath/assets/vendor/hs-form-search/dist/hs-form-search.min.js"></script>
<!-- JS Front -->
<!-- bundlejs:theme [@@autopath] -->
<script src="@@autopath/assets/js/hs.core.js"></script>
<script src="@@autopath/assets/js/hs.bs-dropdown.js"></script>
<!-- JS Plugins Init. -->
<script>
(function() {
// INITIALIZATION OF BOOTSTRAP DROPDOWN
// =======================================================
HSBsDropdown.init()
// INITIALIZATION OF FORM SEARCH
// =======================================================
new HSFormSearch('.js-form-search')
})()
</script>
<!-- Style Switcher JS -->
@@if(layoutBuilder.extend.switcherSupport === true) {
@@include("@@autopath/partials/layouts-components/darkmode-switcher-js.html")
}
<!-- End Style Switcher JS -->
</body>
</html>

129
src/layouts/header-default-container.html Normal file
View File

@@ -0,0 +1,129 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required Meta Tags Always Come First -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Title -->
<title>Default Header (Container) | Front - Admin &amp; Dashboard Template</title>
<!-- Favicon -->
<link rel="shortcut icon" href="@@autopath/favicon.ico">
<!-- Font -->
<link href="@@vars.themeFont" rel="stylesheet">
<!-- CSS Implementing Plugins -->
<!-- bundlecss:vendor [@@autopath] -->
<link rel="stylesheet" href="@@autopath/node_modules/bootstrap-icons/font/bootstrap-icons.css">
<link rel="stylesheet" href="@@autopath/assets/vendor/hs-mega-menu/dist/hs-mega-menu.min.css">
<!-- CSS Front Template -->
<!-- bundlecss:theme [@@autopath] @@vars.version -->
@@if(layoutBuilder.extend.switcherSupport === false) {
<link rel="stylesheet" href="@@autopath/assets/css/theme@@if(themeAppearance.layoutSkin === 'dark'){-dark}.css">
}
@@if(layoutBuilder.extend.switcherSupport === true) {
<link rel="preload" href="@@autopath/assets/css/theme.css" data-hs-appearance="default" as="style">
<link rel="preload" href="@@autopath/assets/css/theme-dark.css" data-hs-appearance="dark" as="style">
<style data-hs-appearance-onload-styles>
* {
transition: unset !important;
}
body {
opacity: 0;
}
</style>
}
</head>
<body>
@@if(layoutBuilder.extend.switcherSupport === true) {
<script src="@@autopath/assets/js/hs.theme-appearance.js"></script>
}
<!-- ========== HEADER ========== -->
@@include("@@autopath/partials/navbar/main-container.html", {
"category": "dashboards",
"subcategory": "",
"link": "index.html"
})
<!-- ========== END HEADER ========== -->
<!-- ========== MAIN CONTENT ========== -->
<main id="content" role="main" class="main">
<!-- Content -->
<div class="content container">
<div class="row justify-content-lg-center pt-lg-5 pt-xl-10">
<div class="col-lg-9">
<!-- Title -->
<div class="text-center">
<img class="img-fluid mb-5" src="@@autopath/assets/svg/layouts/header-default-container.svg" alt="Image Description" data-hs-theme-appearance="default" style="max-width: 15rem;">
<img class="img-fluid shadow-sm mb-5" src="@@autopath/assets/svg/layouts-light/header-default-container.svg" alt="Image Description" data-hs-theme-appearance="dark" style="max-width: 15rem;">
<h1>Main Header (Container)</h1>
<p>Customize your overview page layout. Choose the one that best fits your needs.</p>
<a class="btn btn-primary" href="@@autopath/layouts/index.html">Go back to Layouts</a>
</div>
<!-- End Title -->
</div>
</div>
<!-- End Row -->
</div>
<!-- End Content -->
</main>
<!-- ========== END MAIN CONTENT ========== -->
<!-- ========== SECONDARY CONTENTS ========== -->
<!-- Activity -->
@@include("@@autopath/partials/layouts-components/offcanvas-activity.html")
<!-- End Activity -->
<!-- Welcome Message -->
@@include("@@autopath/partials/modals/welcome-message.html")
<!-- End Welcome Message -->
<!-- ========== END SECONDARY CONTENTS ========== -->
<!-- JS Global Compulsory @@deleteLine:build -->
<script src="@@autopath/node_modules/jquery/dist/jquery.min.js"></script>
<script src="@@autopath/node_modules/jquery-migrate/dist/jquery-migrate.min.js"></script>
<script src="@@autopath/node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<!-- JS Implementing Plugins -->
<!-- bundlejs:vendor [@@autopath] -->
<script src="@@autopath/assets/vendor/hs-mega-menu/dist/hs-mega-menu.min.js"></script>
<!-- JS Front -->
<!-- bundlejs:theme [@@autopath] -->
<script src="@@autopath/assets/js/hs.core.js"></script>
<script src="@@autopath/assets/js/hs.bs-dropdown.js"></script>
<!-- JS Plugins Init. -->
<script>
(function() {
// INITIALIZATION OF BOOTSTRAP DROPDOWN
// =======================================================
HSBsDropdown.init()
// INITIALIZATION OF MEGA MENU
// =======================================================
new HSMegaMenu('.js-mega-menu', {
desktop: {
position: 'left'
}
})
})()
</script>
<!-- Style Switcher JS -->
@@if(layoutBuilder.extend.switcherSupport === true) {
@@include("@@autopath/partials/layouts-components/darkmode-switcher-js.html")
}
<!-- End Style Switcher JS -->
</body>
</html>

139
src/layouts/header-double-line-container.html Normal file
View File

@@ -0,0 +1,139 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required Meta Tags Always Come First -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Title -->
<title>Double Line Header (Container) | Front - Admin &amp; Dashboard Template</title>
<!-- Favicon -->
<link rel="shortcut icon" href="@@autopath/favicon.ico">
<!-- Font -->
<link href="@@vars.themeFont" rel="stylesheet">
<!-- CSS Implementing Plugins -->
<!-- bundlecss:vendor [@@autopath] -->
<link rel="stylesheet" href="@@autopath/node_modules/bootstrap-icons/font/bootstrap-icons.css">
<link rel="stylesheet" href="@@autopath/assets/vendor/hs-mega-menu/dist/hs-mega-menu.min.css">
<!-- CSS Front Template -->
<!-- bundlecss:theme [@@autopath] @@vars.version -->
@@if(layoutBuilder.extend.switcherSupport === false) {
<link rel="stylesheet" href="@@autopath/assets/css/theme@@if(themeAppearance.layoutSkin === 'dark'){-dark}.css">
}
@@if(layoutBuilder.extend.switcherSupport === true) {
<link rel="preload" href="@@autopath/assets/css/theme.css" data-hs-appearance="default" as="style">
<link rel="preload" href="@@autopath/assets/css/theme-dark.css" data-hs-appearance="dark" as="style">
<style data-hs-appearance-onload-styles>
* {
transition: unset !important;
}
body {
opacity: 0;
}
</style>
}
</head>
<body>
@@if(layoutBuilder.extend.switcherSupport === true) {
<script src="@@autopath/assets/js/hs.theme-appearance.js"></script>
}
<!-- ========== HEADER ========== -->
@@include("@@autopath/partials/navbar/double-line-container.html", {
"category": "dashboards",
"subcategory": "",
"link": "index.html"
})
<!-- ========== END HEADER ========== -->
<!-- ========== MAIN CONTENT ========== -->
<main id="content" role="main" class="main">
<!-- Content -->
<div class="content container">
<div class="row justify-content-lg-center pt-lg-5 pt-xl-10">
<div class="col-lg-9">
<!-- Title -->
<div class="text-center">
<img class="img-fluid mb-5" src="@@autopath/assets/svg/layouts/header-double-line-container.svg" alt="Image Description" data-hs-theme-appearance="default" style="max-width: 15rem;">
<img class="img-fluid shadow-sm mb-5" src="@@autopath/assets/svg/layouts-light/header-double-line-container.svg" alt="Image Description" data-hs-theme-appearance="dark" style="max-width: 15rem;">
<h1>Double line (Container)</h1>
<p>Customize your overview page layout. Choose the one that best fits your needs.</p>
<a class="btn btn-primary" href="@@autopath/layouts/index.html">Go back to Layouts</a>
</div>
<!-- End Title -->
</div>
</div>
<!-- End Row -->
</div>
<!-- End Content -->
</main>
<!-- ========== END MAIN CONTENT ========== -->
<!-- ========== SECONDARY CONTENTS ========== -->
<!-- Keyboard Shortcuts -->
@@include("@@autopath/partials/layouts-components/offcanvas-shortcuts.html")
<!-- End Keyboard Shortcuts -->
<!-- Activity -->
@@include("@@autopath/partials/layouts-components/offcanvas-activity.html")
<!-- End Activity -->
<!-- Welcome Message -->
@@include("@@autopath/partials/modals/welcome-message.html")
<!-- End Welcome Message -->
<!-- ========== END SECONDARY CONTENTS ========== -->
<!-- JS Global Compulsory @@deleteLine:build -->
<script src="@@autopath/node_modules/jquery/dist/jquery.min.js"></script>
<script src="@@autopath/node_modules/jquery-migrate/dist/jquery-migrate.min.js"></script>
<script src="@@autopath/node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<!-- JS Implementing Plugins -->
<!-- bundlejs:vendor [@@autopath] -->
<script src="@@autopath/assets/vendor/hs-mega-menu/dist/hs-mega-menu.min.js"></script>
<script src="@@autopath/assets/vendor/hs-form-search/dist/hs-form-search.min.js"></script>
<!-- JS Front -->
<!-- bundlejs:theme [@@autopath] -->
<script src="@@autopath/assets/js/hs.core.js"></script>
<script src="@@autopath/assets/js/hs.bs-dropdown.js"></script>
<!-- JS Plugins Init. -->
<script>
(function() {
// INITIALIZATION OF BOOTSTRAP DROPDOWN
// =======================================================
HSBsDropdown.init()
// INITIALIZATION OF MEGA MENU
// =======================================================
new HSMegaMenu('.js-mega-menu', {
desktop: {
position: 'left'
}
})
// INITIALIZATION OF FORM SEARCH
// =======================================================
new HSFormSearch('.js-form-search')
})()
</script>
<!-- Style Switcher JS -->
@@if(layoutBuilder.extend.switcherSupport === true) {
@@include("@@autopath/partials/layouts-components/darkmode-switcher-js.html")
}
<!-- End Style Switcher JS -->
</body>
</html>

390
src/layouts/index.html Normal file
View File

@@ -0,0 +1,390 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required Meta Tags Always Come First -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Title -->
<title>Layouts | Front - Admin &amp; Dashboard Template</title>
<!-- Favicon -->
<link rel="shortcut icon" href="@@autopath/favicon.ico">
<!-- Font -->
<link href="@@vars.themeFont" rel="stylesheet">
<!-- CSS Implementing Plugins -->
<!-- bundlecss:vendor [@@autopath] -->
<link rel="stylesheet" href="@@autopath/node_modules/bootstrap-icons/font/bootstrap-icons.css">
<!-- CSS Front Template -->
<!-- bundlecss:theme [@@autopath] @@vars.version -->
@@if(layoutBuilder.extend.switcherSupport === false) {
<link rel="stylesheet" href="@@autopath/assets/css/theme@@if(themeAppearance.layoutSkin === 'dark'){-dark}.css">
}
@@if(layoutBuilder.extend.switcherSupport === true) {
<link rel="preload" href="@@autopath/assets/css/theme.css" data-hs-appearance="default" as="style">
<link rel="preload" href="@@autopath/assets/css/theme-dark.css" data-hs-appearance="dark" as="style">
<style data-hs-appearance-onload-styles>
* {
transition: unset !important;
}
body {
opacity: 0;
}
</style>
}
</head>
<body class="@@if(layoutBuilder.header.layoutMode === 'default'){has-navbar-vertical-aside navbar-vertical-aside-show-xl} @@if(layoutBuilder.sidebarLayout === 'compact'){navbar-vertical-aside-compact-mode navbar-vertical-aside-compact-mini-mode} @@if(layoutBuilder.sidebarLayout === 'mini'){navbar-vertical-aside-mini-mode} footer-offset">
@@if(layoutBuilder.extend.switcherSupport === true) {
<script src="@@autopath/assets/js/hs.theme-appearance.js"></script>
}
<!-- ========== HEADER ========== -->
@@include("@@autopath/partials/navbar/main.html")
<!-- ========== END HEADER ========== -->
<!-- ========== MAIN CONTENT ========== -->
<!-- Navbar Vertical -->
@@include("@@autopath/partials/sidebar/main.html", {
"category": "dashboards",
"subcategory": "",
"link": "index.html"
})
<!-- End Navbar Vertical -->
<main id="content" role="main" class="main">
<!-- Content -->
<div class="content @@layoutBuilder.header.containerMode">
<div class="row justify-content-lg-center pt-lg-5 pt-xl-10">
<div class="col-lg-9 col-xl-8">
<!-- Title -->
<div class="text-center mb-7">
<h1 class="display-4">Layouts</h1>
<p>Customize your overview page layout. Choose the one that best fits your needs.</p>
</div>
<!-- End Title -->
<span class="divider-center">Demo layouts</span>
<div class="row my-5 mb-lg-7">
<div class="col-sm-6 col-lg-4 mb-3 mb-lg-5">
<!-- Card -->
<a class="d-block card-transition mb-3" href="@@autopath/layouts/demo-layouts-default-classic.html">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts/demo-layouts-default-classic.svg" alt="Image Description" data-hs-theme-appearance="default">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts-light/demo-layouts-default-classic.svg" alt="Image Description" data-hs-theme-appearance="dark">
</a>
<div class="text-center">
<h5 class="mb-0">Default <span>(Classic)</span></h5>
</div>
<!-- End Card -->
</div>
<div class="col-sm-6 col-lg-4 mb-3 mb-lg-5">
<!-- Card -->
<a class="d-block card-transition mb-3" href="@@autopath/layouts/demo-layouts-nav-tabs.html">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts/demo-layouts-nav-tabs.svg" alt="Image Description" data-hs-theme-appearance="default">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts-light/demo-layouts-nav-tabs.svg" alt="Image Description" data-hs-theme-appearance="dark">
</a>
<div class="text-center">
<h5 class="mb-0">Nav Tabs</h5>
</div>
<!-- End Card -->
</div>
</div>
<!-- End Row -->
<span class="divider-center">Header</span>
<div class="row my-5 mb-lg-7">
<div class="col-sm-6 col-lg-4 mb-3 mb-lg-5">
<!-- Card -->
<a class="d-block card-transition mb-3" href="@@autopath/layouts/header-default-container.html">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts/header-default-container.svg" alt="Image Description" data-hs-theme-appearance="default">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts-light/header-default-container.svg" alt="Image Description" data-hs-theme-appearance="dark">
</a>
<div class="text-center">
<h5 class="mb-0">Default</h5>
</div>
<!-- End Card -->
</div>
<div class="col-sm-6 col-lg-4 mb-3 mb-lg-5">
<!-- Card -->
<a class="d-block card-transition mb-3" href="@@autopath/layouts/header-double-line-container.html">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts/header-double-line-container.svg" alt="Image Description" data-hs-theme-appearance="default">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts-light/header-double-line-container.svg" alt="Image Description" data-hs-theme-appearance="dark">
</a>
<div class="text-center">
<h5 class="mb-0">Double line</h5>
</div>
<!-- End Card -->
</div>
</div>
<!-- End Row -->
<span class="divider-center">Sidebar</span>
<div class="row my-5 mb-lg-7">
<div class="col-sm-6 col-lg-4 mb-3 mb-lg-5">
<!-- Card -->
<a class="d-block card-transition mb-3" href="@@autopath/layouts/sidebar-default-classic.html">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts/sidebar-default-classic.svg" alt="Image Description" data-hs-theme-appearance="default">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts-light/sidebar-default-classic.svg" alt="Image Description" data-hs-theme-appearance="dark">
</a>
<div class="text-center">
<h5 class="mb-0">Default <span class="text-body">(Classic)</span></h5>
</div>
<!-- End Card -->
</div>
<div class="col-sm-6 col-lg-4 mb-3 mb-lg-5">
<!-- Card -->
<a class="d-block card-transition mb-3" href="@@autopath/layouts/sidebar-compact.html">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts/sidebar-compact.svg" alt="Image Description" data-hs-theme-appearance="default">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts-light/sidebar-compact.svg" alt="Image Description" data-hs-theme-appearance="dark">
</a>
<div class="text-center">
<h5 class="mb-0">Compact</h5>
</div>
<!-- End Card -->
</div>
<div class="col-sm-6 col-lg-4 mb-3 mb-lg-5">
<!-- Card -->
<a class="d-block card-transition mb-3" href="@@autopath/layouts/sidebar-mini.html">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts/sidebar-mini.svg" alt="Image Description" data-hs-theme-appearance="default">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts-light/sidebar-mini.svg" alt="Image Description" data-hs-theme-appearance="dark">
</a>
<div class="text-center">
<h5 class="mb-0">Mini</h5>
</div>
<!-- End Card -->
</div>
</div>
<!-- End Row -->
<span class="divider-center">Sidebar Combinations</span>
<div class="row my-5 mb-lg-7">
<div class="col-sm-6 col-lg-4 mb-3 mb-lg-5">
<!-- Card -->
<a class="d-block card-transition mb-3" href="@@autopath/layouts/sidebar-combinations-mini-plus-one-cols.html">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts/sidebar-combinations-mini-plus-one-cols.svg" alt="Image Description" data-hs-theme-appearance="default">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts-light/sidebar-combinations-mini-plus-one-cols.svg" alt="Image Description" data-hs-theme-appearance="dark">
</a>
<div class="text-center">
<h5 class="mb-0">Mini + one columns</h5>
</div>
<!-- End Card -->
</div>
<div class="col-sm-6 col-lg-4 mb-3 mb-lg-5">
<!-- Card -->
<a class="d-block card-transition mb-3" href="@@autopath/layouts/sidebar-combinations-two-cols.html">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts/sidebar-combinations-two-cols.svg" alt="Image Description" data-hs-theme-appearance="default">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts-light/sidebar-combinations-two-cols.svg" alt="Image Description" data-hs-theme-appearance="dark">
</a>
<div class="text-center">
<h5 class="mb-0">Two columns</h5>
</div>
<!-- End Card -->
</div>
<div class="col-sm-6 col-lg-4 mb-3 mb-lg-5">
<!-- Card -->
<a class="d-block card-transition mb-3" href="@@autopath/layouts/sidebar-combinations-two-plus-mini-cols.html">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts/sidebar-combinations-two-plus-mini-cols.svg" alt="Image Description" data-hs-theme-appearance="default">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts-light/sidebar-combinations-two-plus-mini-cols.svg" alt="Image Description" data-hs-theme-appearance="dark">
</a>
<div class="text-center">
<h5 class="mb-0">Two + mini columns</h5>
</div>
<!-- End Card -->
</div>
<div class="col-sm-6 col-lg-4 mb-3 mb-lg-5">
<!-- Card -->
<a class="d-block card-transition mb-3" href="@@autopath/layouts/sidebar-combinations-two-cols-between.html">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts/sidebar-combinations-two-cols-between.svg" alt="Image Description" data-hs-theme-appearance="default">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts-light/sidebar-combinations-two-cols-between.svg" alt="Image Description" data-hs-theme-appearance="dark">
</a>
<div class="text-center">
<h5 class="mb-0">Two columns between</h5>
</div>
<!-- End Card -->
</div>
</div>
<!-- End Row -->
<span class="divider-center">Sidebar Detached</span>
<div class="row my-5 mb-lg-7">
<div class="col-sm-6 col-lg-4 mb-3 mb-lg-5">
<!-- Card -->
<a class="d-block card-transition mb-3" href="@@autopath/layouts/sidebar-detached-container.html">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts/sidebar-detached-container.svg" alt="Image Description" data-hs-theme-appearance="default">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts-light/sidebar-detached-container.svg" alt="Image Description" data-hs-theme-appearance="dark">
</a>
<div class="text-center">
<h5 class="mb-0">Container</h5>
</div>
<!-- End Card -->
</div>
<div class="col-sm-6 col-lg-4 mb-3 mb-lg-5">
<!-- Card -->
<a class="d-block card-transition mb-3" href="@@autopath/layouts/sidebar-detached-overlay-container.html">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts/sidebar-detached-overlay-container.svg" alt="Image Description" data-hs-theme-appearance="default">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts-light/sidebar-detached-overlay-container.svg" alt="Image Description" data-hs-theme-appearance="dark">
</a>
<div class="text-center">
<h5 class="mb-0">Overlay</h5>
</div>
<!-- End Card -->
</div>
</div>
<!-- End Row -->
<span class="divider-center">Content Combinations</span>
<div class="row my-5 mb-lg-7">
<div class="col-sm-6 col-lg-4 mb-3 mb-lg-5">
<!-- Card -->
<a class="d-block card-transition mb-3" href="@@autopath/layouts/content-combinations-content-centered.html">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts/content-combinations-content-centered.svg" alt="Image Description" data-hs-theme-appearance="default">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts-light/content-combinations-content-centered.svg" alt="Image Description" data-hs-theme-appearance="dark">
</a>
<div class="text-center">
<h5 class="mb-0">Medium content centered</h5>
</div>
<!-- End Card -->
</div>
<div class="col-sm-6 col-lg-4 mb-3 mb-lg-5">
<!-- Card -->
<a class="d-block card-transition mb-3" href="@@autopath/layouts/content-combinations-overlay.html">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts/content-combinations-overlay.svg" alt="Image Description" data-hs-theme-appearance="default">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts-light/content-combinations-overlay.svg" alt="Image Description" data-hs-theme-appearance="dark">
</a>
<div class="text-center">
<h5 class="mb-0">Overlay</h5>
</div>
<!-- End Card -->
</div>
<div class="col-sm-6 col-lg-4 mb-3 mb-lg-5">
<!-- Card -->
<a class="d-block card-transition mb-3" href="@@autopath/layouts/content-combinations-container-overlay.html">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts/content-combinations-container-overlay.svg" alt="Image Description" data-hs-theme-appearance="default">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts-light/content-combinations-container-overlay.svg" alt="Image Description" data-hs-theme-appearance="dark">
</a>
<div class="text-center">
<h5 class="mb-0">Container Overlay</h5>
</div>
<!-- End Card -->
</div>
</div>
<!-- End Row -->
<span class="divider-center">Footer</span>
<div class="row mt-5">
<div class="col-sm-6 col-lg-4">
<!-- Card -->
<a class="d-block card-transition mb-3" href="@@autopath/layouts/footer-default-container.html">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts/footer-default-container.svg" alt="Image Description" data-hs-theme-appearance="default">
<img class="img-fluid w-100" src="@@autopath/assets/svg/layouts-light/footer-default-container.svg" alt="Image Description" data-hs-theme-appearance="dark">
</a>
<div class="text-center">
<h5 class="mb-0">Default</h5>
</div>
<!-- End Card -->
</div>
</div>
<!-- End Row -->
</div>
</div>
<!-- End Row -->
</div>
<!-- End Content -->
</main>
<!-- ========== END MAIN CONTENT ========== -->
<!-- ========== SECONDARY CONTENTS ========== -->
<!-- Keyboard Shortcuts -->
@@include("@@autopath/partials/layouts-components/offcanvas-shortcuts.html")
<!-- End Keyboard Shortcuts -->
<!-- Activity -->
@@include("@@autopath/partials/layouts-components/offcanvas-activity.html")
<!-- End Activity -->
<!-- Welcome Message -->
@@include("@@autopath/partials/modals/welcome-message.html")
<!-- End Welcome Message -->
<!-- ========== END SECONDARY CONTENTS ========== -->
<!-- JS Global Compulsory @@deleteLine:build -->
<script src="@@autopath/node_modules/jquery/dist/jquery.min.js"></script>
<script src="@@autopath/node_modules/jquery-migrate/dist/jquery-migrate.min.js"></script>
<script src="@@autopath/node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<!-- JS Implementing Plugins -->
<!-- bundlejs:vendor [@@autopath] -->
<script src="@@autopath/assets/vendor/hs-navbar-vertical-aside/dist/hs-navbar-vertical-aside.min.js"></script>
<script src="@@autopath/assets/vendor/hs-form-search/dist/hs-form-search.min.js"></script>
<!-- JS Front -->
<!-- bundlejs:theme [@@autopath] -->
<script src="@@autopath/assets/js/hs.core.js"></script>
<script src="@@autopath/assets/js/hs.bs-dropdown.js"></script>
<!-- JS Plugins Init. -->
<script>
(function() {
// INITIALIZATION OF NAVBAR VERTICAL ASIDE
// =======================================================
new HSSideNav('.js-navbar-vertical-aside').init()
// INITIALIZATION OF FORM SEARCH
// =======================================================
new HSFormSearch('.js-form-search')
// INITIALIZATION OF BOOTSTRAP DROPDOWN
// =======================================================
HSBsDropdown.init()
})()
</script>
<!-- Style Switcher JS -->
@@if(layoutBuilder.extend.switcherSupport === true) {
@@include("@@autopath/partials/layouts-components/darkmode-switcher-js.html")
}
<!-- End Style Switcher JS -->
</body>
</html>

141
src/layouts/sidebar-combinations-mini-plus-one-cols.html Normal file
View File

@@ -0,0 +1,141 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required Meta Tags Always Come First -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Title -->
<title>Mini + One Columns - Sidebar Combinations | Front - Admin &amp; Dashboard Template</title>
<!-- Favicon -->
<link rel="shortcut icon" href="@@autopath/favicon.ico">
<!-- Font -->
<link href="@@vars.themeFont" rel="stylesheet">
<!-- CSS Implementing Plugins -->
<!-- bundlecss:vendor [@@autopath] -->
<link rel="stylesheet" href="@@autopath/node_modules/bootstrap-icons/font/bootstrap-icons.css">
<!-- CSS Front Template -->
<!-- bundlecss:theme [@@autopath] @@vars.version -->
@@if(layoutBuilder.extend.switcherSupport === false) {
<link rel="stylesheet" href="@@autopath/assets/css/theme@@if(themeAppearance.layoutSkin === 'dark'){-dark}.css">
}
@@if(layoutBuilder.extend.switcherSupport === true) {
<link rel="preload" href="@@autopath/assets/css/theme.css" data-hs-appearance="default" as="style">
<link rel="preload" href="@@autopath/assets/css/theme-dark.css" data-hs-appearance="dark" as="style">
<style data-hs-appearance-onload-styles>
* {
transition: unset !important;
}
body {
opacity: 0;
}
</style>
}
</head>
<body class="has-navbar-vertical-aside navbar-vertical-aside-show-xl navbar-vertical-aside-closed-mode splitted-content">
@@if(layoutBuilder.extend.switcherSupport === true) {
<script src="@@autopath/assets/js/hs.theme-appearance.js"></script>
}
<!-- ========== MAIN CONTENT ========== -->
<!-- Navbar Vertical -->
@@include("@@autopath/partials/sidebar/splitted-content.html", {
"category": "dashboards",
"subcategory": "",
"link": "index.html",
"compact": "layouts.html"
})
<!-- End Navbar Vertical -->
<main id="content" role="main" class="main splitted-content-main">
<!-- Fluid Content -->
<div class="splitted-content-fluid content-space">
<!-- Navbar Vertical Toggle -->
<div class="d-flex d-xl-none justify-content-end">
<button type="button" class="js-navbar-vertical-aside-toggle-invoker navbar-aside-toggler position-static">
<i class="bi-arrow-bar-left navbar-toggler-short-align" data-bs-toggle="tooltip" data-bs-placement="right" title="Collapse"></i>
<i class="bi-arrow-bar-right navbar-toggler-full-align" data-bs-template='<div class="tooltip d-none d-sm-block" role="tooltip"><div class="arrow"></div><div class="tooltip-inner"></div></div>' data-bs-toggle="tooltip" data-bs-placement="right" title="Expand"></i>
</button>
</div>
<!-- End Navbar Vertical Toggle -->
<div class="mt-xl-10">
<!-- Title -->
<div class="text-center">
<img class="img-fluid mb-5" src="@@autopath/assets/svg/layouts/sidebar-combinations-mini-plus-one-cols.svg" alt="Image Description" data-hs-theme-appearance="default" style="max-width: 15rem;">
<img class="img-fluid shadow-sm mb-5" src="@@autopath/assets/svg/layouts-light/sidebar-combinations-mini-plus-one-cols.svg" alt="Image Description" data-hs-theme-appearance="dark" style="max-width: 15rem;">
<h1>Mini + One Columns - Sidebar Combinations</h1>
<p>Customize your overview page layout. Choose the one that best fits your needs.</p>
<a class="btn btn-primary" href="@@autopath/layouts/index.html">Go back to Layouts</a>
</div>
<!-- End Title -->
</div>
</div>
<!-- End Fluid Content -->
</main>
<!-- ========== END MAIN CONTENT ========== -->
<!-- ========== SECONDARY CONTENTS ========== -->
<!-- Keyboard Shortcuts -->
@@include("@@autopath/partials/layouts-components/offcanvas-shortcuts.html")
<!-- End Keyboard Shortcuts -->
<!-- Activity -->
@@include("@@autopath/partials/layouts-components/offcanvas-activity.html")
<!-- End Activity -->
<!-- Welcome Message Modal -->
@@include("@@autopath/partials/modals/welcome-message.html")
<!-- End Welcome Message Modal -->
<!-- ========== END SECONDARY CONTENTS ========== -->
<!-- JS Global Compulsory @@deleteLine:build -->
<script src="@@autopath/node_modules/jquery/dist/jquery.min.js"></script>
<script src="@@autopath/node_modules/jquery-migrate/dist/jquery-migrate.min.js"></script>
<script src="@@autopath/node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<!-- JS Implementing Plugins -->
<!-- bundlejs:vendor [@@autopath] -->
<script src="@@autopath/assets/vendor/hs-navbar-vertical-aside/dist/hs-navbar-vertical-aside.min.js"></script>
<script src="@@autopath/assets/vendor/hs-form-search/dist/hs-form-search.min.js"></script>
<!-- JS Front -->
<!-- bundlejs:theme [@@autopath] -->
<script src="@@autopath/assets/js/hs.core.js"></script>
<script src="@@autopath/assets/js/hs.bs-dropdown.js"></script>
<!-- JS Plugins Init. -->
<script>
(function() {
// INITIALIZATION OF NAVBAR VERTICAL ASIDE
// =======================================================
new HSSideNav('.js-navbar-vertical-aside').init()
// INITIALIZATION OF FORM SEARCH
// =======================================================
new HSFormSearch('.js-form-search')
// INITIALIZATION OF BOOTSTRAP DROPDOWN
// =======================================================
HSBsDropdown.init()
})()
</script>
<!-- Style Switcher JS -->
@@if(layoutBuilder.extend.switcherSupport === true) {
@@include("@@autopath/partials/layouts-components/darkmode-switcher-js.html")
}
<!-- End Style Switcher JS -->
</body>
</html>

202
src/layouts/sidebar-combinations-two-cols-between.html Normal file
View File

@@ -0,0 +1,202 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required Meta Tags Always Come First -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Title -->
<title>Two Columns Between - Sidebar Combinations | Front - Admin &amp; Dashboard Template</title>
<!-- Favicon -->
<link rel="shortcut icon" href="@@autopath/favicon.ico">
<!-- Font -->
<link href="@@vars.themeFont" rel="stylesheet">
<!-- CSS Implementing Plugins -->
<!-- bundlecss:vendor [@@autopath] -->
<link rel="stylesheet" href="@@autopath/node_modules/bootstrap-icons/font/bootstrap-icons.css">
<!-- CSS Front Template -->
<!-- bundlecss:theme [@@autopath] @@vars.version -->
@@if(layoutBuilder.extend.switcherSupport === false) {
<link rel="stylesheet" href="@@autopath/assets/css/theme@@if(themeAppearance.layoutSkin === 'dark'){-dark}.css">
}
@@if(layoutBuilder.extend.switcherSupport === true) {
<link rel="preload" href="@@autopath/assets/css/theme.css" data-hs-appearance="default" as="style">
<link rel="preload" href="@@autopath/assets/css/theme-dark.css" data-hs-appearance="dark" as="style">
<style data-hs-appearance-onload-styles>
* {
transition: unset !important;
}
body {
opacity: 0;
}
</style>
}
</head>
<body class="has-navbar-vertical-aside navbar-vertical-aside-show-xl navbar-vertical-aside-closed-mode">
@@if(layoutBuilder.extend.switcherSupport === true) {
<script src="@@autopath/assets/js/hs.theme-appearance.js"></script>
}
<!-- ========== MAIN CONTENT ========== -->
<!-- Navbar Vertical -->
@@include("@@autopath/partials/sidebar/main-no-navbar-toggler.html", {
"category": "dashboards",
"subcategory": "",
"link": "index.html"
})
<!-- End Navbar Vertical -->
<main id="content" role="main" class="main splitted-content-main">
<!-- Fluid Content -->
<div class="splitted-content-fluid content-space">
<!-- Toggles -->
<div class="d-flex d-xl-none justify-content-end mt-3 me-3">
<ul class="list-inline">
<li class="list-inline-item">
<!-- Offcanvas Toggle -->
<button class="navbar-toggler splitted-content-toggle" type="button" data-bs-toggle="offcanvas" data-bs-target="#splittedOffcanvasContent" aria-controls="splittedOffcanvasContent">
<span class="navbar-toggler-default">
<i class="bi-list"></i>
</span>
<span class="navbar-toggler-toggled">
<i class="bi-x"></i>
</span>
</button>
<!-- End Offcanvas Toggle -->
</li>
<li class="list-inline-item">
<!-- Navbar Vertical Toggle -->
<button type="button" class="js-navbar-vertical-aside-toggle-invoker navbar-aside-toggler position-static">
<i class="bi-arrow-bar-left navbar-toggler-short-align" data-bs-toggle="tooltip" data-bs-placement="right" title="Collapse"></i>
<i class="bi-arrow-bar-right navbar-toggler-full-align" data-bs-template='<div class="tooltip d-none d-sm-block" role="tooltip"><div class="arrow"></div><div class="tooltip-inner"></div></div>' data-bs-toggle="tooltip" data-bs-placement="right" title="Expand"></i>
</button>
<!-- End Navbar Vertical Toggle -->
</li>
</ul>
</div>
<!-- End Toggles -->
<div class="mt-xl-10">
<!-- Title -->
<div class="text-center">
<img class="img-fluid mb-5" src="@@autopath/assets/svg/layouts/sidebar-combinations-two-cols.svg" alt="Image Description" data-hs-theme-appearance="default" style="max-width: 15rem;">
<img class="img-fluid shadow-sm mb-5" src="@@autopath/assets/svg/layouts-light/sidebar-combinations-two-cols.svg" alt="Image Description" data-hs-theme-appearance="dark" style="max-width: 15rem;">
<h1>Two Columns - Sidebar Combinations</h1>
<p>Customize your overview page layout. Choose the one that best fits your needs.</p>
<a class="btn btn-primary" href="@@autopath/layouts/index.html">Go back to Layouts</a>
</div>
<!-- End Title -->
</div>
</div>
<!-- End Fluid Content -->
<!-- Offcanvas Content -->
<div class="offcanvas offcanvas-start splitted-content-small splitted-content-bordered d-flex flex-column" tabindex="-1" id="splittedOffcanvasContent">
<div class="offcanvas-body">
<div class="d-flex justify-content-center flex-column align-items-center h-100 py-10 py-xl-0">
<img class="avatar avatar-xxl mb-3" src="@@autopath/assets/svg/illustrations/oc-megaphone.svg" alt="Image Description" data-hs-theme-appearance="default">
<img class="avatar avatar-xxl mb-3" src="@@autopath/assets/svg/illustrations-light/oc-megaphone.svg" alt="Image Description" data-hs-theme-appearance="dark">
<p class="card-text">No data to show</p>
<a class="btn btn-sm btn-white" href="@@autopath/index.html">Get Started</a>
</div>
</div>
</div>
<!-- End Offcanvas Content -->
</main>
<!-- ========== END MAIN CONTENT ========== -->
<!-- ========== SECONDARY CONTENTS ========== -->
<!-- Keyboard Shortcuts -->
@@include("@@autopath/partials/layouts-components/offcanvas-shortcuts.html")
<!-- End Keyboard Shortcuts -->
<!-- Activity -->
@@include("@@autopath/partials/layouts-components/offcanvas-activity.html")
<!-- End Activity -->
<!-- Welcome Message Modal -->
@@include("@@autopath/partials/modals/welcome-message.html")
<!-- End Welcome Message Modal -->
<!-- ========== END SECONDARY CONTENTS ========== -->
<!-- JS Global Compulsory @@deleteLine:build -->
<script src="@@autopath/node_modules/jquery/dist/jquery.min.js"></script>
<script src="@@autopath/node_modules/jquery-migrate/dist/jquery-migrate.min.js"></script>
<script src="@@autopath/node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<!-- JS Implementing Plugins -->
<!-- bundlejs:vendor [@@autopath] -->
<script src="@@autopath/assets/vendor/hs-navbar-vertical-aside/dist/hs-navbar-vertical-aside.min.js"></script>
<script src="@@autopath/assets/vendor/hs-form-search/dist/hs-form-search.min.js"></script>
<!-- JS Front -->
<!-- bundlejs:theme [@@autopath] -->
<script src="@@autopath/assets/js/hs.core.js"></script>
<script src="@@autopath/assets/js/hs.bs-dropdown.js"></script>
<!-- JS Plugins Init. -->
<script>
(function() {
// INITIALIZATION OF NAVBAR VERTICAL ASIDE
// =======================================================
new HSSideNav('.js-navbar-vertical-aside').init()
// INITIALIZATION OF FORM SEARCH
// =======================================================
new HSFormSearch('.js-form-search')
// INITIALIZATION OF BOOTSTRAP DROPDOWN
// =======================================================
HSBsDropdown.init()
// INITIALIZATION OF SIDEBAR COMBINATIONS WITH OFFCANVAS
// =======================================================
const offcanvasInstance = new bootstrap.Offcanvas(document.querySelector('.offcanvas-start'))
const defaultTransition = window.getComputedStyle(offcanvasInstance._element).getPropertyValue('transition')
window.addEventListener('resize', function (e) {
if (window.innerWidth > 1200) {
if (offcanvasInstance._element.style.transition !== 'none 0s ease 0s' ) {
offcanvasInstance._element.style.transition = 'none'
}
// Reset offcanvas states
if (offcanvasInstance._isShown) {
offcanvasInstance._element.classList.remove('show')
offcanvasInstance._backdrop._element.remove()
offcanvasInstance._isShown = false
offcanvasInstance._backdrop._isAppended = false
}
// Show offcanvas if hidden on desktop
if (offcanvasInstance._element.style.visibility === 'hidden') {
offcanvasInstance._element.style.visibility = 'visible'
}
} else {
if (offcanvasInstance._element.style.transition === 'none 0s ease 0s' ) {
offcanvasInstance._element.style.removeProperty('transition')
}
}
})
})()
</script>
<!-- Style Switcher JS -->
@@if(layoutBuilder.extend.switcherSupport === true) {
@@include("@@autopath/partials/layouts-components/darkmode-switcher-js.html")
}
<!-- End Style Switcher JS -->
</body>
</html>

201
src/layouts/sidebar-combinations-two-cols.html Normal file
View File

@@ -0,0 +1,201 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required Meta Tags Always Come First -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Title -->
<title>Two Columns - Sidebar Combinations | Front - Admin &amp; Dashboard Template</title>
<!-- Favicon -->
<link rel="shortcut icon" href="@@autopath/favicon.ico">
<!-- Font -->
<link href="@@vars.themeFont" rel="stylesheet">
<!-- CSS Implementing Plugins -->
<!-- bundlecss:vendor [@@autopath] -->
<link rel="stylesheet" href="@@autopath/node_modules/bootstrap-icons/font/bootstrap-icons.css">
<!-- CSS Front Template -->
<!-- bundlecss:theme [@@autopath] @@vars.version -->
@@if(layoutBuilder.extend.switcherSupport === false) {
<link rel="stylesheet" href="@@autopath/assets/css/theme@@if(themeAppearance.layoutSkin === 'dark'){-dark}.css">
}
@@if(layoutBuilder.extend.switcherSupport === true) {
<link rel="preload" href="@@autopath/assets/css/theme.css" data-hs-appearance="default" as="style">
<link rel="preload" href="@@autopath/assets/css/theme-dark.css" data-hs-appearance="dark" as="style">
<style data-hs-appearance-onload-styles>
* {
transition: unset !important;
}
body {
opacity: 0;
}
</style>
}
</head>
<body class="has-navbar-vertical-aside navbar-vertical-aside-show-xl">
@@if(layoutBuilder.extend.switcherSupport === true) {
<script src="@@autopath/assets/js/hs.theme-appearance.js"></script>
}
<!-- ========== MAIN CONTENT ========== -->
<!-- Navbar Vertical -->
@@include("@@autopath/partials/sidebar/main-no-navbar-toggler.html", {
"category": "dashboards",
"subcategory": "",
"link": "index.html"
})
<!-- End Navbar Vertical -->
<main id="content" role="main" class="main splitted-content-main">
<!-- Offcanvas Content -->
<div class="js-offcanvas-start offcanvas offcanvas-start splitted-content-small splitted-content-bordered d-flex flex-column" tabindex="-1" id="splittedOffcanvasContent">
<div class="offcanvas-body">
<div class="d-flex justify-content-center flex-column align-items-center h-100 py-10 py-xl-0">
<img class="avatar avatar-xxl mb-3" src="@@autopath/assets/svg/illustrations/oc-megaphone.svg" alt="Image Description" data-hs-theme-appearance="default">
<img class="avatar avatar-xxl mb-3" src="@@autopath/assets/svg/illustrations-light/oc-megaphone.svg" alt="Image Description" data-hs-theme-appearance="dark">
<p class="card-text">No data to show</p>
<a class="btn btn-sm btn-white" href="@@autopath/index.html">Get Started</a>
</div>
</div>
</div>
<!-- End Offcanvas Content -->
<!-- Fluid Content -->
<div class="splitted-content-fluid content-space">
<!-- Toggles -->
<div class="d-flex d-xl-none justify-content-end mt-3 me-3">
<ul class="list-inline">
<li class="list-inline-item">
<!-- Offcanvas Toggle -->
<button class="navbar-toggler splitted-content-toggle" type="button" data-bs-toggle="offcanvas" data-bs-target="#splittedOffcanvasContent" aria-controls="splittedOffcanvasContent">
<span class="navbar-toggler-default">
<i class="bi-list"></i>
</span>
<span class="navbar-toggler-toggled">
<i class="bi-x"></i>
</span>
</button>
<!-- End Offcanvas Toggle -->
</li>
<li class="list-inline-item">
<!-- Navbar Vertical Toggle -->
<button type="button" class="js-navbar-vertical-aside-toggle-invoker navbar-aside-toggler position-static">
<i class="bi-arrow-bar-left navbar-toggler-short-align" data-bs-toggle="tooltip" data-bs-placement="right" title="Collapse"></i>
<i class="bi-arrow-bar-right navbar-toggler-full-align" data-bs-template='<div class="tooltip d-none d-sm-block" role="tooltip"><div class="arrow"></div><div class="tooltip-inner"></div></div>' data-bs-toggle="tooltip" data-bs-placement="right" title="Expand"></i>
</button>
<!-- End Navbar Vertical Toggle -->
</li>
</ul>
</div>
<!-- End Toggles -->
<div class="mt-xl-10">
<!-- Title -->
<div class="text-center">
<img class="img-fluid mb-5" src="@@autopath/assets/svg/layouts/sidebar-combinations-two-cols.svg" alt="Image Description" data-hs-theme-appearance="default" style="max-width: 15rem;">
<img class="img-fluid shadow-sm mb-5" src="@@autopath/assets/svg/layouts-light/sidebar-combinations-two-cols.svg" alt="Image Description" data-hs-theme-appearance="dark" style="max-width: 15rem;">
<h1>Two Columns - Sidebar Combinations</h1>
<p>Customize your overview page layout. Choose the one that best fits your needs.</p>
<a class="btn btn-primary" href="@@autopath/layouts/index.html">Go back to Layouts</a>
</div>
<!-- End Title -->
</div>
</div>
<!-- End Fluid Content -->
</main>
<!-- ========== END MAIN CONTENT ========== -->
<!-- ========== SECONDARY CONTENTS ========== -->
<!-- Keyboard Shortcuts -->
@@include("@@autopath/partials/layouts-components/offcanvas-shortcuts.html")
<!-- End Keyboard Shortcuts -->
<!-- Activity -->
@@include("@@autopath/partials/layouts-components/offcanvas-activity.html")
<!-- End Activity -->
<!-- Welcome Message Modal -->
@@include("@@autopath/partials/modals/welcome-message.html")
<!-- End Welcome Message Modal -->
<!-- ========== END SECONDARY CONTENTS ========== -->
<!-- JS Global Compulsory @@deleteLine:build -->
<script src="@@autopath/node_modules/jquery/dist/jquery.min.js"></script>
<script src="@@autopath/node_modules/jquery-migrate/dist/jquery-migrate.min.js"></script>
<script src="@@autopath/node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<!-- JS Implementing Plugins -->
<!-- bundlejs:vendor [@@autopath] -->
<script src="@@autopath/assets/vendor/hs-navbar-vertical-aside/dist/hs-navbar-vertical-aside.min.js"></script>
<script src="@@autopath/assets/vendor/hs-form-search/dist/hs-form-search.min.js"></script>
<!-- JS Front -->
<!-- bundlejs:theme [@@autopath] -->
<script src="@@autopath/assets/js/hs.core.js"></script>
<script src="@@autopath/assets/js/hs.bs-dropdown.js"></script>
<!-- JS Plugins Init. -->
<script>
(function() {
// INITIALIZATION OF NAVBAR VERTICAL ASIDE
// =======================================================
new HSSideNav('.js-navbar-vertical-aside').init()
// INITIALIZATION OF FORM SEARCH
// =======================================================
new HSFormSearch('.js-form-search')
// INITIALIZATION OF BOOTSTRAP DROPDOWN
// =======================================================
HSBsDropdown.init()
// INITIALIZATION OF SIDEBAR COMBINATIONS WITH OFFCANVAS
// =======================================================
const offcanvasInstance = new bootstrap.Offcanvas(document.querySelector('.js-offcanvas-start'))
window.addEventListener('resize', function (e) {
if (window.innerWidth > 1200) {
if (offcanvasInstance._element.style.transition !== 'none 0s ease 0s' ) {
offcanvasInstance._element.style.transition = 'none'
}
// Reset offcanvas states
if (offcanvasInstance._isShown) {
offcanvasInstance._element.classList.remove('show')
offcanvasInstance._backdrop._element.remove()
offcanvasInstance._isShown = false
offcanvasInstance._backdrop._isAppended = false
}
// Show offcanvas if hidden on desktop
if (offcanvasInstance._element.style.visibility === 'hidden') {
offcanvasInstance._element.style.visibility = 'visible'
}
} else {
if (offcanvasInstance._element.style.transition === 'none 0s ease 0s' ) {
offcanvasInstance._element.style.removeProperty('transition')
}
}
})
})()
</script>
<!-- Style Switcher JS -->
@@if(layoutBuilder.extend.switcherSupport === true) {
@@include("@@autopath/partials/layouts-components/darkmode-switcher-js.html")
}
<!-- End Style Switcher JS -->
</body>
</html>

260
src/layouts/sidebar-combinations-two-plus-mini-cols.html Normal file
View File

@@ -0,0 +1,260 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required Meta Tags Always Come First -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Title -->
<title>Two + Mini Columns - Sidebar Combinations | Front - Admin &amp; Dashboard Template</title>
<!-- Favicon -->
<link rel="shortcut icon" href="@@autopath/favicon.ico">
<!-- Font -->
<link href="@@vars.themeFont" rel="stylesheet">
<!-- CSS Implementing Plugins -->
<!-- bundlecss:vendor [@@autopath] -->
<link rel="stylesheet" href="@@autopath/node_modules/bootstrap-icons/font/bootstrap-icons.css">
<link rel="stylesheet" href="@@autopath/assets/vendor/hs-mega-menu/dist/hs-mega-menu.min.css">
<!-- CSS Front Template -->
<!-- bundlecss:theme [@@autopath] @@vars.version -->
@@if(layoutBuilder.extend.switcherSupport === false) {
<link rel="stylesheet" href="@@autopath/assets/css/theme@@if(themeAppearance.layoutSkin === 'dark'){-dark}.css">
}
@@if(layoutBuilder.extend.switcherSupport === true) {
<link rel="preload" href="@@autopath/assets/css/theme.css" data-hs-appearance="default" as="style">
<link rel="preload" href="@@autopath/assets/css/theme-dark.css" data-hs-appearance="dark" as="style">
<style data-hs-appearance-onload-styles>
* {
transition: unset !important;
}
body {
opacity: 0;
}
</style>
}
</head>
<body class="has-navbar-vertical-aside navbar-vertical-aside-show-xl navbar-vertical-aside-closed-mode">
@@if(layoutBuilder.extend.switcherSupport === true) {
<script src="@@autopath/assets/js/hs.theme-appearance.js"></script>
}
<!-- ========== MAIN CONTENT ========== -->
<!-- Navbar Vertical -->
@@include("@@autopath/partials/sidebar/main-no-navbar-toggler.html", {
"category": "dashboards",
"subcategory": "",
"link": "index.html"
})
<!-- End Navbar Vertical -->
<main id="content" role="main" class="main splitted-content-main">
<!-- Offcanvas Content -->
<div class="js-offcanvas-start offcanvas offcanvas-start splitted-content-small splitted-content-bordered d-flex flex-column" tabindex="-1" id="splittedOffcanvasContent">
<div class="offcanvas-body">
<div class="d-flex justify-content-center flex-column align-items-center h-100 py-10 py-xl-0">
<img class="avatar avatar-xxl mb-3" src="@@autopath/assets/svg/illustrations/oc-megaphone.svg" alt="Image Description" data-hs-theme-appearance="default">
<img class="avatar avatar-xxl mb-3" src="@@autopath/assets/svg/illustrations-light/oc-megaphone.svg" alt="Image Description" data-hs-theme-appearance="dark">
<p class="card-text">No data to show</p>
<a class="btn btn-sm btn-white" href="@@autopath/index.html">Get Started</a>
</div>
</div>
</div>
<!-- End Offcanvas Content -->
<!-- Fluid Content -->
<div class="splitted-content-fluid content-space">
<!-- Toggles -->
<div class="d-flex d-xl-none justify-content-end mt-3 me-3">
<ul class="list-inline">
<li class="list-inline-item">
<!-- Offcanvas Toggle -->
<button class="navbar-toggler splitted-content-toggle" type="button" data-bs-toggle="offcanvas" data-bs-target="#splittedOffcanvasContent" aria-controls="splittedOffcanvasContent">
<span class="navbar-toggler-default">
<i class="bi-list"></i>
</span>
<span class="navbar-toggler-toggled">
<i class="bi-x"></i>
</span>
</button>
<!-- End Offcanvas Toggle -->
</li>
<li class="list-inline-item">
<!-- Offcanvas Toggle -->
<button class="navbar-toggler splitted-content-toggle" type="button" data-bs-toggle="offcanvas" data-bs-target="#splittedMiniOffcanvasContent" aria-controls="splittedMiniOffcanvasContent">
<span class="navbar-toggler-default">
<i class="bi-list"></i>
</span>
<span class="navbar-toggler-toggled">
<i class="bi-x"></i>
</span>
</button>
<!-- End Offcanvas Toggle -->
</li>
<li class="list-inline-item">
<!-- Navbar Vertical Toggle -->
<button type="button" class="js-navbar-vertical-aside-toggle-invoker navbar-aside-toggler position-static">
<i class="bi-arrow-bar-left navbar-toggler-short-align" data-bs-toggle="tooltip" data-bs-placement="right" title="Collapse"></i>
<i class="bi-arrow-bar-right navbar-toggler-full-align" data-bs-template='<div class="tooltip d-none d-sm-block" role="tooltip"><div class="arrow"></div><div class="tooltip-inner"></div></div>' data-bs-toggle="tooltip" data-bs-placement="right" title="Expand"></i>
</button>
<!-- End Navbar Vertical Toggle -->
</li>
</ul>
</div>
<!-- End Toggles -->
<div class="mt-xl-10">
<!-- Title -->
<div class="text-center">
<img class="img-fluid mb-5" src="@@autopath/assets/svg/layouts/sidebar-combinations-two-cols.svg" alt="Image Description" data-hs-theme-appearance="default" style="max-width: 15rem;">
<img class="img-fluid shadow-sm mb-5" src="@@autopath/assets/svg/layouts-light/sidebar-combinations-two-cols.svg" alt="Image Description" data-hs-theme-appearance="dark" style="max-width: 15rem;">
<h1>Two Columns - Sidebar Combinations</h1>
<p>Customize your overview page layout. Choose the one that best fits your needs.</p>
<a class="btn btn-primary" href="@@autopath/layouts/index.html">Go back to Layouts</a>
</div>
<!-- End Title -->
</div>
</div>
<!-- End Fluid Content -->
<!-- Mini Content -->
<div class="js-offcanvas-end offcanvas offcanvas-end splitted-content-mini splitted-content-bordered d-flex flex-column" tabindex="-1" id="splittedMiniOffcanvasContent">
<div class="offcanvas-body">
<ul class="nav nav-vertical nav-compact-icon nav-compact-icon-circle justify-content-center">
@@include("@@autopath/partials/layouts-components/navbar-vertical-menu-compact-icons.html", {
"compact": "layouts.html"
})
</ul>
</div>
</div>
<!-- End Mini Content -->
</main>
<!-- ========== END MAIN CONTENT ========== -->
<!-- ========== SECONDARY CONTENTS ========== -->
<!-- Keyboard Shortcuts -->
@@include("@@autopath/partials/layouts-components/offcanvas-shortcuts.html")
<!-- End Keyboard Shortcuts -->
<!-- Activity -->
@@include("@@autopath/partials/layouts-components/offcanvas-activity.html")
<!-- End Activity -->
<!-- Welcome Message Modal -->
@@include("@@autopath/partials/modals/welcome-message.html")
<!-- End Welcome Message Modal -->
<!-- ========== END SECONDARY CONTENTS ========== -->
<!-- JS Global Compulsory @@deleteLine:build -->
<script src="@@autopath/node_modules/jquery/dist/jquery.min.js"></script>
<script src="@@autopath/node_modules/jquery-migrate/dist/jquery-migrate.min.js"></script>
<script src="@@autopath/node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<!-- JS Implementing Plugins -->
<!-- bundlejs:vendor [@@autopath] -->
<script src="@@autopath/assets/vendor/hs-navbar-vertical-aside/dist/hs-navbar-vertical-aside.min.js"></script>
<script src="@@autopath/assets/vendor/hs-form-search/dist/hs-form-search.min.js"></script>
<script src="@@autopath/assets/vendor/hs-mega-menu/dist/hs-mega-menu.min.js"></script>
<!-- JS Front -->
<!-- bundlejs:theme [@@autopath] -->
<script src="@@autopath/assets/js/hs.core.js"></script>
<script src="@@autopath/assets/js/hs.bs-dropdown.js"></script>
<!-- JS Plugins Init. -->
<script>
(function() {
// INITIALIZATION OF MEGA MENU
// =======================================================
new HSMegaMenu('.js-mega-menu', {
desktop: {
position: 'left'
}
})
// INITIALIZATION OF NAVBAR VERTICAL ASIDE
// =======================================================
new HSSideNav('.js-navbar-vertical-aside').init()
// INITIALIZATION OF FORM SEARCH
// =======================================================
new HSFormSearch('.js-form-search')
// INITIALIZATION OF BOOTSTRAP DROPDOWN
// =======================================================
HSBsDropdown.init()
// INITIALIZATION OF SIDEBAR COMBINATIONS WITH OFFCANVAS
// =======================================================
const offcanvasInstance = new bootstrap.Offcanvas(document.querySelector('.js-offcanvas-start'))
const offcanvasMiniInstance = new bootstrap.Offcanvas(document.querySelector('.js-offcanvas-end'))
window.addEventListener('resize', function (e) {
if (window.innerWidth > 1200) {
if (offcanvasInstance._element.style.transition !== 'none 0s ease 0s' ) {
offcanvasInstance._element.style.transition = 'none'
}
// Reset offcanvas states
if (offcanvasInstance._isShown) {
offcanvasInstance._element.classList.remove('show')
offcanvasInstance._backdrop._element.remove()
offcanvasInstance._isShown = false
offcanvasInstance._backdrop._isAppended = false
}
// Show offcanvas if hidden on desktop
if (offcanvasInstance._element.style.visibility === 'hidden') {
offcanvasInstance._element.style.visibility = 'visible'
}
} else {
if (offcanvasInstance._element.style.transition === 'none 0s ease 0s') {
offcanvasInstance._element.style.removeProperty('transition')
}
}
if (window.innerWidth > 992) {
if (offcanvasMiniInstance._element.style.transition !== 'none 0s ease 0s' ) {
offcanvasMiniInstance._element.style.transition = 'none'
}
// Reset offcanvas states
if (offcanvasMiniInstance._isShown) {
offcanvasMiniInstance._element.classList.remove('show')
offcanvasMiniInstance._backdrop._element.remove()
offcanvasMiniInstance._isShown = false
offcanvasMiniInstance._backdrop._isAppended = false
}
// Show offcanvas if hidden on desktop
if (offcanvasMiniInstance._element.style.visibility === 'hidden') {
offcanvasMiniInstance._element.style.visibility = 'visible'
}
} else {
if (offcanvasMiniInstance._element.style.transition === 'none 0s ease 0s') {
offcanvasMiniInstance._element.style.removeProperty('transition')
}
}
})
})()
</script>
<!-- Style Switcher JS -->
@@if(layoutBuilder.extend.switcherSupport === true) {
@@include("@@autopath/partials/layouts-components/darkmode-switcher-js.html")
}
<!-- End Style Switcher JS -->
</body>
</html>

137
src/layouts/sidebar-compact.html Normal file
View File

@@ -0,0 +1,137 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required Meta Tags Always Come First -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Title -->
<title>Default Compact | Front - Admin &amp; Dashboard Template</title>
<!-- Favicon -->
<link rel="shortcut icon" href="@@autopath/favicon.ico">
<!-- Font -->
<link href="@@vars.themeFont" rel="stylesheet">
<!-- CSS Implementing Plugins -->
<!-- bundlecss:vendor [@@autopath] -->
<link rel="stylesheet" href="@@autopath/node_modules/bootstrap-icons/font/bootstrap-icons.css">
<!-- CSS Front Template -->
<!-- bundlecss:theme [@@autopath] @@vars.version -->
@@if(layoutBuilder.extend.switcherSupport === false) {
<link rel="stylesheet" href="@@autopath/assets/css/theme@@if(themeAppearance.layoutSkin === 'dark'){-dark}.css">
}
@@if(layoutBuilder.extend.switcherSupport === true) {
<link rel="preload" href="@@autopath/assets/css/theme.css" data-hs-appearance="default" as="style">
<link rel="preload" href="@@autopath/assets/css/theme-dark.css" data-hs-appearance="dark" as="style">
<style data-hs-appearance-onload-styles>
* {
transition: unset !important;
}
body {
opacity: 0;
}
</style>
}
</head>
<body class="has-navbar-vertical-aside navbar-vertical-aside-show-xl navbar-vertical-aside-compact-mini-mode navbar-vertical-aside-compact-mode">
@@if(layoutBuilder.extend.switcherSupport === true) {
<script src="@@autopath/assets/js/hs.theme-appearance.js"></script>
}
<!-- ========== MAIN CONTENT ========== -->
<!-- Navbar Vertical -->
@@include("@@autopath/partials/sidebar/compact.html", {
"category": "dashboards",
"subcategory": "",
"link": "index.html"
})
<!-- End Navbar Vertical -->
<main id="content" role="main" class="main">
<!-- Content -->
<div class="content container-fluid">
<!-- Navbar Vertical Toggle -->
<div class="d-flex justify-content-end">
<button type="button" class="js-navbar-vertical-aside-toggle-invoker navbar-aside-toggler position-static">
<i class="bi-arrow-bar-left navbar-toggler-short-align" data-bs-toggle="tooltip" data-bs-placement="right" title="Collapse"></i>
<i class="bi-arrow-bar-right navbar-toggler-full-align" data-bs-template='<div class="tooltip d-none d-sm-block" role="tooltip"><div class="arrow"></div><div class="tooltip-inner"></div></div>' data-bs-toggle="tooltip" data-bs-placement="right" title="Expand"></i>
</button>
</div>
<!-- End Navbar Vertical Toggle -->
<div class="row justify-content-lg-center pt-lg-5 pt-xl-10">
<div class="col-lg-9 col-xl-8">
<!-- Title -->
<div class="text-center">
<img class="img-fluid mb-5" src="@@autopath/assets/svg/layouts/sidebar-compact.svg" alt="Image Description" data-hs-theme-appearance="default" style="max-width: 15rem;">
<img class="img-fluid shadow-sm mb-5" src="@@autopath/assets/svg/layouts-light/sidebar-compact.svg" alt="Image Description" data-hs-theme-appearance="dark" style="max-width: 15rem;">
<h1>Sidebar Compact - Sidebar Combinations</h1>
<p>Customize your overview page layout. Choose the one that best fits your needs.</p>
<a class="btn btn-primary" href="@@autopath/layouts/index.html">Go back to Layouts</a>
</div>
<!-- End Title -->
</div>
</div>
<!-- End Row -->
</div>
<!-- End Content -->
</main>
<!-- ========== END MAIN CONTENT ========== -->
<!-- ========== SECONDARY CONTENTS ========== -->
<!-- Keyboard Shortcuts -->
@@include("@@autopath/partials/layouts-components/offcanvas-shortcuts.html")
<!-- End Keyboard Shortcuts -->
<!-- Activity -->
@@include("@@autopath/partials/layouts-components/offcanvas-activity.html")
<!-- End Activity -->
<!-- Welcome Message Modal -->
@@include("@@autopath/partials/modals/welcome-message.html")
<!-- End Welcome Message Modal -->
<!-- ========== END SECONDARY CONTENTS ========== -->
<!-- JS Global Compulsory @@deleteLine:build -->
<script src="@@autopath/node_modules/jquery/dist/jquery.min.js"></script>
<script src="@@autopath/node_modules/jquery-migrate/dist/jquery-migrate.min.js"></script>
<script src="@@autopath/node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<!-- JS Implementing Plugins -->
<!-- bundlejs:vendor [@@autopath] -->
<script src="@@autopath/assets/vendor/hs-navbar-vertical-aside/dist/hs-navbar-vertical-aside.min.js"></script>
<!-- JS Front -->
<!-- bundlejs:theme [@@autopath] -->
<script src="@@autopath/assets/js/hs.core.js"></script>
<script src="@@autopath/assets/js/hs.bs-dropdown.js"></script>
<!-- JS Plugins Init. -->
<script>
(function() {
// INITIALIZATION OF NAVBAR VERTICAL ASIDE
// =======================================================
new HSSideNav('.js-navbar-vertical-aside').init()
// INITIALIZATION OF BOOTSTRAP DROPDOWN
// =======================================================
HSBsDropdown.init()
})()
</script>
<!-- Style Switcher JS -->
@@if(layoutBuilder.extend.switcherSupport === true) {
@@include("@@autopath/partials/layouts-components/darkmode-switcher-js.html")
}
<!-- End Style Switcher JS -->
</body>
</html>

139
src/layouts/sidebar-default-classic.html Normal file
View File

@@ -0,0 +1,139 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required Meta Tags Always Come First -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Title -->
<title>Default Sidebar (Classic) | Front - Admin &amp; Dashboard Template</title>
<!-- Favicon -->
<link rel="shortcut icon" href="@@autopath/favicon.ico">
<!-- Font -->
<link href="@@vars.themeFont" rel="stylesheet">
<!-- CSS Implementing Plugins -->
<!-- bundlecss:vendor [@@autopath] -->
<link rel="stylesheet" href="@@autopath/node_modules/bootstrap-icons/font/bootstrap-icons.css">
<!-- CSS Front Template -->
<!-- bundlecss:theme [@@autopath] @@vars.version -->
@@if(layoutBuilder.extend.switcherSupport === false) {
<link rel="stylesheet" href="@@autopath/assets/css/theme@@if(themeAppearance.layoutSkin === 'dark'){-dark}.css">
}
@@if(layoutBuilder.extend.switcherSupport === true) {
<link rel="preload" href="@@autopath/assets/css/theme.css" data-hs-appearance="default" as="style">
<link rel="preload" href="@@autopath/assets/css/theme-dark.css" data-hs-appearance="dark" as="style">
<style data-hs-appearance-onload-styles>
* {
transition: unset !important;
}
body {
opacity: 0;
}
</style>
}
</head>
<body class="has-navbar-vertical-aside navbar-vertical-aside-show-xl">
@@if(layoutBuilder.extend.switcherSupport === true) {
<script src="@@autopath/assets/js/hs.theme-appearance.js"></script>
}
<!-- ========== MAIN CONTENT ========== -->
<main id="content" role="main" class="main">
<!-- Navbar Vertical -->
@@include("@@autopath/partials/sidebar/main.html", {
"category": "dashboards",
"subcategory": "",
"link": "index.html"
})
<!-- End Navbar Vertical -->
<!-- Content -->
<div class="content container">
<!-- Navbar Vertical Toggle -->
<div class="d-flex justify-content-end">
<button type="button" class="js-navbar-vertical-aside-toggle-invoker navbar-aside-toggler position-static">
<i class="bi-arrow-bar-left navbar-toggler-short-align" data-bs-toggle="tooltip" data-bs-placement="right" title="Collapse"></i>
<i class="bi-arrow-bar-right navbar-toggler-full-align" data-bs-template='<div class="tooltip d-none d-sm-block" role="tooltip"><div class="arrow"></div><div class="tooltip-inner"></div></div>' data-bs-toggle="tooltip" data-bs-placement="right" title="Expand"></i>
</button>
</div>
<!-- End Navbar Vertical Toggle -->
<div class="row justify-content-lg-center pt-lg-5 pt-xl-10">
<div class="col-lg-9">
<!-- Title -->
<div class="text-center">
<img class="img-fluid mb-5" src="@@autopath/assets/svg/layouts/sidebar-default-classic.svg" alt="Image Description" data-hs-theme-appearance="default" style="max-width: 15rem;">
<img class="img-fluid shadow-sm mb-5" src="@@autopath/assets/svg/layouts-light/sidebar-default-classic.svg" alt="Image Description" data-hs-theme-appearance="dark" style="max-width: 15rem;">
<h1>Default Sidebar (Classic)</h1>
<p>Customize your overview page layout. Choose the one that best fits your needs.</p>
<a class="btn btn-primary" href="@@autopath/layouts/index.html">Go back to Layouts</a>
</div>
<!-- End Title -->
</div>
</div>
<!-- End Row -->
</div>
<!-- End Content -->
</main>
<!-- ========== END MAIN CONTENT ========== -->
<!-- ========== SECONDARY CONTENTS ========== -->
<!-- Welcome Message -->
@@include("@@autopath/partials/modals/welcome-message.html")
<!-- End Welcome Message -->
<!-- ========== END SECONDARY CONTENTS ========== -->
<!-- JS Global Compulsory @@deleteLine:build -->
<script src="@@autopath/node_modules/jquery/dist/jquery.min.js"></script>
<script src="@@autopath/node_modules/jquery-migrate/dist/jquery-migrate.min.js"></script>
<script src="@@autopath/node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<!-- JS Implementing Plugins -->
<!-- bundlejs:vendor [@@autopath] -->
<script src="@@autopath/assets/vendor/hs-navbar-vertical-aside/dist/hs-navbar-vertical-aside.min.js"></script>
<!-- JS Front -->
<!-- bundlejs:theme [@@autopath] -->
<script src="@@autopath/assets/js/hs.core.js"></script>
<script src="@@autopath/assets/js/hs.bs-dropdown.js"></script>
<!-- JS Plugins Init. -->
<script>
(function() {
@@if(layoutBuilder.header.layoutMode !== 'default') {
// INITIALIZATION OF MEGA MENU
// =======================================================
new HSMegaMenu('.js-mega-menu', {
desktop: {
position: 'left'
}
})
}
// INITIALIZATION OF NAVBAR VERTICAL ASIDE
// =======================================================
new HSSideNav('.js-navbar-vertical-aside').init()
// INITIALIZATION OF BOOTSTRAP DROPDOWN
// =======================================================
HSBsDropdown.init()
})()
</script>
<!-- Style Switcher JS -->
@@if(layoutBuilder.extend.switcherSupport === true) {
@@include("@@autopath/partials/layouts-components/darkmode-switcher-js.html")
}
<!-- End Style Switcher JS -->
</body>
</html>

175
src/layouts/sidebar-detached-container.html Normal file
View File

@@ -0,0 +1,175 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required Meta Tags Always Come First -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Title -->
<title>Detached Sidebar (Container) | Front - Admin &amp; Dashboard Template</title>
<!-- Favicon -->
<link rel="shortcut icon" href="@@autopath/favicon.ico">
<!-- Font -->
<link href="@@vars.themeFont" rel="stylesheet">
<!-- CSS Implementing Plugins -->
<!-- bundlecss:vendor [@@autopath] -->
<link rel="stylesheet" href="@@autopath/node_modules/bootstrap-icons/font/bootstrap-icons.css">
<!-- CSS Front Template -->
<!-- bundlecss:theme [@@autopath] @@vars.version -->
@@if(layoutBuilder.extend.switcherSupport === false) {
<link rel="stylesheet" href="@@autopath/assets/css/theme@@if(themeAppearance.layoutSkin === 'dark'){-dark}.css">
}
@@if(layoutBuilder.extend.switcherSupport === true) {
<link rel="preload" href="@@autopath/assets/css/theme.css" data-hs-appearance="default" as="style">
<link rel="preload" href="@@autopath/assets/css/theme-dark.css" data-hs-appearance="dark" as="style">
<style data-hs-appearance-onload-styles>
* {
transition: unset !important;
}
body {
opacity: 0;
}
</style>
}
</head>
<body class="bg-light">
@@if(layoutBuilder.extend.switcherSupport === true) {
<script src="@@autopath/assets/js/hs.theme-appearance.js"></script>
}
<!-- ========== HEADER ========== -->
@@include("@@autopath/partials/navbar/sidebar-detached-fixed-search-width.html")
<!-- ========== END HEADER ========== -->
<!-- ========== MAIN CONTENT ========== -->
<main id="content" role="main" class="main">
<!-- Content -->
<div class="content container pt-2 pt-lg-0">
<!-- Navbar Vertical -->
<div class="navbar-expand-lg navbar-light">
<!-- Navbar Toggle -->
<button class="navbar-toggler w-100 mb-3" type="button" data-bs-toggle="collapse" data-bs-target="#navbarVerticalNavMenu" aria-controls="navbarVerticalNavMenu" aria-expanded="false" aria-label="Toggle navigation">
<span class="d-flex justify-content-between align-items-center">
<span class="navbar-toggler-text">Nav menu</span>
<span class="navbar-toggler-default">
<i class="bi-list"></i>
</span>
<span class="navbar-toggler-toggled">
<i class="bi-x"></i>
</span>
</span>
</button>
<!-- End Navbar Toggle -->
@@include("@@autopath/partials/sidebar/detached-navbar-light.html")
</div>
<!-- End Navbar Vertical -->
<!-- Sidebar Detached Content -->
<div class="sidebar-detached-content">
<!-- Card -->
<div class="card card-centered mb-3 mb-lg-5">
<div class="card-body py-10 my-lg-10">
<img class="img-fluid mb-5" src="@@autopath/assets/svg/layouts/content-combinations-container-overlay.svg" alt="Image Description" data-hs-theme-appearance="default" style="max-width: 15rem;">
<img class="img-fluid shadow-sm mb-5" src="@@autopath/assets/svg/layouts-light/content-combinations-container-overlay.svg" alt="Image Description" data-hs-theme-appearance="dark" style="max-width: 15rem;">
<h1>Detached Sidebar (Container)</h1>
<p>Customize your overview page layout. Choose the one that best fits your needs.</p>
<a class="btn btn-primary" href="@@autopath/layouts/index.html">Go back to Layouts</a>
</div>
</div>
<!-- End Card -->
<!-- Card -->
<div class="card card-centered mb-3 mb-lg-5">
<div class="card-body py-10">
<img class="avatar avatar-xxl mb-3" src="@@autopath/assets/svg/illustrations/oc-megaphone.svg" alt="Image Description" data-hs-theme-appearance="default">
<img class="avatar avatar-xxl mb-3" src="@@autopath/assets/svg/illustrations-light/oc-megaphone.svg" alt="Image Description" data-hs-theme-appearance="dark">
<p class="card-text">No data to show</p>
<a class="btn btn-white btn-sm" href="@@autopath/index.html">Get Started</a>
</div>
</div>
<!-- End Card -->
<!-- Card -->
<div class="card card-centered">
<div class="card-body py-10">
<img class="avatar avatar-xxl mb-3" src="@@autopath/assets/svg/illustrations/oc-megaphone.svg" alt="Image Description" data-hs-theme-appearance="default">
<img class="avatar avatar-xxl mb-3" src="@@autopath/assets/svg/illustrations-light/oc-megaphone.svg" alt="Image Description" data-hs-theme-appearance="dark">
<p class="card-text">No data to show</p>
<a class="btn btn-white btn-sm" href="@@autopath/index.html">Get Started</a>
</div>
</div>
<!-- End Card -->
</div>
<!-- End Sidebar Detached Content -->
</div>
<!-- End Content -->
</main>
<!-- ========== END MAIN CONTENT ========== -->
<!-- ========== SECONDARY CONTENTS ========== -->
<!-- Keyboard Shortcuts -->
@@include("@@autopath/partials/layouts-components/offcanvas-shortcuts.html")
<!-- End Keyboard Shortcuts -->
<!-- Activity -->
@@include("@@autopath/partials/layouts-components/offcanvas-activity.html")
<!-- End Activity -->
<!-- Welcome Message -->
@@include("@@autopath/partials/modals/welcome-message.html")
<!-- End Welcome Message -->
<!-- ========== END SECONDARY CONTENTS ========== -->
<!-- JS Global Compulsory @@deleteLine:build -->
<script src="@@autopath/node_modules/jquery/dist/jquery.min.js"></script>
<script src="@@autopath/node_modules/jquery-migrate/dist/jquery-migrate.min.js"></script>
<script src="@@autopath/node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<!-- JS Implementing Plugins -->
<!-- bundlejs:vendor [@@autopath] -->
<script src="@@autopath/assets/vendor/hs-navbar-vertical-aside/dist/hs-navbar-vertical-aside.min.js"></script>
<script src="@@autopath/assets/vendor/hs-form-search/dist/hs-form-search.min.js"></script>
<!-- JS Front -->
<!-- bundlejs:theme [@@autopath] -->
<script src="@@autopath/assets/js/hs.core.js"></script>
<script src="@@autopath/assets/js/hs.bs-dropdown.js"></script>
<!-- JS Plugins Init. -->
<script>
(function() {
window.onload = function () {
// INITIALIZATION OF NAVBAR VERTICAL ASIDE
// =======================================================
new HSSideNav('.js-navbar-vertical-aside').init()
// INITIALIZATION OF FORM SEARCH
// =======================================================
new HSFormSearch('.js-form-search')
// INITIALIZATION OF BOOTSTRAP DROPDOWN
// =======================================================
HSBsDropdown.init()
}
})()
</script>
<!-- Style Switcher JS -->
@@if(layoutBuilder.extend.switcherSupport === true) {
@@include("@@autopath/partials/layouts-components/darkmode-switcher-js.html")
}
<!-- End Style Switcher JS -->
</body>
</html>

200
src/layouts/sidebar-detached-overlay-container.html Normal file
View File

@@ -0,0 +1,200 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required Meta Tags Always Come First -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Title -->
<title>Detached Sidebar Overlay (Container) | Front - Admin &amp; Dashboard Template</title>
<!-- Favicon -->
<link rel="shortcut icon" href="@@autopath/favicon.ico">
<!-- Font -->
<link href="@@vars.themeFont" rel="stylesheet">
<!-- CSS Implementing Plugins -->
<!-- bundlecss:vendor [@@autopath] -->
<link rel="stylesheet" href="@@autopath/node_modules/bootstrap-icons/font/bootstrap-icons.css">
<!-- CSS Front Template -->
<!-- bundlecss:theme [@@autopath] @@vars.version -->
@@if(layoutBuilder.extend.switcherSupport === false) {
<link rel="stylesheet" href="@@autopath/assets/css/theme@@if(themeAppearance.layoutSkin === 'dark'){-dark}.css">
}
@@if(layoutBuilder.extend.switcherSupport === true) {
<link rel="preload" href="@@autopath/assets/css/theme.css" data-hs-appearance="default" as="style">
<link rel="preload" href="@@autopath/assets/css/theme-dark.css" data-hs-appearance="dark" as="style">
<style data-hs-appearance-onload-styles>
* {
transition: unset !important;
}
body {
opacity: 0;
}
</style>
}
</head>
<body class="bg-light">
@@if(layoutBuilder.extend.switcherSupport === true) {
<script src="@@autopath/assets/js/hs.theme-appearance.js"></script>
}
<!-- ========== HEADER ========== -->
@@include("@@autopath/partials/navbar/sidebar-detached.html")
<!-- ========== END HEADER ========== -->
<!-- ========== MAIN CONTENT ========== -->
<main id="content" role="main" class="main">
<!-- Content -->
<div class="bg-dark">
<div class="content container" style="height: 25rem;">
<!-- Page Header -->
<div class="page-header page-header-light page-header-reset">
<div class="row align-items-center">
<div class="col">
<h1 class="page-header-title">Dashboard</h1>
</div>
<div class="col-auto">
<a class="btn btn-primary" href="#">My dashboard</a>
</div>
</div>
<!-- End Row -->
</div>
<!-- End Page Header -->
</div>
</div>
<!-- End Content -->
<!-- Content -->
<div class="content container" style="margin-top: -20rem;">
<!-- Navbar Vertical -->
<div class="navbar-expand-lg">
<!-- Navbar Toggle -->
<button class="navbar-toggler text-white border-white-10 w-100 mb-3" type="button" data-bs-toggle="collapse" data-bs-target="#navbarVerticalNavMenu" aria-controls="navbarVerticalNavMenu" aria-expanded="false" aria-label="Toggle navigation">
<span class="d-flex justify-content-between align-items-center">
<span class="navbar-toggler-text text-white">Nav menu</span>
<span class="navbar-toggler-default">
<i class="bi-list"></i>
</span>
<span class="navbar-toggler-toggled">
<i class="bi-x"></i>
</span>
</span>
</button>
<!-- End Navbar Toggle -->
@@include("@@autopath/partials/sidebar/detached.html")
</div>
<!-- End Navbar Vertical -->
<!-- Sidebar Detached Content -->
<div class="sidebar-detached-content mt-3 mt-lg-0">
<!-- Card -->
<div class="card card-centered mb-3 mb-lg-5">
<div class="card-body py-10">
<!-- Title -->
<div class="text-center">
<img class="img-fluid mb-5" src="@@autopath/assets/svg/layouts/sidebar-detached-overlay-container.svg" alt="Image Description" data-hs-theme-appearance="default" style="max-width: 15rem;">
<img class="img-fluid shadow-sm mb-5" src="@@autopath/assets/svg/layouts-light/sidebar-detached-overlay-container.svg" alt="Image Description" data-hs-theme-appearance="dark" style="max-width: 15rem;">
<h1>Detached Sidebar Overlay (Container)</h1>
<p>Customize your overview page layout. Choose the one that best fits your needs.</p>
<a class="btn btn-primary" href="@@autopath/layouts/index.html">Go back to Layouts</a>
</div>
<!-- End Title -->
</div>
</div>
<!-- End Card -->
<!-- Card -->
<div class="card card-centered mb-3 mb-lg-5">
<div class="card-body py-10">
<img class="avatar avatar-xxl mb-3" src="@@autopath/assets/svg/illustrations/oc-megaphone.svg" alt="Image Description" data-hs-theme-appearance="default">
<img class="avatar avatar-xxl mb-3" src="@@autopath/assets/svg/illustrations-light/oc-megaphone.svg" alt="Image Description" data-hs-theme-appearance="dark">
<p class="card-text">No data to show</p>
<a class="btn btn-sm btn-white" href="@@autopath/index.html">Get Started</a>
</div>
</div>
<!-- End Card -->
<!-- Card -->
<div class="card card-centered">
<div class="card-body py-10">
<img class="avatar avatar-xxl mb-3" src="@@autopath/assets/svg/illustrations/oc-megaphone.svg" alt="Image Description" data-hs-theme-appearance="default">
<img class="avatar avatar-xxl mb-3" src="@@autopath/assets/svg/illustrations-light/oc-megaphone.svg" alt="Image Description" data-hs-theme-appearance="dark">
<p class="card-text">No data to show</p>
<a class="btn btn-sm btn-white" href="@@autopath/index.html">Get Started</a>
</div>
</div>
<!-- End Card -->
</div>
<!-- End Sidebar Detached Content -->
</div>
<!-- End Content -->
</main>
<!-- ========== END MAIN CONTENT ========== -->
<!-- ========== SECONDARY CONTENTS ========== -->
<!-- Keyboard Shortcuts -->
@@include("@@autopath/partials/layouts-components/offcanvas-shortcuts.html")
<!-- End Keyboard Shortcuts -->
<!-- Activity -->
@@include("@@autopath/partials/layouts-components/offcanvas-activity.html")
<!-- End Activity -->
<!-- Welcome Message -->
@@include("@@autopath/partials/modals/welcome-message.html")
<!-- End Welcome Message -->
<!-- ========== END SECONDARY CONTENTS ========== -->
<!-- JS Global Compulsory @@deleteLine:build -->
<script src="@@autopath/node_modules/jquery/dist/jquery.min.js"></script>
<script src="@@autopath/node_modules/jquery-migrate/dist/jquery-migrate.min.js"></script>
<script src="@@autopath/node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<!-- JS Implementing Plugins -->
<!-- bundlejs:vendor [@@autopath] -->
<script src="@@autopath/assets/vendor/hs-navbar-vertical-aside/dist/hs-navbar-vertical-aside.min.js"></script>
<script src="@@autopath/assets/vendor/hs-form-search/dist/hs-form-search.min.js"></script>
<!-- JS Front -->
<!-- bundlejs:theme [@@autopath] -->
<script src="@@autopath/assets/js/hs.core.js"></script>
<script src="@@autopath/assets/js/hs.bs-dropdown.js"></script>
<!-- JS Plugins Init. -->
<script>
(function() {
window.onload = function () {
// INITIALIZATION OF NAVBAR VERTICAL ASIDE
// =======================================================
new HSSideNav('.js-navbar-vertical-aside').init()
// INITIALIZATION OF FORM SEARCH
// =======================================================
new HSFormSearch('.js-form-search')
// INITIALIZATION OF BOOTSTRAP DROPDOWN
// =======================================================
HSBsDropdown.init()
}
})()
</script>
<!-- Style Switcher JS -->
@@if(layoutBuilder.extend.switcherSupport === true) {
@@include("@@autopath/partials/layouts-components/darkmode-switcher-js.html")
}
<!-- End Style Switcher JS -->
</body>
</html>

139
src/layouts/sidebar-mini.html Normal file
View File

@@ -0,0 +1,139 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required Meta Tags Always Come First -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Title -->
<title>Default Mini | Front - Admin &amp; Dashboard Template</title>
<!-- Favicon -->
<link rel="shortcut icon" href="@@autopath/favicon.ico">
<!-- Font -->
<link href="@@vars.themeFont" rel="stylesheet">
<!-- CSS Implementing Plugins -->
<!-- bundlecss:vendor [@@autopath] -->
<link rel="stylesheet" href="@@autopath/node_modules/bootstrap-icons/font/bootstrap-icons.css">
<!-- CSS Front Template -->
<!-- bundlecss:theme [@@autopath] @@vars.version -->
@@if(layoutBuilder.extend.switcherSupport === false) {
<link rel="stylesheet" href="@@autopath/assets/css/theme@@if(themeAppearance.layoutSkin === 'dark'){-dark}.css">
}
@@if(layoutBuilder.extend.switcherSupport === true) {
<link rel="preload" href="@@autopath/assets/css/theme.css" data-hs-appearance="default" as="style">
<link rel="preload" href="@@autopath/assets/css/theme-dark.css" data-hs-appearance="dark" as="style">
<style data-hs-appearance-onload-styles>
* {
transition: unset !important;
}
body {
opacity: 0;
}
</style>
}
</head>
<body class="has-navbar-vertical-aside navbar-vertical-aside-show-xl navbar-vertical-aside-mini-mode">
@@if(layoutBuilder.extend.switcherSupport === true) {
<script src="@@autopath/assets/js/hs.theme-appearance.js"></script>
}
<!-- ========== MAIN CONTENT ========== -->
<!-- Navbar Vertical -->
@@include("@@autopath/partials/sidebar/main.html", {
"category": "dashboards",
"subcategory": "",
"link": "index.html"
})
<!-- End Navbar Vertical -->
<main id="content" role="main" class="main">
<!-- Content -->
<div class="content container-fluid">
<!-- Toggle -->
<div class="d-flex justify-content-end mt-3 me-3">
<!-- Navbar Vertical Toggle -->
<button type="button" class="js-navbar-vertical-aside-toggle-invoker navbar-toggler">
<i class="bi-arrow-bar-left navbar-toggler-short-align" data-toggle="tooltip" data-placement="right" title="Collapse"></i>
<i class="bi-arrow-bar-right navbar-toggler-full-align" data-toggle="tooltip" data-placement="right" title="Expand"></i>
</button>
<!-- End Navbar Vertical Toggle -->
</div>
<!-- End Toggle -->
<div class="row justify-content-lg-center pt-lg-5 pt-xl-10">
<div class="col-lg-9 col-xl-8">
<!-- Title -->
<div class="text-center">
<img class="img-fluid mb-5" src="@@autopath/assets/svg/layouts/sidebar-mini.svg" alt="Image Description" data-hs-theme-appearance="default" style="max-width: 15rem;">
<img class="img-fluid shadow-sm mb-5" src="@@autopath/assets/svg/layouts-light/sidebar-mini.svg" alt="Image Description" data-hs-theme-appearance="dark" style="max-width: 15rem;">
<h1>Sidebar Mini - Sidebar Combinations</h1>
<p>Customize your overview page layout. Choose the one that best fits your needs.</p>
<a class="btn btn-primary" href="@@autopath/layouts/index.html">Go back to Layouts</a>
</div>
<!-- End Title -->
</div>
</div>
<!-- End Row -->
</div>
<!-- End Content -->
</main>
<!-- ========== END MAIN CONTENT ========== -->
<!-- ========== SECONDARY CONTENTS ========== -->
<!-- Keyboard Shortcuts -->
@@include("@@autopath/partials/layouts-components/offcanvas-shortcuts.html")
<!-- End Keyboard Shortcuts -->
<!-- Activity -->
@@include("@@autopath/partials/layouts-components/offcanvas-activity.html")
<!-- End Activity -->
<!-- Welcome Message Modal -->
@@include("@@autopath/partials/modals/welcome-message.html")
<!-- End Welcome Message Modal -->
<!-- ========== END SECONDARY CONTENTS ========== -->
<!-- JS Global Compulsory @@deleteLine:build -->
<script src="@@autopath/node_modules/jquery/dist/jquery.min.js"></script>
<script src="@@autopath/node_modules/jquery-migrate/dist/jquery-migrate.min.js"></script>
<script src="@@autopath/node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<!-- JS Implementing Plugins -->
<!-- bundlejs:vendor [@@autopath] -->
<script src="@@autopath/assets/vendor/hs-navbar-vertical-aside/dist/hs-navbar-vertical-aside.min.js"></script>
<!-- JS Front -->
<!-- bundlejs:theme [@@autopath] -->
<script src="@@autopath/assets/js/hs.core.js"></script>
<script src="@@autopath/assets/js/hs.bs-dropdown.js"></script>
<!-- JS Plugins Init. -->
<script>
(function() {
// INITIALIZATION OF NAVBAR VERTICAL ASIDE
// =======================================================
new HSSideNav('.js-navbar-vertical-aside').init()
// INITIALIZATION OF BOOTSTRAP DROPDOWN
// =======================================================
HSBsDropdown.init()
})()
</script>
<!-- Style Switcher JS -->
@@if(layoutBuilder.extend.switcherSupport === true) {
@@include("@@autopath/partials/layouts-components/darkmode-switcher-js.html")
}
<!-- End Style Switcher JS -->
</body>
</html>