File size: 6.22Kb
<!-- meta tags and other links -->
<!DOCTYPE html>
<html lang="en" data-theme="light">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Wowdash - Bootstrap 5 Admin Dashboard HTML Template</title>
<link rel="icon" type="image/png" href="assets/images/favicon.png" sizes="16x16">
<!-- All library css -->
<link rel="stylesheet" href="assets/css/remixicon.css">
<link rel="stylesheet" href="assets/css/plugins.css">
<link rel="stylesheet" href="assets/css/jstree.min.css">
<!-- main css -->
<link rel="stylesheet" href="assets/css/style.css">
</head>
<body>
<aside class="sidebar">
<div>
<a href="index.html" class="sidebar-logo">
<img src="assets/images/logo.png" alt="site logo" class="light-logo">
<img src="assets/images/logo-light.png" alt="site logo" class="dark-logo">
<img src="assets/images/logo-icon.png" alt="site logo" class="logo-icon">
</a>
</div>
<div class="sidebar-menu-area">
<ul class="sidebar-menu" id="sidebar-menu">
<li class="sidebar-menu-group-title">Getting Started</li>
<li>
<a href="index.html">
<iconify-icon icon="solar:document-add-outline" class="menu-icon"></iconify-icon>
<span>Introduction</span>
</a>
</li>
<li>
<a href="started.html">
<iconify-icon icon="hugeicons:start-up-02" class="menu-icon"></iconify-icon>
<span>Gettings Started</span>
</a>
</li>
<li class="sidebar-menu-group-title">Layout Structure</li>
<li>
<a href="html.html">
<iconify-icon icon="icomoon-free:html-five2" class="menu-icon"></iconify-icon>
<span>HTML Structure</span>
</a>
</li>
<li>
<a href="dark.html">
<iconify-icon icon="line-md:moon" class="menu-icon"></iconify-icon>
<span>Dark Layout</span>
</a>
</li>
<li>
<a href="rtl.html">
<iconify-icon icon="mdi:rtl" class="menu-icon"></iconify-icon>
<span>RTL Layout</span>
</a>
</li>
<li class="sidebar-menu-group-title">Folder Structure</li>
<li>
<a href="css.html">
<iconify-icon icon="bi:filetype-css" class="menu-icon"></iconify-icon>
<span>CSS</span>
</a>
</li>
<li>
<a href="scss.html">
<iconify-icon icon="bi:filetype-scss" class="menu-icon"></iconify-icon>
<span>SCSS</span>
</a>
</li>
<li>
<a href="js.html">
<iconify-icon icon="fluent:document-javascript-24-regular" class="menu-icon"></iconify-icon>
<span>JavaScript</span>
</a>
</li>
<li class="sidebar-menu-group-title">Components</li>
<li>
<a href="basic-components.html">
<iconify-icon icon="cil:list" class="menu-icon"></iconify-icon>
<span>Basic Components</span>
</a>
</li>
<li>
<a href="advance-components.html">
<iconify-icon icon="tdesign:tree-list" class="menu-icon"></iconify-icon>
<span>Advance Components</span>
</a>
</li>
<li>
<a href="forms.html">
<iconify-icon icon="fluent:form-48-regular" class="menu-icon"></iconify-icon>
<span>Forms</span>
</a>
</li>
<li>
<a href="tables.html">
<iconify-icon icon="mynaui:table" class="menu-icon"></iconify-icon>
<span>Tables</span>
</a>
</li>
</ul>
</div>
</aside>
<main class="dashboard-main">
<div class="navbar-header">
<div class="row align-items-center justify-content-between">
<div class="col-auto">
<h6 class="text-xl mb-0">Documentation</h6>
</div>
<div class="col-auto">
<div class="d-flex flex-wrap align-items-center gap-3">
<button type="button" data-theme-toggle
class="w-40-px h-40-px bg-neutral-200 rounded-circle d-flex justify-content-center align-items-center"></button>
</div>
</div>
</div>
</div>
<div class="dashboard-main-body">
<div class="card">
<div class="card-header">
<h5 class="card-title mb-0">CSS Structure</h5>
</div>
<div class="card-body">
<p class="mb-0">If you don't want to use <span class="text-danger-main">scss</span> then you can change directly css from your css files</p>
<p>We suggest you do not change any plugins css directly like <span class="text-danger-main">bootstrap</span> and all <span class="text-danger-main">lib folder</span> css files</p>
<div id="jstree">
<ul>
<li class="jstree-open">css
<ul>
<li class="jstree-open">lib
<ul>
<li>apexcharts.css</li>
<li>bootstrap.min.css</li>
<li>dataTables.min.css</li>
<li>editor.atom-one-dark.min.css</li>
<li>editor.quill.snow.css</li>
<li>editor-katex.min.css</li>
<li>flatpickr.min.css</li>
<li>full-calendar.css</li>
<li>jquery-jvectormap-2.0.5.css</li>
<li>magnific-popup.css</li>
<li>slick.css</li>
</ul>
</li>
<li>main.css</li>
</ul>
</li>
</ul>
</div>
</div>
</div>
</div>
</main>
<!-- All library -->
<script src="assets/js/plugins.js"></script>
<script src="assets/js/jstree.min.js"></script>
<!-- main js -->
<script src="assets/js/app.js"></script>
<script>
$(function () {
$('#jstree').jstree();
$('#jstree').on("changed.jstree", function (e, data) {
console.log(data.selected);
});
});
</script>
</body>
</html>