File size: 5.75Kb
<!-- 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/prism.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">Dark Version Layout</h5>
</div>
<div class="card-body">
<p class="mb-0">For the RTL page, just you have to add <span class="text-danger-main">dir="rtl"</span> attribute in your <span class="text-danger-main">html</span> tag</p>
<div class="code-area">
<button class="copy-code-btn btn-clipboard" data-clipboard-target="#scrollablecode" title="Copy">
<i class="ri-file-copy-line"></i> Copy
</button>
<pre><code class="language-html" id="scrollablecode">
<html lang="en" dir="rtl">
</html>
</code></pre>
</div>
<img src="assets/images/screen/rtl.png" alt="image">
</div>
</div>
</div>
</main>
<!-- All library -->
<script src="assets/js/plugins.js"></script>
<script src="assets/js/prism.js"></script>
<script src="assets/js/clipboard.min.js"></script>
<!-- main js -->
<script src="assets/js/app.js"></script>
<script>
$(document).ready(function () {
var clipboard = new ClipboardJS('.btn-clipboard');
clipboard.on('success', function (e) {
e.querySelector();
e.clearSelection();
});
clipboard.on('error', function (e) {
});
});
</script>
</body>
</html>