Skip to content

GitLab

Commit 4c981655 authored by JOE XMG's avatar JOE XMG
Browse files

update

parent d91dc71e
Pipeline #6783 passed with stage
in 9 seconds
Hide whitespace changes
Inline Side-by-side
public/dashboard/layout-rtl-backup.html 0 → 100644
View file @ 4c981655
<!DOCTYPE html>
<html lang="fa" dir="rtl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>RTL Layout - Mazer Admin Dashboard</title>
<link rel="stylesheet" href="assets/css/app.rtl.css">
<link rel="shortcut icon" href="assets/images/logo/favicon.svg" type="image/x-icon">
<link rel="shortcut icon" href="assets/images/logo/favicon.png" type="image/png">
<link rel="stylesheet" href="assets/css/shared/iconly.css">
</head>
<body>
<div id="app">
<div id="sidebar" class="active">
<div class="sidebar-wrapper active">
<div class="sidebar-header position-relative">
<div class="d-flex justify-content-between align-items-center">
<div class="logo">
<a href="index.html"><img src="assets/images/logo/logo.svg" alt="Logo" srcset=""></a>
</div>
<div class="theme-toggle d-flex gap-2 align-items-center mt-2">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--system-uicons" width="20" height="20" preserveAspectRatio="xMidYMid meet" viewBox="0 0 21 21"><g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"><path d="M10.5 14.5c2.219 0 4-1.763 4-3.982a4.003 4.003 0 0 0-4-4.018c-2.219 0-4 1.781-4 4c0 2.219 1.781 4 4 4zM4.136 4.136L5.55 5.55m9.9 9.9l1.414 1.414M1.5 10.5h2m14 0h2M4.135 16.863L5.55 15.45m9.899-9.9l1.414-1.415M10.5 19.5v-2m0-14v-2" opacity=".3"></path><g transform="translate(-210 -1)"><path d="M220.5 2.5v2m6.5.5l-1.5 1.5"></path><circle cx="220.5" cy="11.5" r="4"></circle><path d="m214 5l1.5 1.5m5 14v-2m6.5-.5l-1.5-1.5M214 18l1.5-1.5m-4-5h2m14 0h2"></path></g></g></svg>
<div class="form-check form-switch fs-6">
<input class="form-check-input me-0" type="checkbox" id="toggle-dark" >
<label class="form-check-label" ></label>
</div>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--mdi" width="20" height="20" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path fill="currentColor" d="m17.75 4.09l-2.53 1.94l.91 3.06l-2.63-1.81l-2.63 1.81l.91-3.06l-2.53-1.94L12.44 4l1.06-3l1.06 3l3.19.09m3.5 6.91l-1.64 1.25l.59 1.98l-1.7-1.17l-1.7 1.17l.59-1.98L15.75 11l2.06-.05L18.5 9l.69 1.95l2.06.05m-2.28 4.95c.83-.08 1.72 1.1 1.19 1.85c-.32.45-.66.87-1.08 1.27C15.17 23 8.84 23 4.94 19.07c-3.91-3.9-3.91-10.24 0-14.14c.4-.4.82-.76 1.27-1.08c.75-.53 1.93.36 1.85 1.19c-.27 2.86.69 5.83 2.89 8.02a9.96 9.96 0 0 0 8.02 2.89m-1.64 2.02a12.08 12.08 0 0 1-7.8-3.47c-2.17-2.19-3.33-5-3.49-7.82c-2.81 3.14-2.7 7.96.31 10.98c3.02 3.01 7.84 3.12 10.98.31Z"></path></svg>
</div>
<div class="sidebar-toggler x">
<a href="#" class="sidebar-hide d-xl-none d-block"><i class="bi bi-x bi-middle"></i></a>
</div>
</div>
</div>
<div class="sidebar-menu">
<ul class="menu">
<li class="sidebar-title">Menu</li>
<li
class="sidebar-item active ">
<a href="index.html" class='sidebar-link'>
<i class="bi bi-grid-fill"></i>
<span>Dashboard</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-stack"></i>
<span>Components</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="component-alert.html">Alert</a>
</li>
<li class="submenu-item ">
<a href="component-badge.html">Badge</a>
</li>
<li class="submenu-item ">
<a href="component-breadcrumb.html">Breadcrumb</a>
</li>
<li class="submenu-item ">
<a href="component-button.html">Button</a>
</li>
<li class="submenu-item ">
<a href="component-card.html">Card</a>
</li>
<li class="submenu-item ">
<a href="component-carousel.html">Carousel</a>
</li>
<li class="submenu-item ">
<a href="component-collapse.html">Collapse</a>
</li>
<li class="submenu-item ">
<a href="component-dropdown.html">Dropdown</a>
</li>
<li class="submenu-item ">
<a href="component-list-group.html">List Group</a>
</li>
<li class="submenu-item ">
<a href="component-modal.html">Modal</a>
</li>
<li class="submenu-item ">
<a href="component-navs.html">Navs</a>
</li>
<li class="submenu-item ">
<a href="component-pagination.html">Pagination</a>
</li>
<li class="submenu-item ">
<a href="component-progress.html">Progress</a>
</li>
<li class="submenu-item ">
<a href="component-spinner.html">Spinner</a>
</li>
<li class="submenu-item ">
<a href="component-tooltip.html">Tooltip</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-collection-fill"></i>
<span>Extra Components</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="extra-component-avatar.html">Avatar</a>
</li>
<li class="submenu-item ">
<a href="extra-component-sweetalert.html">Sweet Alert</a>
</li>
<li class="submenu-item ">
<a href="extra-component-toastify.html">Toastify</a>
</li>
<li class="submenu-item ">
<a href="extra-component-rating.html">Rating</a>
</li>
<li class="submenu-item ">
<a href="extra-component-divider.html">Divider</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-grid-1x2-fill"></i>
<span>Layouts</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="layout-default.html">Default Layout</a>
</li>
<li class="submenu-item ">
<a href="layout-vertical-1-column.html">1 Column</a>
</li>
<li class="submenu-item ">
<a href="layout-vertical-navbar.html">Vertical Navbar</a>
</li>
<li class="submenu-item ">
<a href="layout-rtl.html">RTL Layout</a>
</li>
<li class="submenu-item ">
<a href="layout-horizontal.html">Horizontal Menu</a>
</li>
</ul>
</li>
<li class="sidebar-title">Forms &amp; Tables</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-hexagon-fill"></i>
<span>Form Elements</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="form-element-input.html">Input</a>
</li>
<li class="submenu-item ">
<a href="form-element-input-group.html">Input Group</a>
</li>
<li class="submenu-item ">
<a href="form-element-select.html">Select</a>
</li>
<li class="submenu-item ">
<a href="form-element-radio.html">Radio</a>
</li>
<li class="submenu-item ">
<a href="form-element-checkbox.html">Checkbox</a>
</li>
<li class="submenu-item ">
<a href="form-element-textarea.html">Textarea</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="form-layout.html" class='sidebar-link'>
<i class="bi bi-file-earmark-medical-fill"></i>
<span>Form Layout</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-pen-fill"></i>
<span>Form Editor</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="form-editor-quill.html">Quill</a>
</li>
<li class="submenu-item ">
<a href="form-editor-ckeditor.html">CKEditor</a>
</li>
<li class="submenu-item ">
<a href="form-editor-summernote.html">Summernote</a>
</li>
<li class="submenu-item ">
<a href="form-editor-tinymce.html">TinyMCE</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="table.html" class='sidebar-link'>
<i class="bi bi-grid-1x2-fill"></i>
<span>Table</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-file-earmark-spreadsheet-fill"></i>
<span>Datatables</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="table-datatable.html">Datatable</a>
</li>
<li class="submenu-item ">
<a href="table-datatable-jquery.html">Datatable (jQuery)</a>
</li>
</ul>
</li>
<li class="sidebar-title">Extra UI</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-pentagon-fill"></i>
<span>Widgets</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-widgets-chatbox.html">Chatbox</a>
</li>
<li class="submenu-item ">
<a href="ui-widgets-pricing.html">Pricing</a>
</li>
<li class="submenu-item ">
<a href="ui-widgets-todolist.html">To-do List</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-egg-fill"></i>
<span>Icons</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-icons-bootstrap-icons.html">Bootstrap Icons </a>
</li>
<li class="submenu-item ">
<a href="ui-icons-fontawesome.html">Fontawesome</a>
</li>
<li class="submenu-item ">
<a href="ui-icons-dripicons.html">Dripicons</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-bar-chart-fill"></i>
<span>Charts</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-chart-chartjs.html">ChartJS</a>
</li>
<li class="submenu-item ">
<a href="ui-chart-apexcharts.html">Apexcharts</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="ui-file-uploader.html" class='sidebar-link'>
<i class="bi bi-cloud-arrow-up-fill"></i>
<span>File Uploader</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-map-fill"></i>
<span>Maps</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-map-google-map.html">Google Map</a>
</li>
<li class="submenu-item ">
<a href="ui-map-jsvectormap.html">JS Vector Map</a>
</li>
</ul>
</li>
<li class="sidebar-title">Pages</li>
<li
class="sidebar-item ">
<a href="application-email.html" class='sidebar-link'>
<i class="bi bi-envelope-fill"></i>
<span>Email Application</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-chat.html" class='sidebar-link'>
<i class="bi bi-chat-dots-fill"></i>
<span>Chat Application</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-gallery.html" class='sidebar-link'>
<i class="bi bi-image-fill"></i>
<span>Photo Gallery</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-checkout.html" class='sidebar-link'>
<i class="bi bi-basket-fill"></i>
<span>Checkout Page</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-person-badge-fill"></i>
<span>Authentication</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="auth-login.html">Login</a>
</li>
<li class="submenu-item ">
<a href="auth-register.html">Register</a>
</li>
<li class="submenu-item ">
<a href="auth-forgot-password.html">Forgot Password</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-x-octagon-fill"></i>
<span>Errors</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="error-403.html">403</a>
</li>
<li class="submenu-item ">
<a href="error-404.html">404</a>
</li>
<li class="submenu-item ">
<a href="error-500.html">500</a>
</li>
</ul>
</li>
<li class="sidebar-title">Raise Support</li>
<li
class="sidebar-item ">
<a href="https://zuramai.github.io/mazer/docs" class='sidebar-link'>
<i class="bi bi-life-preserver"></i>
<span>Documentation</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="https://github.com/zuramai/mazer/blob/main/CONTRIBUTING.md" class='sidebar-link'>
<i class="bi bi-puzzle"></i>
<span>Contribute</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="https://github.com/zuramai/mazer#donation" class='sidebar-link'>
<i class="bi bi-cash"></i>
<span>Donate</span>
</a>
</li>
</ul>
</div>
</div>
</div>
<div id="main">
<header class="mb-3">
<a href="#" class="burger-btn d-block d-xl-none">
<i class="bi bi-justify fs-3"></i>
</a>
</header>
<div class="page-heading">
<h3>Profile Statistics</h3>
</div>
<div class="page-content">
<section class="row">
<div class="col-12 col-lg-9">
<div class="row">
<div class="col-6 col-lg-3 col-md-6">
<div class="card">
<div class="card-body px-3 py-4-5">
<div class="row">
<div class="col-md-4">
<div class="stats-icon purple">
<i class="iconly-boldShow"></i>
</div>
</div>
<div class="col-md-8">
<h6 class="text-muted font-semibold">Profile Views</h6>
<h6 class="font-extrabold mb-0">112.000</h6>
</div>
</div>
</div>
</div>
</div>
<div class="col-6 col-lg-3 col-md-6">
<div class="card">
<div class="card-body px-3 py-4-5">
<div class="row">
<div class="col-md-4">
<div class="stats-icon blue">
<i class="iconly-boldProfile"></i>
</div>
</div>
<div class="col-md-8">
<h6 class="text-muted font-semibold">Followers</h6>
<h6 class="font-extrabold mb-0">183.000</h6>
</div>
</div>
</div>
</div>
</div>
<div class="col-6 col-lg-3 col-md-6">
<div class="card">
<div class="card-body px-3 py-4-5">
<div class="row">
<div class="col-md-4">
<div class="stats-icon green">
<i class="iconly-boldAdd-User"></i>
</div>
</div>
<div class="col-md-8">
<h6 class="text-muted font-semibold">Following</h6>
<h6 class="font-extrabold mb-0">80.000</h6>
</div>
</div>
</div>
</div>
</div>
<div class="col-6 col-lg-3 col-md-6">
<div class="card">
<div class="card-body px-3 py-4-5">
<div class="row">
<div class="col-md-4">
<div class="stats-icon red">
<i class="iconly-boldBookmark"></i>
</div>
</div>
<div class="col-md-8">
<h6 class="text-muted font-semibold">Saved Post</h6>
<h6 class="font-extrabold mb-0">112</h6>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-header">
<h4>Profile Visit</h4>
</div>
<div class="card-body">
<div id="chart-profile-visit"></div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-12 col-xl-4">
<div class="card">
<div class="card-header">
<h4>Profile Visit</h4>
</div>
<div class="card-body">
<div class="row">
<div class="col-6">
<div class="d-flex align-items-center">
<svg class="bi text-primary" width="32" height="32" fill="blue"
style="width:10px">
<use
xlink:href="assets/images/bootstrap-icons.svg#circle-fill" />
</svg>
<h5 class="mb-0 ms-3">Europe</h5>
</div>
</div>
<div class="col-6">
<h5 class="mb-0">862</h5>
</div>
<div class="col-12">
<div id="chart-europe"></div>
</div>
</div>
<div class="row">
<div class="col-6">
<div class="d-flex align-items-center">
<svg class="bi text-success" width="32" height="32" fill="blue"
style="width:10px">
<use
xlink:href="assets/images/bootstrap-icons.svg#circle-fill" />
</svg>
<h5 class="mb-0 ms-3">America</h5>
</div>
</div>
<div class="col-6">
<h5 class="mb-0">375</h5>
</div>
<div class="col-12">
<div id="chart-america"></div>
</div>
</div>
<div class="row">
<div class="col-6">
<div class="d-flex align-items-center">
<svg class="bi text-danger" width="32" height="32" fill="blue"
style="width:10px">
<use
xlink:href="assets/images/bootstrap-icons.svg#circle-fill" />
</svg>
<h5 class="mb-0 ms-3">Indonesia</h5>
</div>
</div>
<div class="col-6">
<h5 class="mb-0">1025</h5>
</div>
<div class="col-12">
<div id="chart-indonesia"></div>
</div>
</div>
</div>
</div>
</div>
<div class="col-12 col-xl-8">
<div class="card">
<div class="card-header">
<h4>Latest Comments</h4>
</div>
<div class="card-body">
<div class="table-responsive">
<table class="table table-hover table-lg">
<thead>
<tr>
<th>Name</th>
<th>Comment</th>
</tr>
</thead>
<tbody>
<tr>
<td class="col-3">
<div class="d-flex align-items-center">
<div class="avatar avatar-md">
<img src="assets/images/faces/5.jpg">
</div>
<p class="font-bold ms-3 mb-0">Si Cantik</p>
</div>
</td>
<td class="col-auto">
<p class=" mb-0">Congratulations on your graduation!</p>
</td>
</tr>
<tr>
<td class="col-3">
<div class="d-flex align-items-center">
<div class="avatar avatar-md">
<img src="assets/images/faces/2.jpg">
</div>
<p class="font-bold ms-3 mb-0">Si Ganteng</p>
</div>
</td>
<td class="col-auto">
<p class=" mb-0">Wow amazing design! Can you make another tutorial for
this design?</p>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-12 col-lg-3">
<div class="card">
<div class="card-body py-4 px-5">
<div class="d-flex align-items-center">
<div class="avatar avatar-xl">
<img src="assets/images/faces/1.jpg" alt="Face 1">
</div>
<div class="ms-3 name">
<h5 class="font-bold">John Duck</h5>
<h6 class="text-muted mb-0">@johnducky</h6>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card-header">
<h4>Recent Messages</h4>
</div>
<div class="card-content pb-4">
<div class="recent-message d-flex px-4 py-3">
<div class="avatar avatar-lg">
<img src="assets/images/faces/4.jpg">
</div>
<div class="name ms-4">
<h5 class="mb-1">Hank Schrader</h5>
<h6 class="text-muted mb-0">@johnducky</h6>
</div>
</div>
<div class="recent-message d-flex px-4 py-3">
<div class="avatar avatar-lg">
<img src="assets/images/faces/5.jpg">
</div>
<div class="name ms-4">
<h5 class="mb-1">Dean Winchester</h5>
<h6 class="text-muted mb-0">@imdean</h6>
</div>
</div>
<div class="recent-message d-flex px-4 py-3">
<div class="avatar avatar-lg">
<img src="assets/images/faces/1.jpg">
</div>
<div class="name ms-4">
<h5 class="mb-1">John Dodol</h5>
<h6 class="text-muted mb-0">@dodoljohn</h6>
</div>
</div>
<div class="px-4">
<button class='btn btn-block btn-xl btn-light-primary font-bold mt-3'>Start
Conversation</button>
</div>
</div>
</div>
<div class="card">
<div class="card-header">
<h4>Visitors Profile</h4>
</div>
<div class="card-body">
<div id="chart-visitors-profile"></div>
</div>
</div>
</div>
</section>
</div>
<footer>
<div class="footer clearfix mb-0 text-muted">
<div class="float-start">
<p>2021 &copy; Mazer</p>
</div>
<div class="float-end">
<p>Crafted with <span class="text-danger"><i class="bi bi-heart"></i></span> by <a
href="https://saugi.me">Saugi</a></p>
</div>
</div>
</footer>
</div>
</div>
<script src="assets/js/app.js"></script>
<script src="assets/js/pages/dashboard.js"></script>
</body>
</html>
public/dashboard/layout-rtl.html 0 → 100644
View file @ 4c981655
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>RTL Layout - Mazer Admin Dashboard</title>
<link rel="stylesheet" href="assets/css/main/app.css">
<link rel="stylesheet" href="assets/css/main/app-dark.css">
<link rel="shortcut icon" href="assets/images/logo/favicon.svg" type="image/x-icon">
<link rel="shortcut icon" href="assets/images/logo/favicon.png" type="image/png">
</head>
<body>
<div id="app">
<div id="sidebar" class="active">
<div class="sidebar-wrapper active">
<div class="sidebar-header position-relative">
<div class="d-flex justify-content-between align-items-center">
<div class="logo">
<a href="index.html"><img src="assets/images/logo/logo.svg" alt="Logo" srcset=""></a>
</div>
<div class="theme-toggle d-flex gap-2 align-items-center mt-2">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--system-uicons" width="20" height="20" preserveAspectRatio="xMidYMid meet" viewBox="0 0 21 21"><g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"><path d="M10.5 14.5c2.219 0 4-1.763 4-3.982a4.003 4.003 0 0 0-4-4.018c-2.219 0-4 1.781-4 4c0 2.219 1.781 4 4 4zM4.136 4.136L5.55 5.55m9.9 9.9l1.414 1.414M1.5 10.5h2m14 0h2M4.135 16.863L5.55 15.45m9.899-9.9l1.414-1.415M10.5 19.5v-2m0-14v-2" opacity=".3"></path><g transform="translate(-210 -1)"><path d="M220.5 2.5v2m6.5.5l-1.5 1.5"></path><circle cx="220.5" cy="11.5" r="4"></circle><path d="m214 5l1.5 1.5m5 14v-2m6.5-.5l-1.5-1.5M214 18l1.5-1.5m-4-5h2m14 0h2"></path></g></g></svg>
<div class="form-check form-switch fs-6">
<input class="form-check-input me-0" type="checkbox" id="toggle-dark" >
<label class="form-check-label" ></label>
</div>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--mdi" width="20" height="20" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path fill="currentColor" d="m17.75 4.09l-2.53 1.94l.91 3.06l-2.63-1.81l-2.63 1.81l.91-3.06l-2.53-1.94L12.44 4l1.06-3l1.06 3l3.19.09m3.5 6.91l-1.64 1.25l.59 1.98l-1.7-1.17l-1.7 1.17l.59-1.98L15.75 11l2.06-.05L18.5 9l.69 1.95l2.06.05m-2.28 4.95c.83-.08 1.72 1.1 1.19 1.85c-.32.45-.66.87-1.08 1.27C15.17 23 8.84 23 4.94 19.07c-3.91-3.9-3.91-10.24 0-14.14c.4-.4.82-.76 1.27-1.08c.75-.53 1.93.36 1.85 1.19c-.27 2.86.69 5.83 2.89 8.02a9.96 9.96 0 0 0 8.02 2.89m-1.64 2.02a12.08 12.08 0 0 1-7.8-3.47c-2.17-2.19-3.33-5-3.49-7.82c-2.81 3.14-2.7 7.96.31 10.98c3.02 3.01 7.84 3.12 10.98.31Z"></path></svg>
</div>
<div class="sidebar-toggler x">
<a href="#" class="sidebar-hide d-xl-none d-block"><i class="bi bi-x bi-middle"></i></a>
</div>
</div>
</div>
<div class="sidebar-menu">
<ul class="menu">
<li class="sidebar-title">Menu</li>
<li
class="sidebar-item ">
<a href="index.html" class='sidebar-link'>
<i class="bi bi-grid-fill"></i>
<span>Dashboard</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-stack"></i>
<span>Components</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="component-alert.html">Alert</a>
</li>
<li class="submenu-item ">
<a href="component-badge.html">Badge</a>
</li>
<li class="submenu-item ">
<a href="component-breadcrumb.html">Breadcrumb</a>
</li>
<li class="submenu-item ">
<a href="component-button.html">Button</a>
</li>
<li class="submenu-item ">
<a href="component-card.html">Card</a>
</li>
<li class="submenu-item ">
<a href="component-carousel.html">Carousel</a>
</li>
<li class="submenu-item ">
<a href="component-collapse.html">Collapse</a>
</li>
<li class="submenu-item ">
<a href="component-dropdown.html">Dropdown</a>
</li>
<li class="submenu-item ">
<a href="component-list-group.html">List Group</a>
</li>
<li class="submenu-item ">
<a href="component-modal.html">Modal</a>
</li>
<li class="submenu-item ">
<a href="component-navs.html">Navs</a>
</li>
<li class="submenu-item ">
<a href="component-pagination.html">Pagination</a>
</li>
<li class="submenu-item ">
<a href="component-progress.html">Progress</a>
</li>
<li class="submenu-item ">
<a href="component-spinner.html">Spinner</a>
</li>
<li class="submenu-item ">
<a href="component-tooltip.html">Tooltip</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-collection-fill"></i>
<span>Extra Components</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="extra-component-avatar.html">Avatar</a>
</li>
<li class="submenu-item ">
<a href="extra-component-sweetalert.html">Sweet Alert</a>
</li>
<li class="submenu-item ">
<a href="extra-component-toastify.html">Toastify</a>
</li>
<li class="submenu-item ">
<a href="extra-component-rating.html">Rating</a>
</li>
<li class="submenu-item ">
<a href="extra-component-divider.html">Divider</a>
</li>
</ul>
</li>
<li
class="sidebar-item active has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-grid-1x2-fill"></i>
<span>Layouts</span>
</a>
<ul class="submenu active">
<li class="submenu-item ">
<a href="layout-default.html">Default Layout</a>
</li>
<li class="submenu-item ">
<a href="layout-vertical-1-column.html">1 Column</a>
</li>
<li class="submenu-item ">
<a href="layout-vertical-navbar.html">Vertical Navbar</a>
</li>
<li class="submenu-item ">
<a href="layout-rtl.html">RTL Layout</a>
</li>
<li class="submenu-item ">
<a href="layout-horizontal.html">Horizontal Menu</a>
</li>
</ul>
</li>
<li class="sidebar-title">Forms &amp; Tables</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-hexagon-fill"></i>
<span>Form Elements</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="form-element-input.html">Input</a>
</li>
<li class="submenu-item ">
<a href="form-element-input-group.html">Input Group</a>
</li>
<li class="submenu-item ">
<a href="form-element-select.html">Select</a>
</li>
<li class="submenu-item ">
<a href="form-element-radio.html">Radio</a>
</li>
<li class="submenu-item ">
<a href="form-element-checkbox.html">Checkbox</a>
</li>
<li class="submenu-item ">
<a href="form-element-textarea.html">Textarea</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="form-layout.html" class='sidebar-link'>
<i class="bi bi-file-earmark-medical-fill"></i>
<span>Form Layout</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-pen-fill"></i>
<span>Form Editor</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="form-editor-quill.html">Quill</a>
</li>
<li class="submenu-item ">
<a href="form-editor-ckeditor.html">CKEditor</a>
</li>
<li class="submenu-item ">
<a href="form-editor-summernote.html">Summernote</a>
</li>
<li class="submenu-item ">
<a href="form-editor-tinymce.html">TinyMCE</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="table.html" class='sidebar-link'>
<i class="bi bi-grid-1x2-fill"></i>
<span>Table</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-file-earmark-spreadsheet-fill"></i>
<span>Datatables</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="table-datatable.html">Datatable</a>
</li>
<li class="submenu-item ">
<a href="table-datatable-jquery.html">Datatable (jQuery)</a>
</li>
</ul>
</li>
<li class="sidebar-title">Extra UI</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-pentagon-fill"></i>
<span>Widgets</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-widgets-chatbox.html">Chatbox</a>
</li>
<li class="submenu-item ">
<a href="ui-widgets-pricing.html">Pricing</a>
</li>
<li class="submenu-item ">
<a href="ui-widgets-todolist.html">To-do List</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-egg-fill"></i>
<span>Icons</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-icons-bootstrap-icons.html">Bootstrap Icons </a>
</li>
<li class="submenu-item ">
<a href="ui-icons-fontawesome.html">Fontawesome</a>
</li>
<li class="submenu-item ">
<a href="ui-icons-dripicons.html">Dripicons</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-bar-chart-fill"></i>
<span>Charts</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-chart-chartjs.html">ChartJS</a>
</li>
<li class="submenu-item ">
<a href="ui-chart-apexcharts.html">Apexcharts</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="ui-file-uploader.html" class='sidebar-link'>
<i class="bi bi-cloud-arrow-up-fill"></i>
<span>File Uploader</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-map-fill"></i>
<span>Maps</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-map-google-map.html">Google Map</a>
</li>
<li class="submenu-item ">
<a href="ui-map-jsvectormap.html">JS Vector Map</a>
</li>
</ul>
</li>
<li class="sidebar-title">Pages</li>
<li
class="sidebar-item ">
<a href="application-email.html" class='sidebar-link'>
<i class="bi bi-envelope-fill"></i>
<span>Email Application</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-chat.html" class='sidebar-link'>
<i class="bi bi-chat-dots-fill"></i>
<span>Chat Application</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-gallery.html" class='sidebar-link'>
<i class="bi bi-image-fill"></i>
<span>Photo Gallery</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-checkout.html" class='sidebar-link'>
<i class="bi bi-basket-fill"></i>
<span>Checkout Page</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-person-badge-fill"></i>
<span>Authentication</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="auth-login.html">Login</a>
</li>
<li class="submenu-item ">
<a href="auth-register.html">Register</a>
</li>
<li class="submenu-item ">
<a href="auth-forgot-password.html">Forgot Password</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-x-octagon-fill"></i>
<span>Errors</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="error-403.html">403</a>
</li>
<li class="submenu-item ">
<a href="error-404.html">404</a>
</li>
<li class="submenu-item ">
<a href="error-500.html">500</a>
</li>
</ul>
</li>
<li class="sidebar-title">Raise Support</li>
<li
class="sidebar-item ">
<a href="https://zuramai.github.io/mazer/docs" class='sidebar-link'>
<i class="bi bi-life-preserver"></i>
<span>Documentation</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="https://github.com/zuramai/mazer/blob/main/CONTRIBUTING.md" class='sidebar-link'>
<i class="bi bi-puzzle"></i>
<span>Contribute</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="https://github.com/zuramai/mazer#donation" class='sidebar-link'>
<i class="bi bi-cash"></i>
<span>Donate</span>
</a>
</li>
</ul>
</div>
</div>
</div>
<div id="main">
<header class="mb-3">
<a href="#" class="burger-btn d-block d-xl-none">
<i class="bi bi-justify fs-3"></i>
</a>
</header>
<div class="page-heading">
<div class="page-title">
<div class="row">
<div class="col-12 col-md-6 order-md-1 order-last">
<h3>RTL Layout</h3>
<p class="text-subtitle text-muted">
Right-to-left support in Mazer
</p>
</div>
<div class="col-12 col-md-6 order-md-2 order-first">
<nav
aria-label="breadcrumb"
class="breadcrumb-header float-start float-lg-end"
>
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="index.html">Dashboard</a>
</li>
<li class="breadcrumb-item active" aria-current="page">
RTL Layout
</li>
</ol>
</nav>
</div>
</div>
</div>
<section class="section">
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-header">
<h5 class="card-title">Coming back Soon!</h5>
</div>
<div class="card-body">
<p>
RTL support is under construction for the current
release. <br />
When needed, RTL support is available in older
releases of Mazer.
</p>
If you want to contribute, check out our
<a
href="https://github.com/zuramai/mazer"
target="_blank"
>template repository</a
>.
</div>
</div>
</div>
</div>
</section>
</div>
<footer>
<div class="footer clearfix mb-0 text-muted">
<div class="float-start">
<p>2021 &copy; Mazer</p>
</div>
<div class="float-end">
<p>Crafted with <span class="text-danger"><i class="bi bi-heart"></i></span> by <a
href="https://saugi.me">Saugi</a></p>
</div>
</div>
</footer>
</div>
</div>
<script src="assets/js/app.js"></script>
</body>
</html>
public/dashboard/layout-vertical-1-column.html 0 → 100644
View file @ 4c981655
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Layout Vertical 1 Column - Mazer</title>
<link rel="stylesheet" href="assets/css/main/app.css">
<link rel="shortcut icon" href="assets/images/logo/favicon.svg" type="image/x-icon">
<link rel="shortcut icon" href="assets/images/logo/favicon.png" type="image/png">
</head>
<body>
<nav class="navbar navbar-light">
<div class="container d-block">
<a href="index.html"><i class="bi bi-chevron-left"></i></a>
<a class="navbar-brand ms-4" href="index.html">
<img src="assets/images/logo/logo.svg">
</a>
</div>
</nav>
<div class="container">
<div class="card mt-5">
<div class="card-header">
<h4 class="card-title">Single Layout</h4>
</div>
<div class="card-body">
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Possimus nemo quasi labore expedita? Veritatis
at maxime id voluptates excepturi molestiae possimus blanditiis dicta consequuntur maiores suscipit,
eveniet neque obcaecati doloribus.</p>
</div>
</div>
</div>
</body>
</html>
public/dashboard/layout-vertical-navbar.html 0 → 100644
View file @ 4c981655
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Vertical Navbar - Mazer Admin Dashboard</title>
<link rel="stylesheet" href="assets/css/main/app.css">
<link rel="shortcut icon" href="assets/images/logo/favicon.svg" type="image/x-icon">
<link rel="shortcut icon" href="assets/images/logo/favicon.png" type="image/png">
</head>
<body>
<div id="app">
<div id="sidebar" class="active">
<div class="sidebar-wrapper active">
<div class="sidebar-header position-relative">
<div class="d-flex justify-content-between align-items-center">
<div class="logo">
<a href="index.html"><img src="assets/images/logo/logo.svg" alt="Logo" srcset=""></a>
</div>
<div class="theme-toggle d-flex gap-2 align-items-center mt-2">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--system-uicons" width="20" height="20" preserveAspectRatio="xMidYMid meet" viewBox="0 0 21 21"><g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"><path d="M10.5 14.5c2.219 0 4-1.763 4-3.982a4.003 4.003 0 0 0-4-4.018c-2.219 0-4 1.781-4 4c0 2.219 1.781 4 4 4zM4.136 4.136L5.55 5.55m9.9 9.9l1.414 1.414M1.5 10.5h2m14 0h2M4.135 16.863L5.55 15.45m9.899-9.9l1.414-1.415M10.5 19.5v-2m0-14v-2" opacity=".3"></path><g transform="translate(-210 -1)"><path d="M220.5 2.5v2m6.5.5l-1.5 1.5"></path><circle cx="220.5" cy="11.5" r="4"></circle><path d="m214 5l1.5 1.5m5 14v-2m6.5-.5l-1.5-1.5M214 18l1.5-1.5m-4-5h2m14 0h2"></path></g></g></svg>
<div class="form-check form-switch fs-6">
<input class="form-check-input me-0" type="checkbox" id="toggle-dark" >
<label class="form-check-label" ></label>
</div>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--mdi" width="20" height="20" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path fill="currentColor" d="m17.75 4.09l-2.53 1.94l.91 3.06l-2.63-1.81l-2.63 1.81l.91-3.06l-2.53-1.94L12.44 4l1.06-3l1.06 3l3.19.09m3.5 6.91l-1.64 1.25l.59 1.98l-1.7-1.17l-1.7 1.17l.59-1.98L15.75 11l2.06-.05L18.5 9l.69 1.95l2.06.05m-2.28 4.95c.83-.08 1.72 1.1 1.19 1.85c-.32.45-.66.87-1.08 1.27C15.17 23 8.84 23 4.94 19.07c-3.91-3.9-3.91-10.24 0-14.14c.4-.4.82-.76 1.27-1.08c.75-.53 1.93.36 1.85 1.19c-.27 2.86.69 5.83 2.89 8.02a9.96 9.96 0 0 0 8.02 2.89m-1.64 2.02a12.08 12.08 0 0 1-7.8-3.47c-2.17-2.19-3.33-5-3.49-7.82c-2.81 3.14-2.7 7.96.31 10.98c3.02 3.01 7.84 3.12 10.98.31Z"></path></svg>
</div>
<div class="sidebar-toggler x">
<a href="#" class="sidebar-hide d-xl-none d-block"><i class="bi bi-x bi-middle"></i></a>
</div>
</div>
</div>
<div class="sidebar-menu">
<ul class="menu">
<li class="sidebar-title">Menu</li>
<li
class="sidebar-item ">
<a href="index.html" class='sidebar-link'>
<i class="bi bi-grid-fill"></i>
<span>Dashboard</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-stack"></i>
<span>Components</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="component-alert.html">Alert</a>
</li>
<li class="submenu-item ">
<a href="component-badge.html">Badge</a>
</li>
<li class="submenu-item ">
<a href="component-breadcrumb.html">Breadcrumb</a>
</li>
<li class="submenu-item ">
<a href="component-button.html">Button</a>
</li>
<li class="submenu-item ">
<a href="component-card.html">Card</a>
</li>
<li class="submenu-item ">
<a href="component-carousel.html">Carousel</a>
</li>
<li class="submenu-item ">
<a href="component-collapse.html">Collapse</a>
</li>
<li class="submenu-item ">
<a href="component-dropdown.html">Dropdown</a>
</li>
<li class="submenu-item ">
<a href="component-list-group.html">List Group</a>
</li>
<li class="submenu-item ">
<a href="component-modal.html">Modal</a>
</li>
<li class="submenu-item ">
<a href="component-navs.html">Navs</a>
</li>
<li class="submenu-item ">
<a href="component-pagination.html">Pagination</a>
</li>
<li class="submenu-item ">
<a href="component-progress.html">Progress</a>
</li>
<li class="submenu-item ">
<a href="component-spinner.html">Spinner</a>
</li>
<li class="submenu-item ">
<a href="component-tooltip.html">Tooltip</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-collection-fill"></i>
<span>Extra Components</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="extra-component-avatar.html">Avatar</a>
</li>
<li class="submenu-item ">
<a href="extra-component-sweetalert.html">Sweet Alert</a>
</li>
<li class="submenu-item ">
<a href="extra-component-toastify.html">Toastify</a>
</li>
<li class="submenu-item ">
<a href="extra-component-rating.html">Rating</a>
</li>
<li class="submenu-item ">
<a href="extra-component-divider.html">Divider</a>
</li>
</ul>
</li>
<li
class="sidebar-item active has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-grid-1x2-fill"></i>
<span>Layouts</span>
</a>
<ul class="submenu active">
<li class="submenu-item ">
<a href="layout-default.html">Default Layout</a>
</li>
<li class="submenu-item ">
<a href="layout-vertical-1-column.html">1 Column</a>
</li>
<li class="submenu-item active">
<a href="layout-vertical-navbar.html">Vertical Navbar</a>
</li>
<li class="submenu-item ">
<a href="layout-rtl.html">RTL Layout</a>
</li>
<li class="submenu-item ">
<a href="layout-horizontal.html">Horizontal Menu</a>
</li>
</ul>
</li>
<li class="sidebar-title">Forms &amp; Tables</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-hexagon-fill"></i>
<span>Form Elements</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="form-element-input.html">Input</a>
</li>
<li class="submenu-item ">
<a href="form-element-input-group.html">Input Group</a>
</li>
<li class="submenu-item ">
<a href="form-element-select.html">Select</a>
</li>
<li class="submenu-item ">
<a href="form-element-radio.html">Radio</a>
</li>
<li class="submenu-item ">
<a href="form-element-checkbox.html">Checkbox</a>
</li>
<li class="submenu-item ">
<a href="form-element-textarea.html">Textarea</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="form-layout.html" class='sidebar-link'>
<i class="bi bi-file-earmark-medical-fill"></i>
<span>Form Layout</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-pen-fill"></i>
<span>Form Editor</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="form-editor-quill.html">Quill</a>
</li>
<li class="submenu-item ">
<a href="form-editor-ckeditor.html">CKEditor</a>
</li>
<li class="submenu-item ">
<a href="form-editor-summernote.html">Summernote</a>
</li>
<li class="submenu-item ">
<a href="form-editor-tinymce.html">TinyMCE</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="table.html" class='sidebar-link'>
<i class="bi bi-grid-1x2-fill"></i>
<span>Table</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-file-earmark-spreadsheet-fill"></i>
<span>Datatables</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="table-datatable.html">Datatable</a>
</li>
<li class="submenu-item ">
<a href="table-datatable-jquery.html">Datatable (jQuery)</a>
</li>
</ul>
</li>
<li class="sidebar-title">Extra UI</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-pentagon-fill"></i>
<span>Widgets</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-widgets-chatbox.html">Chatbox</a>
</li>
<li class="submenu-item ">
<a href="ui-widgets-pricing.html">Pricing</a>
</li>
<li class="submenu-item ">
<a href="ui-widgets-todolist.html">To-do List</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-egg-fill"></i>
<span>Icons</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-icons-bootstrap-icons.html">Bootstrap Icons </a>
</li>
<li class="submenu-item ">
<a href="ui-icons-fontawesome.html">Fontawesome</a>
</li>
<li class="submenu-item ">
<a href="ui-icons-dripicons.html">Dripicons</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-bar-chart-fill"></i>
<span>Charts</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-chart-chartjs.html">ChartJS</a>
</li>
<li class="submenu-item ">
<a href="ui-chart-apexcharts.html">Apexcharts</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="ui-file-uploader.html" class='sidebar-link'>
<i class="bi bi-cloud-arrow-up-fill"></i>
<span>File Uploader</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-map-fill"></i>
<span>Maps</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-map-google-map.html">Google Map</a>
</li>
<li class="submenu-item ">
<a href="ui-map-jsvectormap.html">JS Vector Map</a>
</li>
</ul>
</li>
<li class="sidebar-title">Pages</li>
<li
class="sidebar-item ">
<a href="application-email.html" class='sidebar-link'>
<i class="bi bi-envelope-fill"></i>
<span>Email Application</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-chat.html" class='sidebar-link'>
<i class="bi bi-chat-dots-fill"></i>
<span>Chat Application</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-gallery.html" class='sidebar-link'>
<i class="bi bi-image-fill"></i>
<span>Photo Gallery</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-checkout.html" class='sidebar-link'>
<i class="bi bi-basket-fill"></i>
<span>Checkout Page</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-person-badge-fill"></i>
<span>Authentication</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="auth-login.html">Login</a>
</li>
<li class="submenu-item ">
<a href="auth-register.html">Register</a>
</li>
<li class="submenu-item ">
<a href="auth-forgot-password.html">Forgot Password</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-x-octagon-fill"></i>
<span>Errors</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="error-403.html">403</a>
</li>
<li class="submenu-item ">
<a href="error-404.html">404</a>
</li>
<li class="submenu-item ">
<a href="error-500.html">500</a>
</li>
</ul>
</li>
<li class="sidebar-title">Raise Support</li>
<li
class="sidebar-item ">
<a href="https://zuramai.github.io/mazer/docs" class='sidebar-link'>
<i class="bi bi-life-preserver"></i>
<span>Documentation</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="https://github.com/zuramai/mazer/blob/main/CONTRIBUTING.md" class='sidebar-link'>
<i class="bi bi-puzzle"></i>
<span>Contribute</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="https://github.com/zuramai/mazer#donation" class='sidebar-link'>
<i class="bi bi-cash"></i>
<span>Donate</span>
</a>
</li>
</ul>
</div>
</div>
</div>
<div id="main" class='layout-navbar'>
<header class='mb-3'>
<nav class="navbar navbar-expand navbar-light ">
<div class="container-fluid">
<a href="#" class="burger-btn d-block">
<i class="bi bi-justify fs-3"></i>
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse"
data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav ms-auto mb-2 mb-lg-0">
<li class="nav-item dropdown me-1">
<a class="nav-link active dropdown-toggle text-gray-600" href="#" data-bs-toggle="dropdown"
aria-expanded="false">
<i class='bi bi-envelope bi-sub fs-4'></i>
</a>
<ul class="dropdown-menu dropdown-menu-end" aria-labelledby="dropdownMenuButton">
<li>
<h6 class="dropdown-header">Mail</h6>
</li>
<li><a class="dropdown-item" href="#">No new mail</a></li>
</ul>
</li>
<li class="nav-item dropdown me-3">
<a class="nav-link active dropdown-toggle text-gray-600" href="#" data-bs-toggle="dropdown"
aria-expanded="false">
<i class='bi bi-bell bi-sub fs-4'></i>
</a>
<ul class="dropdown-menu dropdown-menu-end" aria-labelledby="dropdownMenuButton">
<li>
<h6 class="dropdown-header">Notifications</h6>
</li>
<li><a class="dropdown-item">No notification available</a></li>
</ul>
</li>
</ul>
<div class="dropdown">
<a href="#" data-bs-toggle="dropdown" aria-expanded="false">
<div class="user-menu d-flex">
<div class="user-name text-end me-3">
<h6 class="mb-0 text-gray-600">John Ducky</h6>
<p class="mb-0 text-sm text-gray-600">Administrator</p>
</div>
<div class="user-img d-flex align-items-center">
<div class="avatar avatar-md">
<img src="assets/images/faces/1.jpg">
</div>
</div>
</div>
</a>
<ul class="dropdown-menu dropdown-menu-end" aria-labelledby="dropdownMenuButton" style="min-width: 11rem;">
<li>
<h6 class="dropdown-header">Hello, John!</h6>
</li>
<li><a class="dropdown-item" href="#"><i class="icon-mid bi bi-person me-2"></i> My
Profile</a></li>
<li><a class="dropdown-item" href="#"><i class="icon-mid bi bi-gear me-2"></i>
Settings</a></li>
<li><a class="dropdown-item" href="#"><i class="icon-mid bi bi-wallet me-2"></i>
Wallet</a></li>
<li>
<hr class="dropdown-divider">
</li>
<li><a class="dropdown-item" href="#"><i
class="icon-mid bi bi-box-arrow-left me-2"></i> Logout</a></li>
</ul>
</div>
</div>
</div>
</nav>
</header>
<div id="main-content">
<div class="page-heading">
<div class="page-title">
<div class="row">
<div class="col-12 col-md-6 order-md-1 order-last">
<h3>Vertical Layout with Navbar</h3>
<p class="text-subtitle text-muted">Navbar will appear on the top of the page.</p>
</div>
<div class="col-12 col-md-6 order-md-2 order-first">
<nav aria-label="breadcrumb" class="breadcrumb-header float-start float-lg-end">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="index.html">Dashboard</a></li>
<li class="breadcrumb-item active" aria-current="page">Layout Vertical Navbar</li>
</ol>
</nav>
</div>
</div>
</div>
<section class="section">
<div class="card">
<div class="card-header">
<h4 class="card-title">Example Content</h4>
</div>
<div class="card-body">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Consectetur quas omnis laudantium tempore
exercitationem, expedita aspernatur sed officia asperiores unde tempora maxime odio reprehenderit
distinctio incidunt! Vel aspernatur dicta consequatur!
</div>
</div>
</section>
</div>
<footer>
<div class="footer clearfix mb-0 text-muted">
<div class="float-start">
<p>2021 &copy; Mazer</p>
</div>
<div class="float-end">
<p>Crafted with <span class="text-danger"><i class="bi bi-heart-fill icon-mid"></i></span>
by <a href="https://ahmadsaugi.com">Saugi</a></p>
</div>
</div>
</footer>
</div>
</div>
</div>
<script src="assets/js/app.js"></script>
</body>
</html>
public/dashboard/mix-manifest.json 0 → 100644
View file @ 4c981655
{
"/assets/js/app.js": "/assets/js/app.js",
"/assets/js/extensions/toastify.js": "/assets/js/extensions/toastify.js",
"/assets/js/extensions/sweetalert2.js": "/assets/js/extensions/sweetalert2.js",
"/assets/js/extensions/ckeditor.js": "/assets/js/extensions/ckeditor.js",
"/assets/js/extensions/ui-apexchart.js": "/assets/js/extensions/ui-apexchart.js",
"/assets/js/extensions/ui-chartjs.js": "/assets/js/extensions/ui-chartjs.js",
"/assets/js/extensions/ui-todolist.js": "/assets/js/extensions/ui-todolist.js",
"/assets/js/extensions/form-element-select.js": "/assets/js/extensions/form-element-select.js",
"/assets/js/extensions/datatables.js": "/assets/js/extensions/datatables.js",
"/assets/js/extensions/quill.js": "/assets/js/extensions/quill.js",
"/assets/js/extensions/rater-js.js": "/assets/js/extensions/rater-js.js",
"/assets/js/extensions/simple-datatables.js": "/assets/js/extensions/simple-datatables.js",
"/assets/js/extensions/summernote.js": "/assets/js/extensions/summernote.js",
"/assets/js/extensions/tinymce.js": "/assets/js/extensions/tinymce.js",
"/assets/js/extensions/filepond.js": "/assets/js/extensions/filepond.js",
"/assets/js/pages/dashboard.js": "/assets/js/pages/dashboard.js",
"/assets/js/pages/form-editor.js": "/assets/js/pages/form-editor.js",
"/assets/js/pages/horizontal-layout.js": "/assets/js/pages/horizontal-layout.js",
"/assets/css/main/app.css": "/assets/css/main/app.css",
"/assets/css/pages/filepond.css": "/assets/css/pages/filepond.css",
"/assets/css/pages/quill.css": "/assets/css/pages/quill.css",
"/assets/css/widgets/todo.css": "/assets/css/widgets/todo.css",
"/assets/css/pages/form-element-select.css": "/assets/css/pages/form-element-select.css",
"/assets/css/pages/summernote.css": "/assets/css/pages/summernote.css",
"/assets/css/pages/rater-js.css": "/assets/css/pages/rater-js.css",
"/assets/css/pages/simple-datatables.css": "/assets/css/pages/simple-datatables.css",
"/assets/css/pages/datatables.css": "/assets/css/pages/datatables.css",
"/assets/css/pages/fontawesome.css": "/assets/css/pages/fontawesome.css",
"/assets/css/pages/dripicons.css": "/assets/css/pages/dripicons.css",
"/assets/css/pages/email.css": "/assets/css/pages/email.css",
"/assets/css/pages/error.css": "/assets/css/pages/error.css",
"/assets/css/pages/auth.css": "/assets/css/pages/auth.css",
"/assets/css/main/app-dark.css": "/assets/css/main/app-dark.css",
"/assets/css/shared/iconly.css": "/assets/css/shared/iconly.css",
"/assets/css/widgets/chat.css": "/assets/css/widgets/chat.css",
"/assets/css/pages/sweetalert2.css": "/assets/css/pages/sweetalert2.css",
"/assets/css/pages/toastify.css": "/assets/css/pages/toastify.css",
"/assets/css/pages/chat.css": "/assets/css/pages/chat.css",
"/assets/images/bootstrap-icons.svg": "/assets/images/bootstrap-icons.svg"
}
public/dashboard/sensors.html 0 → 100644
View file @ 4c981655
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>IQG4iCity</title>
<link rel="stylesheet" href="assets/css/main/app.css">
<link rel="stylesheet" href="assets/css/main/app-dark.css">
<link rel="shortcut icon" href="assets/images/logo/favicon.svg" type="image/x-icon">
<link rel="shortcut icon" href="assets/images/logo/favicon.png" type="image/png">
<link rel="stylesheet" href="assets/css/shared/iconly.css">
<link rel="stylesheet" href="../application/assets/css/cesiumCustom.css">
<link href="https://unpkg.com/tabulator-tables/dist/css/tabulator.min.css" rel="stylesheet">
<script type="text/javascript" src="https://unpkg.com/tabulator-tables/dist/js/tabulator.min.js"></script>
</head>
<body>
<div id="app">
<div id="sidebar" class="active">
<div class="sidebar-wrapper active">
<div class="sidebar-header position-relative">
<div class="d-flex justify-content-between align-items-center">
<div class="logo">
<a href="index.html"><img src="../img/iCity.jpg" alt="Logo" srcset=""
style="height: 1.5em;"></a>
</div>
<div class="theme-toggle d-flex gap-2 align-items-center mt-2">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
aria-hidden="true" role="img" class="iconify iconify--system-uicons" width="20"
height="20" preserveAspectRatio="xMidYMid meet" viewBox="0 0 21 21">
<g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-linecap="round"
stroke-linejoin="round">
<path
d="M10.5 14.5c2.219 0 4-1.763 4-3.982a4.003 4.003 0 0 0-4-4.018c-2.219 0-4 1.781-4 4c0 2.219 1.781 4 4 4zM4.136 4.136L5.55 5.55m9.9 9.9l1.414 1.414M1.5 10.5h2m14 0h2M4.135 16.863L5.55 15.45m9.899-9.9l1.414-1.415M10.5 19.5v-2m0-14v-2"
opacity=".3"></path>
<g transform="translate(-210 -1)">
<path d="M220.5 2.5v2m6.5.5l-1.5 1.5"></path>
<circle cx="220.5" cy="11.5" r="4"></circle>
<path d="m214 5l1.5 1.5m5 14v-2m6.5-.5l-1.5-1.5M214 18l1.5-1.5m-4-5h2m14 0h2">
</path>
</g>
</g>
</svg>
<div class="form-check form-switch fs-6">
<input class="form-check-input me-0" type="checkbox" id="toggle-dark">
<label class="form-check-label"></label>
</div>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
aria-hidden="true" role="img" class="iconify iconify--mdi" width="20" height="20"
preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24">
<path fill="currentColor"
d="m17.75 4.09l-2.53 1.94l.91 3.06l-2.63-1.81l-2.63 1.81l.91-3.06l-2.53-1.94L12.44 4l1.06-3l1.06 3l3.19.09m3.5 6.91l-1.64 1.25l.59 1.98l-1.7-1.17l-1.7 1.17l.59-1.98L15.75 11l2.06-.05L18.5 9l.69 1.95l2.06.05m-2.28 4.95c.83-.08 1.72 1.1 1.19 1.85c-.32.45-.66.87-1.08 1.27C15.17 23 8.84 23 4.94 19.07c-3.91-3.9-3.91-10.24 0-14.14c.4-.4.82-.76 1.27-1.08c.75-.53 1.93.36 1.85 1.19c-.27 2.86.69 5.83 2.89 8.02a9.96 9.96 0 0 0 8.02 2.89m-1.64 2.02a12.08 12.08 0 0 1-7.8-3.47c-2.17-2.19-3.33-5-3.49-7.82c-2.81 3.14-2.7 7.96.31 10.98c3.02 3.01 7.84 3.12 10.98.31Z">
</path>
</svg>
</div>
<div class="sidebar-toggler x">
<a href="#" class="sidebar-hide d-xl-none d-block"><i class="bi bi-x bi-middle"></i></a>
</div>
</div>
</div>
<div class="sidebar-menu">
<ul class="menu">
<li class="sidebar-title">Menu</li>
<li class="sidebar-item">
<a href="index.html" class='sidebar-link'>
<i class="bi bi-grid-fill"></i>
<span>Dashboard</span>
</a>
</li>
<li class="sidebar-item active ">
<a href="sensor.html" class='sidebar-link'>
<i class="bi bi-router"></i>
<span>Utility Sensors</span>
</a>
</li>
</ul>
</div>
</div>
</div>
<div id="main">
<header class="mb-3">
<a href="#" class="burger-btn d-block d-xl-none">
<i class="bi bi-justify fs-3"></i>
</a>
</header>
<div class="page-heading">
<h3>iCity 2: IQG4iCity </h3>
<h5>(Buildings, Neighborhoods and Infrastructure) </h5>
</div>
<div class="page-content">
<section class="row">
<div class="col-12">
<div class="card">
<div class="card-header">
<h4><i class="bi bi-router"></i> Sensors</h4>
</div>
<div class="card-body">
<div id="table-area">
<p> Loading Sensor data... </p>
</div>
<div id="chart_area"></div>
</div>
</div>
</div>
</section>
</div>
<footer>
<div class="footer clearfix mb-0 text-muted">
<div class="float-start">
<p>2022 &copy; Joe T.S. HFT Stuttgart</p>
</div>
<!-- <div class="float-end">
<p>Crafted with <span class="text-danger"><i class="bi bi-heart"></i></span> by <a
href="https://saugi.me">Saugi</a></p>
</div> -->
</div>
</footer>
</div>
</div>
<!-- theme template -->
<script src="assets/js/app.js"></script>
<!-- Joe's Application -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<!-- <script src="https://cdn.jsdelivr.net/npm/apexcharts"></script> -->
<script>
var table;
var settings = {
"url": "https://steinbeis-3dps.eu/iqg4icity/iqg4icity_result.json",
"method": "GET",
};
$.ajax(settings).done(function (response) {
sta_last_result = response
// console.log(response);
try {
table = new Tabulator("#table-area", {
data: sta_last_result, //set initial table data
// autoColumns: true,
layout:"fitDataFill",
columns: [{
title: "STA ID",
field: "id"
},
{
title: "EUI ID",
field: "sensor_actual_id"
},
{
title: "Total Energy (kWh)",
field: "total_energy"
},
{
title: "Power (kW)",
field: "Power"
},
{
title: "Temp Consumption (C)",
field: "Heat_Consumption"
},
{
title: "Inlet temperature (C)",
field: "Inlet_temperature"
},
{
title: "Outlet temperature (C)",
field: "Outlet_temperature"
},
{
title: "Address",
field: "adress"
},
],
// pagination: true, //enable pagination
// paginationMode: "local", //enable remote pagination
// paginationSize: 10,
});
} catch (error) {
console.error(error)
}
});
// var table = new Tabulator("#table-area", {
// ajaxURL: "https://steinbeis-3dps.eu/iqg4icity/iqg4icity_result.json", //ajax URL
// });
</script>
<!-- <script src="assets/js/pages/dashboard.js"></script> -->
</body>
</html>
\ No newline at end of file
public/dashboard/table-datatable-jquery.html 0 → 100644
View file @ 4c981655
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Table Datatable Jquery - Mazer Admin Dashboard</title>
<link rel="stylesheet" href="assets/css/main/app.css">
<link rel="stylesheet" href="assets/css/main/app-dark.css">
<link rel="shortcut icon" href="assets/images/logo/favicon.svg" type="image/x-icon">
<link rel="shortcut icon" href="assets/images/logo/favicon.png" type="image/png">
<link rel="stylesheet" href="assets/css/pages/fontawesome.css">
<link rel="stylesheet" href="assets/css/pages/datatables.css">
</head>
<body>
<div id="app">
<div id="sidebar" class="active">
<div class="sidebar-wrapper active">
<div class="sidebar-header position-relative">
<div class="d-flex justify-content-between align-items-center">
<div class="logo">
<a href="index.html"><img src="assets/images/logo/logo.svg" alt="Logo" srcset=""></a>
</div>
<div class="theme-toggle d-flex gap-2 align-items-center mt-2">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--system-uicons" width="20" height="20" preserveAspectRatio="xMidYMid meet" viewBox="0 0 21 21"><g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"><path d="M10.5 14.5c2.219 0 4-1.763 4-3.982a4.003 4.003 0 0 0-4-4.018c-2.219 0-4 1.781-4 4c0 2.219 1.781 4 4 4zM4.136 4.136L5.55 5.55m9.9 9.9l1.414 1.414M1.5 10.5h2m14 0h2M4.135 16.863L5.55 15.45m9.899-9.9l1.414-1.415M10.5 19.5v-2m0-14v-2" opacity=".3"></path><g transform="translate(-210 -1)"><path d="M220.5 2.5v2m6.5.5l-1.5 1.5"></path><circle cx="220.5" cy="11.5" r="4"></circle><path d="m214 5l1.5 1.5m5 14v-2m6.5-.5l-1.5-1.5M214 18l1.5-1.5m-4-5h2m14 0h2"></path></g></g></svg>
<div class="form-check form-switch fs-6">
<input class="form-check-input me-0" type="checkbox" id="toggle-dark" >
<label class="form-check-label" ></label>
</div>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--mdi" width="20" height="20" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path fill="currentColor" d="m17.75 4.09l-2.53 1.94l.91 3.06l-2.63-1.81l-2.63 1.81l.91-3.06l-2.53-1.94L12.44 4l1.06-3l1.06 3l3.19.09m3.5 6.91l-1.64 1.25l.59 1.98l-1.7-1.17l-1.7 1.17l.59-1.98L15.75 11l2.06-.05L18.5 9l.69 1.95l2.06.05m-2.28 4.95c.83-.08 1.72 1.1 1.19 1.85c-.32.45-.66.87-1.08 1.27C15.17 23 8.84 23 4.94 19.07c-3.91-3.9-3.91-10.24 0-14.14c.4-.4.82-.76 1.27-1.08c.75-.53 1.93.36 1.85 1.19c-.27 2.86.69 5.83 2.89 8.02a9.96 9.96 0 0 0 8.02 2.89m-1.64 2.02a12.08 12.08 0 0 1-7.8-3.47c-2.17-2.19-3.33-5-3.49-7.82c-2.81 3.14-2.7 7.96.31 10.98c3.02 3.01 7.84 3.12 10.98.31Z"></path></svg>
</div>
<div class="sidebar-toggler x">
<a href="#" class="sidebar-hide d-xl-none d-block"><i class="bi bi-x bi-middle"></i></a>
</div>
</div>
</div>
<div class="sidebar-menu">
<ul class="menu">
<li class="sidebar-title">Menu</li>
<li
class="sidebar-item ">
<a href="index.html" class='sidebar-link'>
<i class="bi bi-grid-fill"></i>
<span>Dashboard</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-stack"></i>
<span>Components</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="component-alert.html">Alert</a>
</li>
<li class="submenu-item ">
<a href="component-badge.html">Badge</a>
</li>
<li class="submenu-item ">
<a href="component-breadcrumb.html">Breadcrumb</a>
</li>
<li class="submenu-item ">
<a href="component-button.html">Button</a>
</li>
<li class="submenu-item ">
<a href="component-card.html">Card</a>
</li>
<li class="submenu-item ">
<a href="component-carousel.html">Carousel</a>
</li>
<li class="submenu-item ">
<a href="component-collapse.html">Collapse</a>
</li>
<li class="submenu-item ">
<a href="component-dropdown.html">Dropdown</a>
</li>
<li class="submenu-item ">
<a href="component-list-group.html">List Group</a>
</li>
<li class="submenu-item ">
<a href="component-modal.html">Modal</a>
</li>
<li class="submenu-item ">
<a href="component-navs.html">Navs</a>
</li>
<li class="submenu-item ">
<a href="component-pagination.html">Pagination</a>
</li>
<li class="submenu-item ">
<a href="component-progress.html">Progress</a>
</li>
<li class="submenu-item ">
<a href="component-spinner.html">Spinner</a>
</li>
<li class="submenu-item ">
<a href="component-tooltip.html">Tooltip</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-collection-fill"></i>
<span>Extra Components</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="extra-component-avatar.html">Avatar</a>
</li>
<li class="submenu-item ">
<a href="extra-component-sweetalert.html">Sweet Alert</a>
</li>
<li class="submenu-item ">
<a href="extra-component-toastify.html">Toastify</a>
</li>
<li class="submenu-item ">
<a href="extra-component-rating.html">Rating</a>
</li>
<li class="submenu-item ">
<a href="extra-component-divider.html">Divider</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-grid-1x2-fill"></i>
<span>Layouts</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="layout-default.html">Default Layout</a>
</li>
<li class="submenu-item ">
<a href="layout-vertical-1-column.html">1 Column</a>
</li>
<li class="submenu-item ">
<a href="layout-vertical-navbar.html">Vertical Navbar</a>
</li>
<li class="submenu-item ">
<a href="layout-rtl.html">RTL Layout</a>
</li>
<li class="submenu-item ">
<a href="layout-horizontal.html">Horizontal Menu</a>
</li>
</ul>
</li>
<li class="sidebar-title">Forms &amp; Tables</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-hexagon-fill"></i>
<span>Form Elements</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="form-element-input.html">Input</a>
</li>
<li class="submenu-item ">
<a href="form-element-input-group.html">Input Group</a>
</li>
<li class="submenu-item ">
<a href="form-element-select.html">Select</a>
</li>
<li class="submenu-item ">
<a href="form-element-radio.html">Radio</a>
</li>
<li class="submenu-item ">
<a href="form-element-checkbox.html">Checkbox</a>
</li>
<li class="submenu-item ">
<a href="form-element-textarea.html">Textarea</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="form-layout.html" class='sidebar-link'>
<i class="bi bi-file-earmark-medical-fill"></i>
<span>Form Layout</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-pen-fill"></i>
<span>Form Editor</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="form-editor-quill.html">Quill</a>
</li>
<li class="submenu-item ">
<a href="form-editor-ckeditor.html">CKEditor</a>
</li>
<li class="submenu-item ">
<a href="form-editor-summernote.html">Summernote</a>
</li>
<li class="submenu-item ">
<a href="form-editor-tinymce.html">TinyMCE</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="table.html" class='sidebar-link'>
<i class="bi bi-grid-1x2-fill"></i>
<span>Table</span>
</a>
</li>
<li
class="sidebar-item active has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-file-earmark-spreadsheet-fill"></i>
<span>Datatables</span>
</a>
<ul class="submenu active">
<li class="submenu-item ">
<a href="table-datatable.html">Datatable</a>
</li>
<li class="submenu-item active">
<a href="table-datatable-jquery.html">Datatable (jQuery)</a>
</li>
</ul>
</li>
<li class="sidebar-title">Extra UI</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-pentagon-fill"></i>
<span>Widgets</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-widgets-chatbox.html">Chatbox</a>
</li>
<li class="submenu-item ">
<a href="ui-widgets-pricing.html">Pricing</a>
</li>
<li class="submenu-item ">
<a href="ui-widgets-todolist.html">To-do List</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-egg-fill"></i>
<span>Icons</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-icons-bootstrap-icons.html">Bootstrap Icons </a>
</li>
<li class="submenu-item ">
<a href="ui-icons-fontawesome.html">Fontawesome</a>
</li>
<li class="submenu-item ">
<a href="ui-icons-dripicons.html">Dripicons</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-bar-chart-fill"></i>
<span>Charts</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-chart-chartjs.html">ChartJS</a>
</li>
<li class="submenu-item ">
<a href="ui-chart-apexcharts.html">Apexcharts</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="ui-file-uploader.html" class='sidebar-link'>
<i class="bi bi-cloud-arrow-up-fill"></i>
<span>File Uploader</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-map-fill"></i>
<span>Maps</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-map-google-map.html">Google Map</a>
</li>
<li class="submenu-item ">
<a href="ui-map-jsvectormap.html">JS Vector Map</a>
</li>
</ul>
</li>
<li class="sidebar-title">Pages</li>
<li
class="sidebar-item ">
<a href="application-email.html" class='sidebar-link'>
<i class="bi bi-envelope-fill"></i>
<span>Email Application</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-chat.html" class='sidebar-link'>
<i class="bi bi-chat-dots-fill"></i>
<span>Chat Application</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-gallery.html" class='sidebar-link'>
<i class="bi bi-image-fill"></i>
<span>Photo Gallery</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-checkout.html" class='sidebar-link'>
<i class="bi bi-basket-fill"></i>
<span>Checkout Page</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-person-badge-fill"></i>
<span>Authentication</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="auth-login.html">Login</a>
</li>
<li class="submenu-item ">
<a href="auth-register.html">Register</a>
</li>
<li class="submenu-item ">
<a href="auth-forgot-password.html">Forgot Password</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-x-octagon-fill"></i>
<span>Errors</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="error-403.html">403</a>
</li>
<li class="submenu-item ">
<a href="error-404.html">404</a>
</li>
<li class="submenu-item ">
<a href="error-500.html">500</a>
</li>
</ul>
</li>
<li class="sidebar-title">Raise Support</li>
<li
class="sidebar-item ">
<a href="https://zuramai.github.io/mazer/docs" class='sidebar-link'>
<i class="bi bi-life-preserver"></i>
<span>Documentation</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="https://github.com/zuramai/mazer/blob/main/CONTRIBUTING.md" class='sidebar-link'>
<i class="bi bi-puzzle"></i>
<span>Contribute</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="https://github.com/zuramai/mazer#donation" class='sidebar-link'>
<i class="bi bi-cash"></i>
<span>Donate</span>
</a>
</li>
</ul>
</div>
</div>
</div>
<div id="main">
<header class="mb-3">
<a href="#" class="burger-btn d-block d-xl-none">
<i class="bi bi-justify fs-3"></i>
</a>
</header>
<div class="page-heading">
<div class="page-title">
<div class="row">
<div class="col-12 col-md-6 order-md-1 order-last">
<h3>DataTable Jquery</h3>
<p class="text-subtitle text-muted">Powerful interactive tables with datatables (jQuery required)</p>
</div>
<div class="col-12 col-md-6 order-md-2 order-first">
<nav aria-label="breadcrumb" class="breadcrumb-header float-start float-lg-end">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="index.html">Dashboard</a></li>
<li class="breadcrumb-item active" aria-current="page">DataTable Jquery</li>
</ol>
</nav>
</div>
</div>
</div>
<!-- Basic Tables start -->
<section class="section">
<div class="card">
<div class="card-header">
Jquery Datatable
</div>
<div class="card-body">
<table class="table" id="table1">
<thead>
<tr>
<th>Name</th>
<th>Email</th>
<th>Phone</th>
<th>City</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<tr>
<td>Graiden</td>
<td>vehicula.aliquet@semconsequat.co.uk</td>
<td>076 4820 8838</td>
<td>Offenburg</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Dale</td>
<td>fringilla.euismod.enim@quam.ca</td>
<td>0500 527693</td>
<td>New Quay</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Nathaniel</td>
<td>mi.Duis@diam.edu</td>
<td>(012165) 76278</td>
<td>Grumo Appula</td>
<td>
<span class="badge bg-danger">Inactive</span>
</td>
</tr>
<tr>
<td>Darius</td>
<td>velit@nec.com</td>
<td>0309 690 7871</td>
<td>Ways</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Oleg</td>
<td>rhoncus.id@Aliquamauctorvelit.net</td>
<td>0500 441046</td>
<td>Rossignol</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Kermit</td>
<td>diam.Sed.diam@anteVivamusnon.org</td>
<td>(01653) 27844</td>
<td>Patna</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Jermaine</td>
<td>sodales@nuncsit.org</td>
<td>0800 528324</td>
<td>Mold</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Ferdinand</td>
<td>gravida.molestie@tinciduntadipiscing.org</td>
<td>(016977) 4107</td>
<td>Marlborough</td>
<td>
<span class="badge bg-danger">Inactive</span>
</td>
</tr>
<tr>
<td>Kuame</td>
<td>Quisque.purus@mauris.org</td>
<td>(0151) 561 8896</td>
<td>Tresigallo</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Deacon</td>
<td>Duis.a.mi@sociisnatoquepenatibus.com</td>
<td>07740 599321</td>
<td>Karapınar</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Channing</td>
<td>tempor.bibendum.Donec@ornarelectusante.ca</td>
<td>0845 46 49</td>
<td>Warrnambool</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Aladdin</td>
<td>sem.ut@pellentesqueafacilisis.ca</td>
<td>0800 1111</td>
<td>Bothey</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Cruz</td>
<td>non@quisturpisvitae.ca</td>
<td>07624 944915</td>
<td>Shikarpur</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Keegan</td>
<td>molestie.dapibus@condimentumDonecat.edu</td>
<td>0800 200103</td>
<td>Assen</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Ray</td>
<td>placerat.eget@sagittislobortis.edu</td>
<td>(0112) 896 6829</td>
<td>Hofors</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Maxwell</td>
<td>diam@dapibus.org</td>
<td>0334 836 4028</td>
<td>Thane</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Carter</td>
<td>urna.justo.faucibus@orci.com</td>
<td>07079 826350</td>
<td>Biez</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Stone</td>
<td>velit.Aliquam.nisl@sitametrisus.com</td>
<td>0800 1111</td>
<td>Olivar</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Berk</td>
<td>fringilla.porttitor.vulputate@taciti.edu</td>
<td>(0101) 043 2822</td>
<td>Sanquhar</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Philip</td>
<td>turpis@euenimEtiam.org</td>
<td>0500 571108</td>
<td>Okara</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Kibo</td>
<td>feugiat@urnajustofaucibus.co.uk</td>
<td>07624 682306</td>
<td>La Cisterna</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Bruno</td>
<td>elit.Etiam.laoreet@luctuslobortisClass.edu</td>
<td>07624 869434</td>
<td>Rocca d"Arce</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Leonard</td>
<td>blandit.enim.consequat@mollislectuspede.net</td>
<td>0800 1111</td>
<td>Lobbes</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Hamilton</td>
<td>mauris@diam.org</td>
<td>0800 256 8788</td>
<td>Sanzeno</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Harding</td>
<td>Lorem.ipsum.dolor@etnetuset.com</td>
<td>0800 1111</td>
<td>Obaix</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Emmanuel</td>
<td>eget.lacus.Mauris@feugiatSednec.org</td>
<td>(016977) 8208</td>
<td>Saint-Remy-Geest</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</section>
<!-- Basic Tables end -->
</div>
<footer>
<div class="footer clearfix mb-0 text-muted">
<div class="float-start">
<p>2021 &copy; Mazer</p>
</div>
<div class="float-end">
<p>Crafted with <span class="text-danger"><i class="bi bi-heart"></i></span> by <a
href="https://saugi.me">Saugi</a></p>
</div>
</div>
</footer>
</div>
</div>
<script src="assets/js/app.js"></script>
<script src="assets/js/extensions/datatables.js"></script>
</body>
</html>
public/dashboard/table-datatable.html 0 → 100644
View file @ 4c981655
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>DataTable - Mazer Admin Dashboard</title>
<link rel="stylesheet" href="assets/css/main/app.css">
<link rel="stylesheet" href="assets/css/main/app-dark.css">
<link rel="shortcut icon" href="assets/images/logo/favicon.svg" type="image/x-icon">
<link rel="shortcut icon" href="assets/images/logo/favicon.png" type="image/png">
<link rel="stylesheet" href="assets/css/pages/simple-datatables.css">
</head>
<body>
<div id="app">
<div id="sidebar" class="active">
<div class="sidebar-wrapper active">
<div class="sidebar-header position-relative">
<div class="d-flex justify-content-between align-items-center">
<div class="logo">
<a href="index.html"><img src="assets/images/logo/logo.svg" alt="Logo" srcset=""></a>
</div>
<div class="theme-toggle d-flex gap-2 align-items-center mt-2">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--system-uicons" width="20" height="20" preserveAspectRatio="xMidYMid meet" viewBox="0 0 21 21"><g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"><path d="M10.5 14.5c2.219 0 4-1.763 4-3.982a4.003 4.003 0 0 0-4-4.018c-2.219 0-4 1.781-4 4c0 2.219 1.781 4 4 4zM4.136 4.136L5.55 5.55m9.9 9.9l1.414 1.414M1.5 10.5h2m14 0h2M4.135 16.863L5.55 15.45m9.899-9.9l1.414-1.415M10.5 19.5v-2m0-14v-2" opacity=".3"></path><g transform="translate(-210 -1)"><path d="M220.5 2.5v2m6.5.5l-1.5 1.5"></path><circle cx="220.5" cy="11.5" r="4"></circle><path d="m214 5l1.5 1.5m5 14v-2m6.5-.5l-1.5-1.5M214 18l1.5-1.5m-4-5h2m14 0h2"></path></g></g></svg>
<div class="form-check form-switch fs-6">
<input class="form-check-input me-0" type="checkbox" id="toggle-dark" >
<label class="form-check-label" ></label>
</div>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--mdi" width="20" height="20" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path fill="currentColor" d="m17.75 4.09l-2.53 1.94l.91 3.06l-2.63-1.81l-2.63 1.81l.91-3.06l-2.53-1.94L12.44 4l1.06-3l1.06 3l3.19.09m3.5 6.91l-1.64 1.25l.59 1.98l-1.7-1.17l-1.7 1.17l.59-1.98L15.75 11l2.06-.05L18.5 9l.69 1.95l2.06.05m-2.28 4.95c.83-.08 1.72 1.1 1.19 1.85c-.32.45-.66.87-1.08 1.27C15.17 23 8.84 23 4.94 19.07c-3.91-3.9-3.91-10.24 0-14.14c.4-.4.82-.76 1.27-1.08c.75-.53 1.93.36 1.85 1.19c-.27 2.86.69 5.83 2.89 8.02a9.96 9.96 0 0 0 8.02 2.89m-1.64 2.02a12.08 12.08 0 0 1-7.8-3.47c-2.17-2.19-3.33-5-3.49-7.82c-2.81 3.14-2.7 7.96.31 10.98c3.02 3.01 7.84 3.12 10.98.31Z"></path></svg>
</div>
<div class="sidebar-toggler x">
<a href="#" class="sidebar-hide d-xl-none d-block"><i class="bi bi-x bi-middle"></i></a>
</div>
</div>
</div>
<div class="sidebar-menu">
<ul class="menu">
<li class="sidebar-title">Menu</li>
<li
class="sidebar-item ">
<a href="index.html" class='sidebar-link'>
<i class="bi bi-grid-fill"></i>
<span>Dashboard</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-stack"></i>
<span>Components</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="component-alert.html">Alert</a>
</li>
<li class="submenu-item ">
<a href="component-badge.html">Badge</a>
</li>
<li class="submenu-item ">
<a href="component-breadcrumb.html">Breadcrumb</a>
</li>
<li class="submenu-item ">
<a href="component-button.html">Button</a>
</li>
<li class="submenu-item ">
<a href="component-card.html">Card</a>
</li>
<li class="submenu-item ">
<a href="component-carousel.html">Carousel</a>
</li>
<li class="submenu-item ">
<a href="component-collapse.html">Collapse</a>
</li>
<li class="submenu-item ">
<a href="component-dropdown.html">Dropdown</a>
</li>
<li class="submenu-item ">
<a href="component-list-group.html">List Group</a>
</li>
<li class="submenu-item ">
<a href="component-modal.html">Modal</a>
</li>
<li class="submenu-item ">
<a href="component-navs.html">Navs</a>
</li>
<li class="submenu-item ">
<a href="component-pagination.html">Pagination</a>
</li>
<li class="submenu-item ">
<a href="component-progress.html">Progress</a>
</li>
<li class="submenu-item ">
<a href="component-spinner.html">Spinner</a>
</li>
<li class="submenu-item ">
<a href="component-tooltip.html">Tooltip</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-collection-fill"></i>
<span>Extra Components</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="extra-component-avatar.html">Avatar</a>
</li>
<li class="submenu-item ">
<a href="extra-component-sweetalert.html">Sweet Alert</a>
</li>
<li class="submenu-item ">
<a href="extra-component-toastify.html">Toastify</a>
</li>
<li class="submenu-item ">
<a href="extra-component-rating.html">Rating</a>
</li>
<li class="submenu-item ">
<a href="extra-component-divider.html">Divider</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-grid-1x2-fill"></i>
<span>Layouts</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="layout-default.html">Default Layout</a>
</li>
<li class="submenu-item ">
<a href="layout-vertical-1-column.html">1 Column</a>
</li>
<li class="submenu-item ">
<a href="layout-vertical-navbar.html">Vertical Navbar</a>
</li>
<li class="submenu-item ">
<a href="layout-rtl.html">RTL Layout</a>
</li>
<li class="submenu-item ">
<a href="layout-horizontal.html">Horizontal Menu</a>
</li>
</ul>
</li>
<li class="sidebar-title">Forms &amp; Tables</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-hexagon-fill"></i>
<span>Form Elements</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="form-element-input.html">Input</a>
</li>
<li class="submenu-item ">
<a href="form-element-input-group.html">Input Group</a>
</li>
<li class="submenu-item ">
<a href="form-element-select.html">Select</a>
</li>
<li class="submenu-item ">
<a href="form-element-radio.html">Radio</a>
</li>
<li class="submenu-item ">
<a href="form-element-checkbox.html">Checkbox</a>
</li>
<li class="submenu-item ">
<a href="form-element-textarea.html">Textarea</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="form-layout.html" class='sidebar-link'>
<i class="bi bi-file-earmark-medical-fill"></i>
<span>Form Layout</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-pen-fill"></i>
<span>Form Editor</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="form-editor-quill.html">Quill</a>
</li>
<li class="submenu-item ">
<a href="form-editor-ckeditor.html">CKEditor</a>
</li>
<li class="submenu-item ">
<a href="form-editor-summernote.html">Summernote</a>
</li>
<li class="submenu-item ">
<a href="form-editor-tinymce.html">TinyMCE</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="table.html" class='sidebar-link'>
<i class="bi bi-grid-1x2-fill"></i>
<span>Table</span>
</a>
</li>
<li
class="sidebar-item active has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-file-earmark-spreadsheet-fill"></i>
<span>Datatables</span>
</a>
<ul class="submenu active">
<li class="submenu-item active">
<a href="table-datatable.html">Datatable</a>
</li>
<li class="submenu-item ">
<a href="table-datatable-jquery.html">Datatable (jQuery)</a>
</li>
</ul>
</li>
<li class="sidebar-title">Extra UI</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-pentagon-fill"></i>
<span>Widgets</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-widgets-chatbox.html">Chatbox</a>
</li>
<li class="submenu-item ">
<a href="ui-widgets-pricing.html">Pricing</a>
</li>
<li class="submenu-item ">
<a href="ui-widgets-todolist.html">To-do List</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-egg-fill"></i>
<span>Icons</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-icons-bootstrap-icons.html">Bootstrap Icons </a>
</li>
<li class="submenu-item ">
<a href="ui-icons-fontawesome.html">Fontawesome</a>
</li>
<li class="submenu-item ">
<a href="ui-icons-dripicons.html">Dripicons</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-bar-chart-fill"></i>
<span>Charts</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-chart-chartjs.html">ChartJS</a>
</li>
<li class="submenu-item ">
<a href="ui-chart-apexcharts.html">Apexcharts</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="ui-file-uploader.html" class='sidebar-link'>
<i class="bi bi-cloud-arrow-up-fill"></i>
<span>File Uploader</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-map-fill"></i>
<span>Maps</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-map-google-map.html">Google Map</a>
</li>
<li class="submenu-item ">
<a href="ui-map-jsvectormap.html">JS Vector Map</a>
</li>
</ul>
</li>
<li class="sidebar-title">Pages</li>
<li
class="sidebar-item ">
<a href="application-email.html" class='sidebar-link'>
<i class="bi bi-envelope-fill"></i>
<span>Email Application</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-chat.html" class='sidebar-link'>
<i class="bi bi-chat-dots-fill"></i>
<span>Chat Application</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-gallery.html" class='sidebar-link'>
<i class="bi bi-image-fill"></i>
<span>Photo Gallery</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-checkout.html" class='sidebar-link'>
<i class="bi bi-basket-fill"></i>
<span>Checkout Page</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-person-badge-fill"></i>
<span>Authentication</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="auth-login.html">Login</a>
</li>
<li class="submenu-item ">
<a href="auth-register.html">Register</a>
</li>
<li class="submenu-item ">
<a href="auth-forgot-password.html">Forgot Password</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-x-octagon-fill"></i>
<span>Errors</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="error-403.html">403</a>
</li>
<li class="submenu-item ">
<a href="error-404.html">404</a>
</li>
<li class="submenu-item ">
<a href="error-500.html">500</a>
</li>
</ul>
</li>
<li class="sidebar-title">Raise Support</li>
<li
class="sidebar-item ">
<a href="https://zuramai.github.io/mazer/docs" class='sidebar-link'>
<i class="bi bi-life-preserver"></i>
<span>Documentation</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="https://github.com/zuramai/mazer/blob/main/CONTRIBUTING.md" class='sidebar-link'>
<i class="bi bi-puzzle"></i>
<span>Contribute</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="https://github.com/zuramai/mazer#donation" class='sidebar-link'>
<i class="bi bi-cash"></i>
<span>Donate</span>
</a>
</li>
</ul>
</div>
</div>
</div>
<div id="main">
<header class="mb-3">
<a href="#" class="burger-btn d-block d-xl-none">
<i class="bi bi-justify fs-3"></i>
</a>
</header>
<div class="page-heading">
<div class="page-title">
<div class="row">
<div class="col-12 col-md-6 order-md-1 order-last">
<h3>DataTable</h3>
<p class="text-subtitle text-muted">A sortable, searchable, paginated table without dependencies thanks to simple-datatables</p>
</div>
<div class="col-12 col-md-6 order-md-2 order-first">
<nav aria-label="breadcrumb" class="breadcrumb-header float-start float-lg-end">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="index.html">Dashboard</a></li>
<li class="breadcrumb-item active" aria-current="page">DataTable</li>
</ol>
</nav>
</div>
</div>
</div>
<section class="section">
<div class="card">
<div class="card-header">
Simple Datatable
</div>
<div class="card-body">
<table class="table table-striped" id="table1">
<thead>
<tr>
<th>Name</th>
<th>Email</th>
<th>Phone</th>
<th>City</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<tr>
<td>Graiden</td>
<td>vehicula.aliquet@semconsequat.co.uk</td>
<td>076 4820 8838</td>
<td>Offenburg</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Dale</td>
<td>fringilla.euismod.enim@quam.ca</td>
<td>0500 527693</td>
<td>New Quay</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Nathaniel</td>
<td>mi.Duis@diam.edu</td>
<td>(012165) 76278</td>
<td>Grumo Appula</td>
<td>
<span class="badge bg-danger">Inactive</span>
</td>
</tr>
<tr>
<td>Darius</td>
<td>velit@nec.com</td>
<td>0309 690 7871</td>
<td>Ways</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Oleg</td>
<td>rhoncus.id@Aliquamauctorvelit.net</td>
<td>0500 441046</td>
<td>Rossignol</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Kermit</td>
<td>diam.Sed.diam@anteVivamusnon.org</td>
<td>(01653) 27844</td>
<td>Patna</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Jermaine</td>
<td>sodales@nuncsit.org</td>
<td>0800 528324</td>
<td>Mold</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Ferdinand</td>
<td>gravida.molestie@tinciduntadipiscing.org</td>
<td>(016977) 4107</td>
<td>Marlborough</td>
<td>
<span class="badge bg-danger">Inactive</span>
</td>
</tr>
<tr>
<td>Kuame</td>
<td>Quisque.purus@mauris.org</td>
<td>(0151) 561 8896</td>
<td>Tresigallo</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Deacon</td>
<td>Duis.a.mi@sociisnatoquepenatibus.com</td>
<td>07740 599321</td>
<td>Karapınar</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Channing</td>
<td>tempor.bibendum.Donec@ornarelectusante.ca</td>
<td>0845 46 49</td>
<td>Warrnambool</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Aladdin</td>
<td>sem.ut@pellentesqueafacilisis.ca</td>
<td>0800 1111</td>
<td>Bothey</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Cruz</td>
<td>non@quisturpisvitae.ca</td>
<td>07624 944915</td>
<td>Shikarpur</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Keegan</td>
<td>molestie.dapibus@condimentumDonecat.edu</td>
<td>0800 200103</td>
<td>Assen</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Ray</td>
<td>placerat.eget@sagittislobortis.edu</td>
<td>(0112) 896 6829</td>
<td>Hofors</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Maxwell</td>
<td>diam@dapibus.org</td>
<td>0334 836 4028</td>
<td>Thane</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Carter</td>
<td>urna.justo.faucibus@orci.com</td>
<td>07079 826350</td>
<td>Biez</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Stone</td>
<td>velit.Aliquam.nisl@sitametrisus.com</td>
<td>0800 1111</td>
<td>Olivar</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Berk</td>
<td>fringilla.porttitor.vulputate@taciti.edu</td>
<td>(0101) 043 2822</td>
<td>Sanquhar</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Philip</td>
<td>turpis@euenimEtiam.org</td>
<td>0500 571108</td>
<td>Okara</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Kibo</td>
<td>feugiat@urnajustofaucibus.co.uk</td>
<td>07624 682306</td>
<td>La Cisterna</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Bruno</td>
<td>elit.Etiam.laoreet@luctuslobortisClass.edu</td>
<td>07624 869434</td>
<td>Rocca d"Arce</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Leonard</td>
<td>blandit.enim.consequat@mollislectuspede.net</td>
<td>0800 1111</td>
<td>Lobbes</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Hamilton</td>
<td>mauris@diam.org</td>
<td>0800 256 8788</td>
<td>Sanzeno</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Harding</td>
<td>Lorem.ipsum.dolor@etnetuset.com</td>
<td>0800 1111</td>
<td>Obaix</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
<tr>
<td>Emmanuel</td>
<td>eget.lacus.Mauris@feugiatSednec.org</td>
<td>(016977) 8208</td>
<td>Saint-Remy-Geest</td>
<td>
<span class="badge bg-success">Active</span>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</section>
</div>
<footer>
<div class="footer clearfix mb-0 text-muted">
<div class="float-start">
<p>2021 &copy; Mazer</p>
</div>
<div class="float-end">
<p>Crafted with <span class="text-danger"><i class="bi bi-heart"></i></span> by <a
href="https://saugi.me">Saugi</a></p>
</div>
</div>
</footer>
</div>
</div>
<script src="assets/js/app.js"></script>
<script src="assets/js/extensions/simple-datatables.js"></script>
</body>
</html>
public/dashboard/table.html 0 → 100644
View file @ 4c981655
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Table - Mazer Admin Dashboard</title>
<link rel="stylesheet" href="assets/css/main/app.css">
<link rel="stylesheet" href="assets/css/main/app-dark.css">
<link rel="shortcut icon" href="assets/images/logo/favicon.svg" type="image/x-icon">
<link rel="shortcut icon" href="assets/images/logo/favicon.png" type="image/png">
</head>
<body>
<div id="app">
<div id="sidebar" class="active">
<div class="sidebar-wrapper active">
<div class="sidebar-header position-relative">
<div class="d-flex justify-content-between align-items-center">
<div class="logo">
<a href="index.html"><img src="assets/images/logo/logo.svg" alt="Logo" srcset=""></a>
</div>
<div class="theme-toggle d-flex gap-2 align-items-center mt-2">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--system-uicons" width="20" height="20" preserveAspectRatio="xMidYMid meet" viewBox="0 0 21 21"><g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"><path d="M10.5 14.5c2.219 0 4-1.763 4-3.982a4.003 4.003 0 0 0-4-4.018c-2.219 0-4 1.781-4 4c0 2.219 1.781 4 4 4zM4.136 4.136L5.55 5.55m9.9 9.9l1.414 1.414M1.5 10.5h2m14 0h2M4.135 16.863L5.55 15.45m9.899-9.9l1.414-1.415M10.5 19.5v-2m0-14v-2" opacity=".3"></path><g transform="translate(-210 -1)"><path d="M220.5 2.5v2m6.5.5l-1.5 1.5"></path><circle cx="220.5" cy="11.5" r="4"></circle><path d="m214 5l1.5 1.5m5 14v-2m6.5-.5l-1.5-1.5M214 18l1.5-1.5m-4-5h2m14 0h2"></path></g></g></svg>
<div class="form-check form-switch fs-6">
<input class="form-check-input me-0" type="checkbox" id="toggle-dark" >
<label class="form-check-label" ></label>
</div>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--mdi" width="20" height="20" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path fill="currentColor" d="m17.75 4.09l-2.53 1.94l.91 3.06l-2.63-1.81l-2.63 1.81l.91-3.06l-2.53-1.94L12.44 4l1.06-3l1.06 3l3.19.09m3.5 6.91l-1.64 1.25l.59 1.98l-1.7-1.17l-1.7 1.17l.59-1.98L15.75 11l2.06-.05L18.5 9l.69 1.95l2.06.05m-2.28 4.95c.83-.08 1.72 1.1 1.19 1.85c-.32.45-.66.87-1.08 1.27C15.17 23 8.84 23 4.94 19.07c-3.91-3.9-3.91-10.24 0-14.14c.4-.4.82-.76 1.27-1.08c.75-.53 1.93.36 1.85 1.19c-.27 2.86.69 5.83 2.89 8.02a9.96 9.96 0 0 0 8.02 2.89m-1.64 2.02a12.08 12.08 0 0 1-7.8-3.47c-2.17-2.19-3.33-5-3.49-7.82c-2.81 3.14-2.7 7.96.31 10.98c3.02 3.01 7.84 3.12 10.98.31Z"></path></svg>
</div>
<div class="sidebar-toggler x">
<a href="#" class="sidebar-hide d-xl-none d-block"><i class="bi bi-x bi-middle"></i></a>
</div>
</div>
</div>
<div class="sidebar-menu">
<ul class="menu">
<li class="sidebar-title">Menu</li>
<li
class="sidebar-item ">
<a href="index.html" class='sidebar-link'>
<i class="bi bi-grid-fill"></i>
<span>Dashboard</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-stack"></i>
<span>Components</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="component-alert.html">Alert</a>
</li>
<li class="submenu-item ">
<a href="component-badge.html">Badge</a>
</li>
<li class="submenu-item ">
<a href="component-breadcrumb.html">Breadcrumb</a>
</li>
<li class="submenu-item ">
<a href="component-button.html">Button</a>
</li>
<li class="submenu-item ">
<a href="component-card.html">Card</a>
</li>
<li class="submenu-item ">
<a href="component-carousel.html">Carousel</a>
</li>
<li class="submenu-item ">
<a href="component-collapse.html">Collapse</a>
</li>
<li class="submenu-item ">
<a href="component-dropdown.html">Dropdown</a>
</li>
<li class="submenu-item ">
<a href="component-list-group.html">List Group</a>
</li>
<li class="submenu-item ">
<a href="component-modal.html">Modal</a>
</li>
<li class="submenu-item ">
<a href="component-navs.html">Navs</a>
</li>
<li class="submenu-item ">
<a href="component-pagination.html">Pagination</a>
</li>
<li class="submenu-item ">
<a href="component-progress.html">Progress</a>
</li>
<li class="submenu-item ">
<a href="component-spinner.html">Spinner</a>
</li>
<li class="submenu-item ">
<a href="component-tooltip.html">Tooltip</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-collection-fill"></i>
<span>Extra Components</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="extra-component-avatar.html">Avatar</a>
</li>
<li class="submenu-item ">
<a href="extra-component-sweetalert.html">Sweet Alert</a>
</li>
<li class="submenu-item ">
<a href="extra-component-toastify.html">Toastify</a>
</li>
<li class="submenu-item ">
<a href="extra-component-rating.html">Rating</a>
</li>
<li class="submenu-item ">
<a href="extra-component-divider.html">Divider</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-grid-1x2-fill"></i>
<span>Layouts</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="layout-default.html">Default Layout</a>
</li>
<li class="submenu-item ">
<a href="layout-vertical-1-column.html">1 Column</a>
</li>
<li class="submenu-item ">
<a href="layout-vertical-navbar.html">Vertical Navbar</a>
</li>
<li class="submenu-item ">
<a href="layout-rtl.html">RTL Layout</a>
</li>
<li class="submenu-item ">
<a href="layout-horizontal.html">Horizontal Menu</a>
</li>
</ul>
</li>
<li class="sidebar-title">Forms &amp; Tables</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-hexagon-fill"></i>
<span>Form Elements</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="form-element-input.html">Input</a>
</li>
<li class="submenu-item ">
<a href="form-element-input-group.html">Input Group</a>
</li>
<li class="submenu-item ">
<a href="form-element-select.html">Select</a>
</li>
<li class="submenu-item ">
<a href="form-element-radio.html">Radio</a>
</li>
<li class="submenu-item ">
<a href="form-element-checkbox.html">Checkbox</a>
</li>
<li class="submenu-item ">
<a href="form-element-textarea.html">Textarea</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="form-layout.html" class='sidebar-link'>
<i class="bi bi-file-earmark-medical-fill"></i>
<span>Form Layout</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-pen-fill"></i>
<span>Form Editor</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="form-editor-quill.html">Quill</a>
</li>
<li class="submenu-item ">
<a href="form-editor-ckeditor.html">CKEditor</a>
</li>
<li class="submenu-item ">
<a href="form-editor-summernote.html">Summernote</a>
</li>
<li class="submenu-item ">
<a href="form-editor-tinymce.html">TinyMCE</a>
</li>
</ul>
</li>
<li
class="sidebar-item active ">
<a href="table.html" class='sidebar-link'>
<i class="bi bi-grid-1x2-fill"></i>
<span>Table</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-file-earmark-spreadsheet-fill"></i>
<span>Datatables</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="table-datatable.html">Datatable</a>
</li>
<li class="submenu-item ">
<a href="table-datatable-jquery.html">Datatable (jQuery)</a>
</li>
</ul>
</li>
<li class="sidebar-title">Extra UI</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-pentagon-fill"></i>
<span>Widgets</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-widgets-chatbox.html">Chatbox</a>
</li>
<li class="submenu-item ">
<a href="ui-widgets-pricing.html">Pricing</a>
</li>
<li class="submenu-item ">
<a href="ui-widgets-todolist.html">To-do List</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-egg-fill"></i>
<span>Icons</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-icons-bootstrap-icons.html">Bootstrap Icons </a>
</li>
<li class="submenu-item ">
<a href="ui-icons-fontawesome.html">Fontawesome</a>
</li>
<li class="submenu-item ">
<a href="ui-icons-dripicons.html">Dripicons</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-bar-chart-fill"></i>
<span>Charts</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-chart-chartjs.html">ChartJS</a>
</li>
<li class="submenu-item ">
<a href="ui-chart-apexcharts.html">Apexcharts</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="ui-file-uploader.html" class='sidebar-link'>
<i class="bi bi-cloud-arrow-up-fill"></i>
<span>File Uploader</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-map-fill"></i>
<span>Maps</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-map-google-map.html">Google Map</a>
</li>
<li class="submenu-item ">
<a href="ui-map-jsvectormap.html">JS Vector Map</a>
</li>
</ul>
</li>
<li class="sidebar-title">Pages</li>
<li
class="sidebar-item ">
<a href="application-email.html" class='sidebar-link'>
<i class="bi bi-envelope-fill"></i>
<span>Email Application</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-chat.html" class='sidebar-link'>
<i class="bi bi-chat-dots-fill"></i>
<span>Chat Application</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-gallery.html" class='sidebar-link'>
<i class="bi bi-image-fill"></i>
<span>Photo Gallery</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-checkout.html" class='sidebar-link'>
<i class="bi bi-basket-fill"></i>
<span>Checkout Page</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-person-badge-fill"></i>
<span>Authentication</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="auth-login.html">Login</a>
</li>
<li class="submenu-item ">
<a href="auth-register.html">Register</a>
</li>
<li class="submenu-item ">
<a href="auth-forgot-password.html">Forgot Password</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-x-octagon-fill"></i>
<span>Errors</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="error-403.html">403</a>
</li>
<li class="submenu-item ">
<a href="error-404.html">404</a>
</li>
<li class="submenu-item ">
<a href="error-500.html">500</a>
</li>
</ul>
</li>
<li class="sidebar-title">Raise Support</li>
<li
class="sidebar-item ">
<a href="https://zuramai.github.io/mazer/docs" class='sidebar-link'>
<i class="bi bi-life-preserver"></i>
<span>Documentation</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="https://github.com/zuramai/mazer/blob/main/CONTRIBUTING.md" class='sidebar-link'>
<i class="bi bi-puzzle"></i>
<span>Contribute</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="https://github.com/zuramai/mazer#donation" class='sidebar-link'>
<i class="bi bi-cash"></i>
<span>Donate</span>
</a>
</li>
</ul>
</div>
</div>
</div>
<div id="main">
<header class="mb-3">
<a href="#" class="burger-btn d-block d-xl-none">
<i class="bi bi-justify fs-3"></i>
</a>
</header>
<div class="page-heading">
<div class="page-title">
<div class="row">
<div class="col-12 col-md-6 order-md-1 order-last">
<h3>Table</h3>
<p class="text-subtitle text-muted">Who does not love tables</p>
</div>
<div class="col-12 col-md-6 order-md-2 order-first">
<nav aria-label="breadcrumb" class="breadcrumb-header float-start float-lg-end">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="index.html">Dashboard</a></li>
<li class="breadcrumb-item active" aria-current="page">Table</li>
</ol>
</nav>
</div>
</div>
</div>
<!-- Basic Tables start -->
<section class="section">
<div class="row" id="basic-table">
<div class="col-12 col-md-6">
<div class="card">
<div class="card-header">
<h4 class="card-title">Table with outer spacing</h4>
</div>
<div class="card-content">
<div class="card-body">
<p class="card-text">Using the most basic table up, here’s how
<code>.table</code>-based tables look in Bootstrap. You can use any example
of below table for your table and it can be use with any type of bootstrap tables.
</p>
<!-- Table with outer spacing -->
<div class="table-responsive">
<table class="table table-lg">
<thead>
<tr>
<th>NAME</th>
<th>RATE</th>
<th>SKILL</th>
</tr>
</thead>
<tbody>
<tr>
<td class="text-bold-500">Michael Right</td>
<td>$15/hr</td>
<td class="text-bold-500">UI/UX</td>
</tr>
<tr>
<td class="text-bold-500">Morgan Vanblum</td>
<td>$13/hr</td>
<td class="text-bold-500">Graphic concepts</td>
</tr>
<tr>
<td class="text-bold-500">Tiffani Blogz</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
</tr>
<tr>
<td class="text-bold-500">Ashley Boul</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
</tr>
<tr>
<td class="text-bold-500">Mikkey Mice</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
<div class="col-12 col-md-6">
<div class="card">
<div class="card-header">
<h4 class="card-title">Table without outer spacing</h4>
</div>
<div class="card-content">
<div class="card-body">
<p class="card-text">Using the most basic table up, here’s how
<code>.table</code>-based tables look in Bootstrap. You can use any example
of below table for your table and it can be use with any type of bootstrap tables.
</p>
</div>
<!-- Table with no outer spacing -->
<div class="table-responsive">
<table class="table mb-0 table-lg">
<thead>
<tr>
<th>NAME</th>
<th>RATE</th>
<th>SKILL</th>
</tr>
</thead>
<tbody>
<tr>
<td class="text-bold-500">Michael Right</td>
<td>$15/hr</td>
<td class="text-bold-500">UI/UX</td>
</tr>
<tr>
<td class="text-bold-500">Morgan Vanblum</td>
<td>$13/hr</td>
<td class="text-bold-500">Graphic concepts</td>
</tr>
<tr>
<td class="text-bold-500">Tiffani Blogz</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
</tr>
<tr>
<td class="text-bold-500">Ashley Boul</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
</tr>
<tr>
<td class="text-bold-500">Mikkey Mice</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Basic Tables end -->
<!-- Inverse table start -->
<section class="section">
<div class="row" id="table-inverse">
<div class="col-12">
<div class="card">
<div class="card-header">
<h4 class="card-title">Inverse table</h4>
</div>
<div class="card-content">
<div class="card-body">
<p>You can also invert the colors—with light text on dark backgrounds—with <code
class="highlighter-rouge">.table-dark</code>.</p>
</div>
<!-- table with dark -->
<div class="table-responsive">
<table class="table table-dark mb-0">
<thead>
<tr>
<th>NAME</th>
<th>RATE</th>
<th>SKILL</th>
<th>TYPE</th>
<th>LOCATION</th>
<th>ACTION</th>
</tr>
</thead>
<tbody>
<tr>
<td class="text-bold-500">Michael Right</td>
<td>$15/hr</td>
<td class="text-bold-500">UI/UX</td>
<td>Remote</td>
<td>Austin,Taxes</td>
<td><a href="#"><i class="badge-circle font-medium-1"
data-feather="mail"></i></a>
</td>
</tr>
<tr>
<td class="text-bold-500">Morgan Vanblum</td>
<td>$13/hr</td>
<td class="text-bold-500">Graphic concepts</td>
<td>Remote</td>
<td>Shangai,China</td>
<td><a href="#"><i class="badge-circle font-medium-1"
data-feather="mail"></i></a>
</td>
</tr>
<tr>
<td class="text-bold-500">Tiffani Blogz</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i class="badge-circle font-medium-1"
data-feather="mail"></i></a>
</td>
</tr>
<tr>
<td class="text-bold-500">Ashley Boul</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i class="badge-circle font-medium-1"
data-feather="mail"></i></a>
</td>
</tr>
<tr>
<td class="text-bold-500">Mikkey Mice</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i class="badge-circle font-medium-1"
data-feather="mail"></i></a>
</td>
</tr>
</tbody>
</table>
</div>
<div class="card-body">
<p>You can also invert the colors—with dark text on light backgrounds—with <code
class="highlighter-rouge">.table-light</code>.</p>
</div>
<!-- table with light -->
<div class="table-responsive">
<table class="table table-light mb-0">
<thead>
<tr>
<th>NAME</th>
<th>RATE</th>
<th>SKILL</th>
<th>TYPE</th>
<th>LOCATION</th>
<th>ACTION</th>
</tr>
</thead>
<tbody>
<tr>
<td class="text-bold-500">Michael Right</td>
<td>$15/hr</td>
<td class="text-bold-500">UI/UX</td>
<td>Remote</td>
<td>Austin,Taxes</td>
<td><a href="#"><i
class="badge-circle badge-circle-white text-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr>
<td class="text-bold-500">Morgan Vanblum</td>
<td>$13/hr</td>
<td class="text-bold-500">Graphic concepts</td>
<td>Remote</td>
<td>Shangai,China</td>
<td><a href="#"><i
class="badge-circle badge-circle-white text-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr>
<td class="text-bold-500">Tiffani Blogz</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i
class="badge-circle badge-circle-white text-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr>
<td class="text-bold-500">Ashley Boul</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i
class="badge-circle badge-circle-white text-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr>
<td class="text-bold-500">Mikkey Mice</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i
class="badge-circle badge-circle-white text-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Inverse table end -->
<!-- Table head options start -->
<section class="section">
<div class="row" id="table-head">
<div class="col-12">
<div class="card">
<div class="card-header">
<h4 class="card-title">Table head options</h4>
</div>
<div class="card-content">
<div class="card-body">
<p>Similar to tables and dark tables, use the modifier classes <code
class="highlighter-rouge">.thead-light</code> or <code
class="highlighter-rouge">.thead-dark</code> to
make <code class="highlighter-rouge">&lt;thead&gt;</code>s appear light or dark gray.
</p>
</div>
<!-- table head dark -->
<div class="table-responsive">
<table class="table mb-0">
<thead class="thead-dark">
<tr>
<th>NAME</th>
<th>RATE</th>
<th>SKILL</th>
<th>TYPE</th>
<th>LOCATION</th>
<th>ACTION</th>
</tr>
</thead>
<tbody>
<tr>
<td class="text-bold-500">Michael Right</td>
<td>$15/hr</td>
<td class="text-bold-500">UI/UX</td>
<td>Remote</td>
<td>Austin,Taxes</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr>
<td class="text-bold-500">Morgan Vanblum</td>
<td>$13/hr</td>
<td class="text-bold-500">Graphic concepts</td>
<td>Remote</td>
<td>Shangai,China</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr>
<td class="text-bold-500">Tiffani Blogz</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr>
<td class="text-bold-500">Ashley Boul</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr>
<td class="text-bold-500">Mikkey Mice</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Table head options end -->
<!-- Striped rows start -->
<section class="section">
<div class="row" id="table-striped">
<div class="col-12">
<div class="card">
<div class="card-header">
<h4 class="card-title">Striped rows</h4>
</div>
<div class="card-content">
<div class="card-body">
<p class="card-text">Use <code class="highlighter-rouge">.table-striped</code> to add
zebra-striping to any
table row within the <code class="highlighter-rouge">&lt;tbody&gt;</code>. This styling
doesn't work in IE8
and below as <code>:nth-child</code> CSS selector isn't supported.</p>
</div>
<!-- table striped -->
<div class="table-responsive">
<table class="table table-striped mb-0">
<thead>
<tr>
<th>NAME</th>
<th>RATE</th>
<th>SKILL</th>
<th>TYPE</th>
<th>LOCATION</th>
<th>ACTION</th>
</tr>
</thead>
<tbody>
<tr>
<td class="text-bold-500">Michael Right</td>
<td>$15/hr</td>
<td class="text-bold-500">UI/UX</td>
<td>Remote</td>
<td>Austin,Taxes</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr>
<td class="text-bold-500">Morgan Vanblum</td>
<td>$13/hr</td>
<td class="text-bold-500">Graphic concepts</td>
<td>Remote</td>
<td>Shangai,China</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr>
<td class="text-bold-500">Tiffani Blogz</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr>
<td class="text-bold-500">Ashley Boul</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr>
<td class="text-bold-500">Mikkey Mice</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Striped rows end -->
<!-- Striped rows with inverse dark table start -->
<section class="section">
<div class="row" id="table-striped-dark">
<div class="col-12">
<div class="card">
<div class="card-header">
<h4 class="card-title">Striped inverse dark</h4>
</div>
<div class="card-content">
<div class="card-body">
<p class="card-text">Use <code>.table-dark</code> with <code>.table-striped</code> to add
zebra-striping to
any inverse table row within the <code>&lt;tbody&gt;</code>. This styling doesn't work
in
IE8 and below as
<code>:nth-child</code> CSS selector isn't supported.
</p>
</div>
<!-- table strip dark -->
<div class="table-responsive">
<table class="table table-striped table-dark mb-0">
<thead>
<tr>
<th>NAME</th>
<th>RATE</th>
<th>SKILL</th>
<th>TYPE</th>
<th>LOCATION</th>
<th>ACTION</th>
</tr>
</thead>
<tbody>
<tr>
<td class="text-bold-500">Michael Right</td>
<td>$15/hr</td>
<td class="text-bold-500">UI/UX</td>
<td>Remote</td>
<td>Austin,Taxes</td>
<td><a href="#"><i class="badge-circle font-medium-1"
data-feather="mail"></i></a>
</td>
</tr>
<tr>
<td class="text-bold-500">Morgan Vanblum</td>
<td>$13/hr</td>
<td class="text-bold-500">Graphic concepts</td>
<td>Remote</td>
<td>Shangai,China</td>
<td><a href="#"><i class="badge-circle font-medium-1"
data-feather="mail"></i></a>
</td>
</tr>
<tr>
<td class="text-bold-500">Tiffani Blogz</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i class="badge-circle font-medium-1"
data-feather="mail"></i></a>
</td>
</tr>
<tr>
<td class="text-bold-500">Ashley Boul</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i class="badge-circle font-medium-1"
data-feather="mail"></i></a>
</td>
</tr>
<tr>
<td class="text-bold-500">Mikkey Mice</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i class="badge-circle font-medium-1"
data-feather="mail"></i></a>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Striped rows with inverse dark table end -->
<!-- Bordered table start -->
<section class="section">
<div class="row" id="table-bordered">
<div class="col-12">
<div class="card">
<div class="card-header">
<h4 class="card-title">Bordered table</h4>
</div>
<div class="card-content">
<div class="card-body">
<p class="card-text">Add <code>.table-bordered</code> for borders on all sides of the table
and
cells. For
Inverse Dark Table, add <code>.table-dark</code> along with
<code>.table-bordered</code>.
</p>
</div>
<!-- table bordered -->
<div class="table-responsive">
<table class="table table-bordered mb-0">
<thead>
<tr>
<th>NAME</th>
<th>RATE</th>
<th>SKILL</th>
<th>TYPE</th>
<th>LOCATION</th>
<th>ACTION</th>
</tr>
</thead>
<tbody>
<tr>
<td class="text-bold-500">Michael Right</td>
<td>$15/hr</td>
<td class="text-bold-500">UI/UX</td>
<td>Remote</td>
<td>Austin,Taxes</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr>
<td class="text-bold-500">Morgan Vanblum</td>
<td>$13/hr</td>
<td class="text-bold-500">Graphic concepts</td>
<td>Remote</td>
<td>Shangai,China</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr>
<td class="text-bold-500">Tiffani Blogz</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr>
<td class="text-bold-500">Ashley Boul</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr>
<td class="text-bold-500">Mikkey Mice</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Bordered table end -->
<!-- Borderless table start -->
<section class="section">
<div class="row" id="table-borderless">
<div class="col-12">
<div class="card">
<div class="card-header">
<h4 class="card-title">Borderless Table</h4>
</div>
<div class="card-content">
<div class="card-body">
<p class="card-text">Add <code>.table-borderless</code> for a table without borders. It can
also
be used on
dark tables.</p>
</div>
<!-- table with no border -->
<div class="table-responsive">
<table class="table table-borderless mb-0">
<thead>
<tr>
<th>NAME</th>
<th>RATE</th>
<th>SKILL</th>
<th>TYPE</th>
<th>LOCATION</th>
<th>ACTION</th>
</tr>
</thead>
<tbody>
<tr>
<td class="text-bold-500">Michael Right</td>
<td>$15/hr</td>
<td class="text-bold-500">UI/UX</td>
<td>Remote</td>
<td>Austin,Taxes</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr>
<td class="text-bold-500">Morgan Vanblum</td>
<td>$13/hr</td>
<td class="text-bold-500">Graphic concepts</td>
<td>Remote</td>
<td>Shangai,China</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr>
<td class="text-bold-500">Tiffani Blogz</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr>
<td class="text-bold-500">Ashley Boul</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr>
<td class="text-bold-500">Mikkey Mice</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Borderless table end -->
<!-- Hoverable rows start -->
<section class="section">
<div class="row" id="table-hover-row">
<div class="col-12">
<div class="card">
<div class="card-header">
<h4 class="card-title">Hoverable rows</h4>
</div>
<div class="card-content">
<div class="card-body">
<p>Add <code class="highlighter-rouge">.table-hover</code> to enable a hover state on table
rows
within a
<code class="highlighter-rouge">&lt;tbody&gt;</code>.
</p>
</div>
<!-- table hover -->
<div class="table-responsive">
<table class="table table-hover mb-0">
<thead>
<tr>
<th>NAME</th>
<th>RATE</th>
<th>SKILL</th>
<th>TYPE</th>
<th>LOCATION</th>
<th>ACTION</th>
</tr>
</thead>
<tbody>
<tr>
<td class="text-bold-500">Michael Right</td>
<td>$15/hr</td>
<td class="text-bold-500">UI/UX</td>
<td>Remote</td>
<td>Austin,Taxes</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr>
<td class="text-bold-500">Morgan Vanblum</td>
<td>$13/hr</td>
<td class="text-bold-500">Graphic concepts</td>
<td>Remote</td>
<td>Shangai,China</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr>
<td class="text-bold-500">Tiffani Blogz</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr>
<td class="text-bold-500">Ashley Boul</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr>
<td class="text-bold-500">Mikkey Mice</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Hoverable rows end -->
<!-- Contextual classes start -->
<section class="section">
<div class="row" id="table-contexual">
<div class="col-12">
<div class="card">
<div class="card-header">
<h4 class="card-title">Contextual classes</h4>
</div>
<div class="card-content">
<div class="card-body">
<p>Use contextual classes to color table rows or individual cells. Read full documnetation
<a href="https://getbootstrap.com/docs/4.3/content/tables/#contextual-classes"
target="_blank">here.</a>
</p>
</div>
<!-- table contextual / colored -->
<div class="table-responsive">
<table class="table mb-0">
<thead>
<tr>
<th>NAME</th>
<th>RATE</th>
<th>SKILL</th>
<th>TYPE</th>
<th>LOCATION</th>
<th>ACTION</th>
</tr>
</thead>
<tbody>
<tr class="table-active">
<td class="text-bold-500">Michael Right</td>
<td>$15/hr</td>
<td class="text-bold-500">UI/UX</td>
<td>Remote</td>
<td>Austin,Taxes</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr class="table-primary">
<td class="text-bold-500">Morgan Vanblum</td>
<td>$13/hr</td>
<td class="text-bold-500">Graphic concepts</td>
<td>Remote</td>
<td>Shangai,China</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr class="table-secondary">
<td class="text-bold-500">Tiffani Blogz</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr class="table-success">
<td class="text-bold-500">Ashley Boul</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr class="table-danger">
<td class="text-bold-500">Mikkey Mice</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr class="table-warning">
<td class="text-bold-500">Mikkey Mice</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr class="table-info">
<td class="text-bold-500">Mikkey Mice</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr class="table-light">
<td class="text-bold-500">Mikkey Mice</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
<tr class="table-dark">
<td class="text-bold-500">Mikkey Mice</td>
<td>$15/hr</td>
<td class="text-bold-500">Animation</td>
<td>Remote</td>
<td>Austin,Texas</td>
<td><a href="#"><i
class="badge-circle badge-circle-light-secondary font-medium-1"
data-feather="mail"></i></a></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Contextual classes end -->
<!-- Responsive tables start -->
<section class="section">
<div class="row" id="table-responsive">
<div class="col-12">
<div class="card">
<div class="card-header">
<h4 class="card-title">Always responsive</h4>
</div>
<div class="card-content">
<div class="card-body">
<p>Responsive tables allow tables to be scrolled horizontally with ease. Make any table
responsive across all
viewports by adding a div with the class <code class="highlighter-rouge">.table-responsive</code>
around the table. Or, pick a maximum breakpoint with which to have a responsive
table up to by adding <code
class="highlighter-rouge"> .table-responsive{-sm|-md|-lg|-xl}</code>. Read full
documentation <a
href="https://getbootstrap.com/docs/4.3/content/tables/#responsive-tables"
target="_blank">here.</a>
</p>
<div class="alert alert-primary">
<h4 class="alert-heading">Vertical clipping/truncation</h4>
<p>Responsive tables make use of <code
class="highlighter-rouge">overflow-y: hidden</code>,
which clips off
any content that goes beyond the bottom or top edges of the table. In particular,
this
can clip off
dropdown menus and other third-party widgets.</p>
</div>
</div>
<!-- table responsive -->
<div class="table-responsive">
<table class="table mb-0">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">Heading 1</th>
<th scope="col">Heading 2</th>
<th scope="col">Heading 3</th>
<th scope="col">Heading 4</th>
<th scope="col">Heading 5</th>
<th scope="col">Heading 6</th>
<th scope="col">Heading 7</th>
<th scope="col">Heading 8</th>
<th scope="col">Heading 9</th>
<th scope="col">Heading 10</th>
<th scope="col">Heading 11</th>
<th scope="col">Heading 12</th>
<th scope="col">Heading 13</th>
</tr>
</thead>
<tbody>
<tr>
<td>Michael Right</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
</tr>
<tr>
<td>Michael Right</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
</tr>
<tr>
<td>Michael Right</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</section>
</div>
<footer>
<div class="footer clearfix mb-0 text-muted">
<div class="float-start">
<p>2021 &copy; Mazer</p>
</div>
<div class="float-end">
<p>Crafted with <span class="text-danger"><i class="bi bi-heart"></i></span> by <a
href="https://saugi.me">Saugi</a></p>
</div>
</div>
</footer>
</div>
</div>
<script src="assets/js/app.js"></script>
</body>
</html>
public/dashboard/ui-chart-apexcharts.html 0 → 100644
View file @ 4c981655
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Apexcharts - Mazer Admin Dashboard</title>
<link rel="stylesheet" href="assets/css/main/app.css">
<link rel="stylesheet" href="assets/css/main/app-dark.css">
<link rel="shortcut icon" href="assets/images/logo/favicon.svg" type="image/x-icon">
<link rel="shortcut icon" href="assets/images/logo/favicon.png" type="image/png">
</head>
<body>
<div id="app">
<div id="sidebar" class="active">
<div class="sidebar-wrapper active">
<div class="sidebar-header position-relative">
<div class="d-flex justify-content-between align-items-center">
<div class="logo">
<a href="index.html"><img src="assets/images/logo/logo.svg" alt="Logo" srcset=""></a>
</div>
<div class="theme-toggle d-flex gap-2 align-items-center mt-2">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--system-uicons" width="20" height="20" preserveAspectRatio="xMidYMid meet" viewBox="0 0 21 21"><g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"><path d="M10.5 14.5c2.219 0 4-1.763 4-3.982a4.003 4.003 0 0 0-4-4.018c-2.219 0-4 1.781-4 4c0 2.219 1.781 4 4 4zM4.136 4.136L5.55 5.55m9.9 9.9l1.414 1.414M1.5 10.5h2m14 0h2M4.135 16.863L5.55 15.45m9.899-9.9l1.414-1.415M10.5 19.5v-2m0-14v-2" opacity=".3"></path><g transform="translate(-210 -1)"><path d="M220.5 2.5v2m6.5.5l-1.5 1.5"></path><circle cx="220.5" cy="11.5" r="4"></circle><path d="m214 5l1.5 1.5m5 14v-2m6.5-.5l-1.5-1.5M214 18l1.5-1.5m-4-5h2m14 0h2"></path></g></g></svg>
<div class="form-check form-switch fs-6">
<input class="form-check-input me-0" type="checkbox" id="toggle-dark" >
<label class="form-check-label" ></label>
</div>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--mdi" width="20" height="20" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path fill="currentColor" d="m17.75 4.09l-2.53 1.94l.91 3.06l-2.63-1.81l-2.63 1.81l.91-3.06l-2.53-1.94L12.44 4l1.06-3l1.06 3l3.19.09m3.5 6.91l-1.64 1.25l.59 1.98l-1.7-1.17l-1.7 1.17l.59-1.98L15.75 11l2.06-.05L18.5 9l.69 1.95l2.06.05m-2.28 4.95c.83-.08 1.72 1.1 1.19 1.85c-.32.45-.66.87-1.08 1.27C15.17 23 8.84 23 4.94 19.07c-3.91-3.9-3.91-10.24 0-14.14c.4-.4.82-.76 1.27-1.08c.75-.53 1.93.36 1.85 1.19c-.27 2.86.69 5.83 2.89 8.02a9.96 9.96 0 0 0 8.02 2.89m-1.64 2.02a12.08 12.08 0 0 1-7.8-3.47c-2.17-2.19-3.33-5-3.49-7.82c-2.81 3.14-2.7 7.96.31 10.98c3.02 3.01 7.84 3.12 10.98.31Z"></path></svg>
</div>
<div class="sidebar-toggler x">
<a href="#" class="sidebar-hide d-xl-none d-block"><i class="bi bi-x bi-middle"></i></a>
</div>
</div>
</div>
<div class="sidebar-menu">
<ul class="menu">
<li class="sidebar-title">Menu</li>
<li
class="sidebar-item ">
<a href="index.html" class='sidebar-link'>
<i class="bi bi-grid-fill"></i>
<span>Dashboard</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-stack"></i>
<span>Components</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="component-alert.html">Alert</a>
</li>
<li class="submenu-item ">
<a href="component-badge.html">Badge</a>
</li>
<li class="submenu-item ">
<a href="component-breadcrumb.html">Breadcrumb</a>
</li>
<li class="submenu-item ">
<a href="component-button.html">Button</a>
</li>
<li class="submenu-item ">
<a href="component-card.html">Card</a>
</li>
<li class="submenu-item ">
<a href="component-carousel.html">Carousel</a>
</li>
<li class="submenu-item ">
<a href="component-collapse.html">Collapse</a>
</li>
<li class="submenu-item ">
<a href="component-dropdown.html">Dropdown</a>
</li>
<li class="submenu-item ">
<a href="component-list-group.html">List Group</a>
</li>
<li class="submenu-item ">
<a href="component-modal.html">Modal</a>
</li>
<li class="submenu-item ">
<a href="component-navs.html">Navs</a>
</li>
<li class="submenu-item ">
<a href="component-pagination.html">Pagination</a>
</li>
<li class="submenu-item ">
<a href="component-progress.html">Progress</a>
</li>
<li class="submenu-item ">
<a href="component-spinner.html">Spinner</a>
</li>
<li class="submenu-item ">
<a href="component-tooltip.html">Tooltip</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-collection-fill"></i>
<span>Extra Components</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="extra-component-avatar.html">Avatar</a>
</li>
<li class="submenu-item ">
<a href="extra-component-sweetalert.html">Sweet Alert</a>
</li>
<li class="submenu-item ">
<a href="extra-component-toastify.html">Toastify</a>
</li>
<li class="submenu-item ">
<a href="extra-component-rating.html">Rating</a>
</li>
<li class="submenu-item ">
<a href="extra-component-divider.html">Divider</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-grid-1x2-fill"></i>
<span>Layouts</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="layout-default.html">Default Layout</a>
</li>
<li class="submenu-item ">
<a href="layout-vertical-1-column.html">1 Column</a>
</li>
<li class="submenu-item ">
<a href="layout-vertical-navbar.html">Vertical Navbar</a>
</li>
<li class="submenu-item ">
<a href="layout-rtl.html">RTL Layout</a>
</li>
<li class="submenu-item ">
<a href="layout-horizontal.html">Horizontal Menu</a>
</li>
</ul>
</li>
<li class="sidebar-title">Forms &amp; Tables</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-hexagon-fill"></i>
<span>Form Elements</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="form-element-input.html">Input</a>
</li>
<li class="submenu-item ">
<a href="form-element-input-group.html">Input Group</a>
</li>
<li class="submenu-item ">
<a href="form-element-select.html">Select</a>
</li>
<li class="submenu-item ">
<a href="form-element-radio.html">Radio</a>
</li>
<li class="submenu-item ">
<a href="form-element-checkbox.html">Checkbox</a>
</li>
<li class="submenu-item ">
<a href="form-element-textarea.html">Textarea</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="form-layout.html" class='sidebar-link'>
<i class="bi bi-file-earmark-medical-fill"></i>
<span>Form Layout</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-pen-fill"></i>
<span>Form Editor</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="form-editor-quill.html">Quill</a>
</li>
<li class="submenu-item ">
<a href="form-editor-ckeditor.html">CKEditor</a>
</li>
<li class="submenu-item ">
<a href="form-editor-summernote.html">Summernote</a>
</li>
<li class="submenu-item ">
<a href="form-editor-tinymce.html">TinyMCE</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="table.html" class='sidebar-link'>
<i class="bi bi-grid-1x2-fill"></i>
<span>Table</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-file-earmark-spreadsheet-fill"></i>
<span>Datatables</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="table-datatable.html">Datatable</a>
</li>
<li class="submenu-item ">
<a href="table-datatable-jquery.html">Datatable (jQuery)</a>
</li>
</ul>
</li>
<li class="sidebar-title">Extra UI</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-pentagon-fill"></i>
<span>Widgets</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-widgets-chatbox.html">Chatbox</a>
</li>
<li class="submenu-item ">
<a href="ui-widgets-pricing.html">Pricing</a>
</li>
<li class="submenu-item ">
<a href="ui-widgets-todolist.html">To-do List</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-egg-fill"></i>
<span>Icons</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-icons-bootstrap-icons.html">Bootstrap Icons </a>
</li>
<li class="submenu-item ">
<a href="ui-icons-fontawesome.html">Fontawesome</a>
</li>
<li class="submenu-item ">
<a href="ui-icons-dripicons.html">Dripicons</a>
</li>
</ul>
</li>
<li
class="sidebar-item active has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-bar-chart-fill"></i>
<span>Charts</span>
</a>
<ul class="submenu active">
<li class="submenu-item ">
<a href="ui-chart-chartjs.html">ChartJS</a>
</li>
<li class="submenu-item active">
<a href="ui-chart-apexcharts.html">Apexcharts</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="ui-file-uploader.html" class='sidebar-link'>
<i class="bi bi-cloud-arrow-up-fill"></i>
<span>File Uploader</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-map-fill"></i>
<span>Maps</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-map-google-map.html">Google Map</a>
</li>
<li class="submenu-item ">
<a href="ui-map-jsvectormap.html">JS Vector Map</a>
</li>
</ul>
</li>
<li class="sidebar-title">Pages</li>
<li
class="sidebar-item ">
<a href="application-email.html" class='sidebar-link'>
<i class="bi bi-envelope-fill"></i>
<span>Email Application</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-chat.html" class='sidebar-link'>
<i class="bi bi-chat-dots-fill"></i>
<span>Chat Application</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-gallery.html" class='sidebar-link'>
<i class="bi bi-image-fill"></i>
<span>Photo Gallery</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-checkout.html" class='sidebar-link'>
<i class="bi bi-basket-fill"></i>
<span>Checkout Page</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-person-badge-fill"></i>
<span>Authentication</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="auth-login.html">Login</a>
</li>
<li class="submenu-item ">
<a href="auth-register.html">Register</a>
</li>
<li class="submenu-item ">
<a href="auth-forgot-password.html">Forgot Password</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-x-octagon-fill"></i>
<span>Errors</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="error-403.html">403</a>
</li>
<li class="submenu-item ">
<a href="error-404.html">404</a>
</li>
<li class="submenu-item ">
<a href="error-500.html">500</a>
</li>
</ul>
</li>
<li class="sidebar-title">Raise Support</li>
<li
class="sidebar-item ">
<a href="https://zuramai.github.io/mazer/docs" class='sidebar-link'>
<i class="bi bi-life-preserver"></i>
<span>Documentation</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="https://github.com/zuramai/mazer/blob/main/CONTRIBUTING.md" class='sidebar-link'>
<i class="bi bi-puzzle"></i>
<span>Contribute</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="https://github.com/zuramai/mazer#donation" class='sidebar-link'>
<i class="bi bi-cash"></i>
<span>Donate</span>
</a>
</li>
</ul>
</div>
</div>
</div>
<div id="main">
<header class="mb-3">
<a href="#" class="burger-btn d-block d-xl-none">
<i class="bi bi-justify fs-3"></i>
</a>
</header>
<div class="page-heading">
<div class="page-title">
<div class="row">
<div class="col-12 col-md-6 order-md-1 order-last">
<h3>Apexcharts</h3>
<p class="text-subtitle text-muted">A chart says more than a thousand words</p>
</div>
<div class="col-12 col-md-6 order-md-2 order-first">
<nav aria-label="breadcrumb" class="breadcrumb-header float-start float-lg-end">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="index.html">Dashboard</a></li>
<li class="breadcrumb-item active" aria-current="page">Apexcharts</li>
</ol>
</nav>
</div>
</div>
</div>
<section class="section">
<div class="row">
<div class="col-md-9">
<div class="card">
<div class="card-header">
<h4>Line Area Chart</h4>
</div>
<div class="card-body">
<div id="area"></div>
</div>
</div>
</div>
<div class="col-md-3">
<div class="card">
<div class="card-header">
<h4>Radial Gradient Chart</h4>
</div>
<div class="card-body">
<div id="radialGradient"></div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="card">
<div class="card-header">
<h4>Line Chart</h4>
</div>
<div class="card-body">
<div id="line"></div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="card">
<div class="card-header">
<h4>Bar Chart</h4>
</div>
<div class="card-body">
<div id="bar"></div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-header">
<h4>Radial Gradient Chart</h4>
</div>
<div class="card-body">
<div id="candle"></div>
</div>
</div>
</div>
</div>
</section>
</div>
<footer>
<div class="footer clearfix mb-0 text-muted">
<div class="float-start">
<p>2021 &copy; Mazer</p>
</div>
<div class="float-end">
<p>Crafted with <span class="text-danger"><i class="bi bi-heart"></i></span> by <a
href="https://saugi.me">Saugi</a></p>
</div>
</div>
</footer>
</div>
</div>
<script src="assets/js/app.js"></script>
<script src="assets/js/extensions/ui-apexchart.js"></script>
</body>
</html>
public/dashboard/ui-chart-chartjs.html 0 → 100644
View file @ 4c981655
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ChartJS - Mazer Admin Dashboard</title>
<link rel="stylesheet" href="assets/css/main/app.css">
<link rel="stylesheet" href="assets/css/main/app-dark.css">
<link rel="shortcut icon" href="assets/images/logo/favicon.svg" type="image/x-icon">
<link rel="shortcut icon" href="assets/images/logo/favicon.png" type="image/png">
</head>
<body>
<div id="app">
<div id="sidebar" class="active">
<div class="sidebar-wrapper active">
<div class="sidebar-header position-relative">
<div class="d-flex justify-content-between align-items-center">
<div class="logo">
<a href="index.html"><img src="assets/images/logo/logo.svg" alt="Logo" srcset=""></a>
</div>
<div class="theme-toggle d-flex gap-2 align-items-center mt-2">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--system-uicons" width="20" height="20" preserveAspectRatio="xMidYMid meet" viewBox="0 0 21 21"><g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"><path d="M10.5 14.5c2.219 0 4-1.763 4-3.982a4.003 4.003 0 0 0-4-4.018c-2.219 0-4 1.781-4 4c0 2.219 1.781 4 4 4zM4.136 4.136L5.55 5.55m9.9 9.9l1.414 1.414M1.5 10.5h2m14 0h2M4.135 16.863L5.55 15.45m9.899-9.9l1.414-1.415M10.5 19.5v-2m0-14v-2" opacity=".3"></path><g transform="translate(-210 -1)"><path d="M220.5 2.5v2m6.5.5l-1.5 1.5"></path><circle cx="220.5" cy="11.5" r="4"></circle><path d="m214 5l1.5 1.5m5 14v-2m6.5-.5l-1.5-1.5M214 18l1.5-1.5m-4-5h2m14 0h2"></path></g></g></svg>
<div class="form-check form-switch fs-6">
<input class="form-check-input me-0" type="checkbox" id="toggle-dark" >
<label class="form-check-label" ></label>
</div>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--mdi" width="20" height="20" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path fill="currentColor" d="m17.75 4.09l-2.53 1.94l.91 3.06l-2.63-1.81l-2.63 1.81l.91-3.06l-2.53-1.94L12.44 4l1.06-3l1.06 3l3.19.09m3.5 6.91l-1.64 1.25l.59 1.98l-1.7-1.17l-1.7 1.17l.59-1.98L15.75 11l2.06-.05L18.5 9l.69 1.95l2.06.05m-2.28 4.95c.83-.08 1.72 1.1 1.19 1.85c-.32.45-.66.87-1.08 1.27C15.17 23 8.84 23 4.94 19.07c-3.91-3.9-3.91-10.24 0-14.14c.4-.4.82-.76 1.27-1.08c.75-.53 1.93.36 1.85 1.19c-.27 2.86.69 5.83 2.89 8.02a9.96 9.96 0 0 0 8.02 2.89m-1.64 2.02a12.08 12.08 0 0 1-7.8-3.47c-2.17-2.19-3.33-5-3.49-7.82c-2.81 3.14-2.7 7.96.31 10.98c3.02 3.01 7.84 3.12 10.98.31Z"></path></svg>
</div>
<div class="sidebar-toggler x">
<a href="#" class="sidebar-hide d-xl-none d-block"><i class="bi bi-x bi-middle"></i></a>
</div>
</div>
</div>
<div class="sidebar-menu">
<ul class="menu">
<li class="sidebar-title">Menu</li>
<li
class="sidebar-item ">
<a href="index.html" class='sidebar-link'>
<i class="bi bi-grid-fill"></i>
<span>Dashboard</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-stack"></i>
<span>Components</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="component-alert.html">Alert</a>
</li>
<li class="submenu-item ">
<a href="component-badge.html">Badge</a>
</li>
<li class="submenu-item ">
<a href="component-breadcrumb.html">Breadcrumb</a>
</li>
<li class="submenu-item ">
<a href="component-button.html">Button</a>
</li>
<li class="submenu-item ">
<a href="component-card.html">Card</a>
</li>
<li class="submenu-item ">
<a href="component-carousel.html">Carousel</a>
</li>
<li class="submenu-item ">
<a href="component-collapse.html">Collapse</a>
</li>
<li class="submenu-item ">
<a href="component-dropdown.html">Dropdown</a>
</li>
<li class="submenu-item ">
<a href="component-list-group.html">List Group</a>
</li>
<li class="submenu-item ">
<a href="component-modal.html">Modal</a>
</li>
<li class="submenu-item ">
<a href="component-navs.html">Navs</a>
</li>
<li class="submenu-item ">
<a href="component-pagination.html">Pagination</a>
</li>
<li class="submenu-item ">
<a href="component-progress.html">Progress</a>
</li>
<li class="submenu-item ">
<a href="component-spinner.html">Spinner</a>
</li>
<li class="submenu-item ">
<a href="component-tooltip.html">Tooltip</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-collection-fill"></i>
<span>Extra Components</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="extra-component-avatar.html">Avatar</a>
</li>
<li class="submenu-item ">
<a href="extra-component-sweetalert.html">Sweet Alert</a>
</li>
<li class="submenu-item ">
<a href="extra-component-toastify.html">Toastify</a>
</li>
<li class="submenu-item ">
<a href="extra-component-rating.html">Rating</a>
</li>
<li class="submenu-item ">
<a href="extra-component-divider.html">Divider</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-grid-1x2-fill"></i>
<span>Layouts</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="layout-default.html">Default Layout</a>
</li>
<li class="submenu-item ">
<a href="layout-vertical-1-column.html">1 Column</a>
</li>
<li class="submenu-item ">
<a href="layout-vertical-navbar.html">Vertical Navbar</a>
</li>
<li class="submenu-item ">
<a href="layout-rtl.html">RTL Layout</a>
</li>
<li class="submenu-item ">
<a href="layout-horizontal.html">Horizontal Menu</a>
</li>
</ul>
</li>
<li class="sidebar-title">Forms &amp; Tables</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-hexagon-fill"></i>
<span>Form Elements</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="form-element-input.html">Input</a>
</li>
<li class="submenu-item ">
<a href="form-element-input-group.html">Input Group</a>
</li>
<li class="submenu-item ">
<a href="form-element-select.html">Select</a>
</li>
<li class="submenu-item ">
<a href="form-element-radio.html">Radio</a>
</li>
<li class="submenu-item ">
<a href="form-element-checkbox.html">Checkbox</a>
</li>
<li class="submenu-item ">
<a href="form-element-textarea.html">Textarea</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="form-layout.html" class='sidebar-link'>
<i class="bi bi-file-earmark-medical-fill"></i>
<span>Form Layout</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-pen-fill"></i>
<span>Form Editor</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="form-editor-quill.html">Quill</a>
</li>
<li class="submenu-item ">
<a href="form-editor-ckeditor.html">CKEditor</a>
</li>
<li class="submenu-item ">
<a href="form-editor-summernote.html">Summernote</a>
</li>
<li class="submenu-item ">
<a href="form-editor-tinymce.html">TinyMCE</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="table.html" class='sidebar-link'>
<i class="bi bi-grid-1x2-fill"></i>
<span>Table</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-file-earmark-spreadsheet-fill"></i>
<span>Datatables</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="table-datatable.html">Datatable</a>
</li>
<li class="submenu-item ">
<a href="table-datatable-jquery.html">Datatable (jQuery)</a>
</li>
</ul>
</li>
<li class="sidebar-title">Extra UI</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-pentagon-fill"></i>
<span>Widgets</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-widgets-chatbox.html">Chatbox</a>
</li>
<li class="submenu-item ">
<a href="ui-widgets-pricing.html">Pricing</a>
</li>
<li class="submenu-item ">
<a href="ui-widgets-todolist.html">To-do List</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-egg-fill"></i>
<span>Icons</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-icons-bootstrap-icons.html">Bootstrap Icons </a>
</li>
<li class="submenu-item ">
<a href="ui-icons-fontawesome.html">Fontawesome</a>
</li>
<li class="submenu-item ">
<a href="ui-icons-dripicons.html">Dripicons</a>
</li>
</ul>
</li>
<li
class="sidebar-item active has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-bar-chart-fill"></i>
<span>Charts</span>
</a>
<ul class="submenu active">
<li class="submenu-item active">
<a href="ui-chart-chartjs.html">ChartJS</a>
</li>
<li class="submenu-item ">
<a href="ui-chart-apexcharts.html">Apexcharts</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="ui-file-uploader.html" class='sidebar-link'>
<i class="bi bi-cloud-arrow-up-fill"></i>
<span>File Uploader</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-map-fill"></i>
<span>Maps</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-map-google-map.html">Google Map</a>
</li>
<li class="submenu-item ">
<a href="ui-map-jsvectormap.html">JS Vector Map</a>
</li>
</ul>
</li>
<li class="sidebar-title">Pages</li>
<li
class="sidebar-item ">
<a href="application-email.html" class='sidebar-link'>
<i class="bi bi-envelope-fill"></i>
<span>Email Application</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-chat.html" class='sidebar-link'>
<i class="bi bi-chat-dots-fill"></i>
<span>Chat Application</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-gallery.html" class='sidebar-link'>
<i class="bi bi-image-fill"></i>
<span>Photo Gallery</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-checkout.html" class='sidebar-link'>
<i class="bi bi-basket-fill"></i>
<span>Checkout Page</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-person-badge-fill"></i>
<span>Authentication</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="auth-login.html">Login</a>
</li>
<li class="submenu-item ">
<a href="auth-register.html">Register</a>
</li>
<li class="submenu-item ">
<a href="auth-forgot-password.html">Forgot Password</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-x-octagon-fill"></i>
<span>Errors</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="error-403.html">403</a>
</li>
<li class="submenu-item ">
<a href="error-404.html">404</a>
</li>
<li class="submenu-item ">
<a href="error-500.html">500</a>
</li>
</ul>
</li>
<li class="sidebar-title">Raise Support</li>
<li
class="sidebar-item ">
<a href="https://zuramai.github.io/mazer/docs" class='sidebar-link'>
<i class="bi bi-life-preserver"></i>
<span>Documentation</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="https://github.com/zuramai/mazer/blob/main/CONTRIBUTING.md" class='sidebar-link'>
<i class="bi bi-puzzle"></i>
<span>Contribute</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="https://github.com/zuramai/mazer#donation" class='sidebar-link'>
<i class="bi bi-cash"></i>
<span>Donate</span>
</a>
</li>
</ul>
</div>
</div>
</div>
<div id="main">
<header class="mb-3">
<a href="#" class="burger-btn d-block d-xl-none">
<i class="bi bi-justify fs-3"></i>
</a>
</header>
<div class="page-heading">
<div class="page-title">
<div class="row">
<div class="col-12 col-md-6 order-md-1 order-last">
<h3>ChartJS</h3>
<p class="text-subtitle text-muted">A chart says more than a thousand words.</p>
</div>
<div class="col-12 col-md-6 order-md-2 order-first">
<nav aria-label="breadcrumb" class="breadcrumb-header float-start float-lg-end">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="index.html">Dashboard</a></li>
<li class="breadcrumb-item active" aria-current="page">ChartJS</li>
</ol>
</nav>
</div>
</div>
</div>
<section class="section">
<div class="row">
<div class="col-md-6">
<div class="card">
<div class="card-header">
<h4 class="card-title">Bar Chart</h4>
</div>
<div class="card-body">
<canvas id="bar"></canvas>
</div>
</div>
</div>
<div class="col-md-6">
<div class="card">
<div class="card-header">
<h4 class="card-title">Line Chart</h4>
</div>
<div class="card-body">
<canvas id="line"></canvas>
</div>
</div>
</div>
</div>
</section>
</div>
<footer>
<div class="footer clearfix mb-0 text-muted">
<div class="float-start">
<p>2021 &copy; Mazer</p>
</div>
<div class="float-end">
<p>Crafted with <span class="text-danger"><i class="bi bi-heart"></i></span> by <a
href="https://saugi.me">Saugi</a></p>
</div>
</div>
</footer>
</div>
</div>
<script src="assets/js/app.js"></script>
<script src="assets/js/extensions/ui-chartjs.js"></script>
</body>
</html>
public/dashboard/ui-file-uploader.html 0 → 100644
View file @ 4c981655
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>File Uploader - Mazer Admin Dashboard</title>
<link rel="stylesheet" href="assets/css/main/app.css">
<link rel="stylesheet" href="assets/css/main/app-dark.css">
<link rel="shortcut icon" href="assets/images/logo/favicon.svg" type="image/x-icon">
<link rel="shortcut icon" href="assets/images/logo/favicon.png" type="image/png">
<link rel="stylesheet" href="assets/css/pages/filepond.css">
</head>
<body>
<div id="app">
<div id="sidebar" class="active">
<div class="sidebar-wrapper active">
<div class="sidebar-header position-relative">
<div class="d-flex justify-content-between align-items-center">
<div class="logo">
<a href="index.html"><img src="assets/images/logo/logo.svg" alt="Logo" srcset=""></a>
</div>
<div class="theme-toggle d-flex gap-2 align-items-center mt-2">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--system-uicons" width="20" height="20" preserveAspectRatio="xMidYMid meet" viewBox="0 0 21 21"><g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"><path d="M10.5 14.5c2.219 0 4-1.763 4-3.982a4.003 4.003 0 0 0-4-4.018c-2.219 0-4 1.781-4 4c0 2.219 1.781 4 4 4zM4.136 4.136L5.55 5.55m9.9 9.9l1.414 1.414M1.5 10.5h2m14 0h2M4.135 16.863L5.55 15.45m9.899-9.9l1.414-1.415M10.5 19.5v-2m0-14v-2" opacity=".3"></path><g transform="translate(-210 -1)"><path d="M220.5 2.5v2m6.5.5l-1.5 1.5"></path><circle cx="220.5" cy="11.5" r="4"></circle><path d="m214 5l1.5 1.5m5 14v-2m6.5-.5l-1.5-1.5M214 18l1.5-1.5m-4-5h2m14 0h2"></path></g></g></svg>
<div class="form-check form-switch fs-6">
<input class="form-check-input me-0" type="checkbox" id="toggle-dark" >
<label class="form-check-label" ></label>
</div>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--mdi" width="20" height="20" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path fill="currentColor" d="m17.75 4.09l-2.53 1.94l.91 3.06l-2.63-1.81l-2.63 1.81l.91-3.06l-2.53-1.94L12.44 4l1.06-3l1.06 3l3.19.09m3.5 6.91l-1.64 1.25l.59 1.98l-1.7-1.17l-1.7 1.17l.59-1.98L15.75 11l2.06-.05L18.5 9l.69 1.95l2.06.05m-2.28 4.95c.83-.08 1.72 1.1 1.19 1.85c-.32.45-.66.87-1.08 1.27C15.17 23 8.84 23 4.94 19.07c-3.91-3.9-3.91-10.24 0-14.14c.4-.4.82-.76 1.27-1.08c.75-.53 1.93.36 1.85 1.19c-.27 2.86.69 5.83 2.89 8.02a9.96 9.96 0 0 0 8.02 2.89m-1.64 2.02a12.08 12.08 0 0 1-7.8-3.47c-2.17-2.19-3.33-5-3.49-7.82c-2.81 3.14-2.7 7.96.31 10.98c3.02 3.01 7.84 3.12 10.98.31Z"></path></svg>
</div>
<div class="sidebar-toggler x">
<a href="#" class="sidebar-hide d-xl-none d-block"><i class="bi bi-x bi-middle"></i></a>
</div>
</div>
</div>
<div class="sidebar-menu">
<ul class="menu">
<li class="sidebar-title">Menu</li>
<li
class="sidebar-item ">
<a href="index.html" class='sidebar-link'>
<i class="bi bi-grid-fill"></i>
<span>Dashboard</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-stack"></i>
<span>Components</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="component-alert.html">Alert</a>
</li>
<li class="submenu-item ">
<a href="component-badge.html">Badge</a>
</li>
<li class="submenu-item ">
<a href="component-breadcrumb.html">Breadcrumb</a>
</li>
<li class="submenu-item ">
<a href="component-button.html">Button</a>
</li>
<li class="submenu-item ">
<a href="component-card.html">Card</a>
</li>
<li class="submenu-item ">
<a href="component-carousel.html">Carousel</a>
</li>
<li class="submenu-item ">
<a href="component-collapse.html">Collapse</a>
</li>
<li class="submenu-item ">
<a href="component-dropdown.html">Dropdown</a>
</li>
<li class="submenu-item ">
<a href="component-list-group.html">List Group</a>
</li>
<li class="submenu-item ">
<a href="component-modal.html">Modal</a>
</li>
<li class="submenu-item ">
<a href="component-navs.html">Navs</a>
</li>
<li class="submenu-item ">
<a href="component-pagination.html">Pagination</a>
</li>
<li class="submenu-item ">
<a href="component-progress.html">Progress</a>
</li>
<li class="submenu-item ">
<a href="component-spinner.html">Spinner</a>
</li>
<li class="submenu-item ">
<a href="component-tooltip.html">Tooltip</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-collection-fill"></i>
<span>Extra Components</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="extra-component-avatar.html">Avatar</a>
</li>
<li class="submenu-item ">
<a href="extra-component-sweetalert.html">Sweet Alert</a>
</li>
<li class="submenu-item ">
<a href="extra-component-toastify.html">Toastify</a>
</li>
<li class="submenu-item ">
<a href="extra-component-rating.html">Rating</a>
</li>
<li class="submenu-item ">
<a href="extra-component-divider.html">Divider</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-grid-1x2-fill"></i>
<span>Layouts</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="layout-default.html">Default Layout</a>
</li>
<li class="submenu-item ">
<a href="layout-vertical-1-column.html">1 Column</a>
</li>
<li class="submenu-item ">
<a href="layout-vertical-navbar.html">Vertical Navbar</a>
</li>
<li class="submenu-item ">
<a href="layout-rtl.html">RTL Layout</a>
</li>
<li class="submenu-item ">
<a href="layout-horizontal.html">Horizontal Menu</a>
</li>
</ul>
</li>
<li class="sidebar-title">Forms &amp; Tables</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-hexagon-fill"></i>
<span>Form Elements</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="form-element-input.html">Input</a>
</li>
<li class="submenu-item ">
<a href="form-element-input-group.html">Input Group</a>
</li>
<li class="submenu-item ">
<a href="form-element-select.html">Select</a>
</li>
<li class="submenu-item ">
<a href="form-element-radio.html">Radio</a>
</li>
<li class="submenu-item ">
<a href="form-element-checkbox.html">Checkbox</a>
</li>
<li class="submenu-item ">
<a href="form-element-textarea.html">Textarea</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="form-layout.html" class='sidebar-link'>
<i class="bi bi-file-earmark-medical-fill"></i>
<span>Form Layout</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-pen-fill"></i>
<span>Form Editor</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="form-editor-quill.html">Quill</a>
</li>
<li class="submenu-item ">
<a href="form-editor-ckeditor.html">CKEditor</a>
</li>
<li class="submenu-item ">
<a href="form-editor-summernote.html">Summernote</a>
</li>
<li class="submenu-item ">
<a href="form-editor-tinymce.html">TinyMCE</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="table.html" class='sidebar-link'>
<i class="bi bi-grid-1x2-fill"></i>
<span>Table</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-file-earmark-spreadsheet-fill"></i>
<span>Datatables</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="table-datatable.html">Datatable</a>
</li>
<li class="submenu-item ">
<a href="table-datatable-jquery.html">Datatable (jQuery)</a>
</li>
</ul>
</li>
<li class="sidebar-title">Extra UI</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-pentagon-fill"></i>
<span>Widgets</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-widgets-chatbox.html">Chatbox</a>
</li>
<li class="submenu-item ">
<a href="ui-widgets-pricing.html">Pricing</a>
</li>
<li class="submenu-item ">
<a href="ui-widgets-todolist.html">To-do List</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-egg-fill"></i>
<span>Icons</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-icons-bootstrap-icons.html">Bootstrap Icons </a>
</li>
<li class="submenu-item ">
<a href="ui-icons-fontawesome.html">Fontawesome</a>
</li>
<li class="submenu-item ">
<a href="ui-icons-dripicons.html">Dripicons</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-bar-chart-fill"></i>
<span>Charts</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-chart-chartjs.html">ChartJS</a>
</li>
<li class="submenu-item ">
<a href="ui-chart-apexcharts.html">Apexcharts</a>
</li>
</ul>
</li>
<li
class="sidebar-item active ">
<a href="ui-file-uploader.html" class='sidebar-link'>
<i class="bi bi-cloud-arrow-up-fill"></i>
<span>File Uploader</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-map-fill"></i>
<span>Maps</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-map-google-map.html">Google Map</a>
</li>
<li class="submenu-item ">
<a href="ui-map-jsvectormap.html">JS Vector Map</a>
</li>
</ul>
</li>
<li class="sidebar-title">Pages</li>
<li
class="sidebar-item ">
<a href="application-email.html" class='sidebar-link'>
<i class="bi bi-envelope-fill"></i>
<span>Email Application</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-chat.html" class='sidebar-link'>
<i class="bi bi-chat-dots-fill"></i>
<span>Chat Application</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-gallery.html" class='sidebar-link'>
<i class="bi bi-image-fill"></i>
<span>Photo Gallery</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-checkout.html" class='sidebar-link'>
<i class="bi bi-basket-fill"></i>
<span>Checkout Page</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-person-badge-fill"></i>
<span>Authentication</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="auth-login.html">Login</a>
</li>
<li class="submenu-item ">
<a href="auth-register.html">Register</a>
</li>
<li class="submenu-item ">
<a href="auth-forgot-password.html">Forgot Password</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-x-octagon-fill"></i>
<span>Errors</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="error-403.html">403</a>
</li>
<li class="submenu-item ">
<a href="error-404.html">404</a>
</li>
<li class="submenu-item ">
<a href="error-500.html">500</a>
</li>
</ul>
</li>
<li class="sidebar-title">Raise Support</li>
<li
class="sidebar-item ">
<a href="https://zuramai.github.io/mazer/docs" class='sidebar-link'>
<i class="bi bi-life-preserver"></i>
<span>Documentation</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="https://github.com/zuramai/mazer/blob/main/CONTRIBUTING.md" class='sidebar-link'>
<i class="bi bi-puzzle"></i>
<span>Contribute</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="https://github.com/zuramai/mazer#donation" class='sidebar-link'>
<i class="bi bi-cash"></i>
<span>Donate</span>
</a>
</li>
</ul>
</div>
</div>
</div>
<div id="main">
<header class="mb-3">
<a href="#" class="burger-btn d-block d-xl-none">
<i class="bi bi-justify fs-3"></i>
</a>
</header>
<div class="page-heading">
<div class="page-title">
<div class="row">
<div class="col-12 col-md-6 order-md-1 order-last">
<h3>File Uploader</h3>
<p class="text-subtitle text-muted">Javascript enhanced uploaders for easier file handling</p>
</div>
<div class="col-12 col-md-6 order-md-2 order-first">
<nav aria-label="breadcrumb" class="breadcrumb-header float-start float-lg-end">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="index.html">Dashboard</a></li>
<li class="breadcrumb-item active" aria-current="page">File Uploader</li>
</ol>
</nav>
</div>
</div>
</div>
<section class="section">
<div class="row">
<div class="col-12 col-md-6">
<div class="card">
<div class="card-header">
<h5 class="card-title">Basic File Uploader</h5>
</div>
<div class="card-content">
<div class="card-body">
<p class="card-text">Using the basic file uploader up, upload here to see how
<code>.basic-filepond</code> look.
</p>
<!-- Basic file uploader -->
<input type="file" class="basic-filepond">
</div>
</div>
</div>
</div>
<div class="col-12 col-md-6">
<div class="card">
<div class="card-header">
<h5 class="card-title">ImgBB Uploader</h5>
</div>
<div class="card-content">
<div class="card-body">
<p class="card-text">Using the basic file uploader up, upload here to see how
<code>.imgbb-filepond</code>-based basic file uploader look. You must use
<code>name=image</code> or by FormData fieldName for your
input <code>type=file</code> to upload in imgBB.
</p>
<!-- imgBB file uploader -->
<input type="file" name="image" class="imgbb-filepond">
</div>
</div>
</div>
</div>
<div class="col-12 col-md-12">
<div class="card">
<div class="card-header">
<h5 class="card-title">Multiple Files</h5>
</div>
<div class="card-content">
<div class="card-body">
<p class="card-text">Using the basic table up, upload here to see how
<code>.multiple-files-filepond</code>-based basic file uploader look. You can use
<code>allowMultiple</code> or <code>multiple</code> attribute too to implement multiple
upload.
</p>
<!-- File uploader with multiple files upload -->
<input type="file" class="multiple-files-filepond" multiple>
</div>
</div>
</div>
</div>
<div class="col-12 col-md-12">
<div class="card">
<div class="card-header">
<h5 class="card-title">With Validation</h5>
</div>
<div class="card-content">
<div class="card-body">
<p class="card-text">Using the basic table up, upload here to see how
<code>.with-validation-filepond</code>-based basic file uploader look. You can use
<a href="https://pqina.nl/filepond/docs/patterns/plugins/file-validate-size/#properties"
target="_blank">see here</a>
or <code>required (to make your input required), data-max-file-size (to limit your input file size),
data-max-files (to limit your uploaded files), etc (start with data-)</code> attribute
too to implement validation.
</p>
<!-- File uploader with validation -->
<input type="file" class="with-validation-filepond" required multiple
data-max-file-size="1MB" data-max-files="3">
</div>
</div>
</div>
</div>
<div class="col-12 col-md-6">
<div class="card">
<div class="card-header">
<h5 class="card-title">Image Preview</h5>
</div>
<div class="card-content">
<div class="card-body">
<p class="card-text">Using the basic table up, upload here to see how
<code>.image-preview-filepond</code>-based basic file uploader look. This
preview for uploaded or dropped images.
</p>
<!-- File uploader with image preview -->
<input type="file" class="image-preview-filepond">
</div>
</div>
</div>
</div>
<div class="col-12 col-md-6">
<div class="card">
<div class="card-header">
<h5 class="card-title">Image Exif Orientation</h5>
</div>
<div class="card-content">
<div class="card-body">
<p class="card-text">Using the basic table up, upload here to see how
<code>.image-exif-filepond</code>-based basic file uploader look. This
helps in correctly orienting photos taken on mobile devices.
</p>
<!-- Auto image crop file uploader -->
<input type="file" class="image-exif-filepond">
</div>
</div>
</div>
</div>
<div class="col-12 col-md-12">
<div class="card">
<div class="card-header">
<h5 class="card-title">Image Auto Crop</h5>
</div>
<div class="card-content">
<div class="card-body">
<p class="card-text">Using the basic table up, upload here to see how
<code>.image-crop-filepond</code>-based basic file uploader look. You can use
<code>imageCropAspectRatio</code> or <code>image-crop-aspect-ratio</code> to
set aspect ratio.
</p>
<!-- Auto crop image file uploader -->
<input type="file" class="image-crop-filepond" image-crop-aspect-ratio="1:1">
</div>
</div>
</div>
</div>
<div class="col-12 col-md-6">
<div class="card">
<div class="card-header">
<h5 class="card-title">Image Auto Filter</h5>
</div>
<div class="card-content">
<div class="card-body">
<p class="card-text">Using the basic table up, upload here to see how
<code>.image-filter-filepond</code>-based basic file uploader look.
</p>
<!-- Auto filter image file uploader -->
<input type="file" class="image-filter-filepond">
</div>
</div>
</div>
</div>
<div class="col-12 col-md-6">
<div class="card">
<div class="card-header">
<h5 class="card-title">Image Auto Resize</h5>
</div>
<div class="card-content">
<div class="card-body">
<p class="card-text">Using the basic table up, upload here to see how
<code>.image-resize-filepond</code>-based basic file uploader look.
</p>
<!-- Auto resize image file uploader -->
<input type="file" class="image-resize-filepond">
</div>
</div>
</div>
</div>
</div>
</section>
</div>
<footer>
<div class="footer clearfix mb-0 text-muted">
<div class="float-start">
<p>2021 &copy; Mazer</p>
</div>
<div class="float-end">
<p>Crafted with <span class="text-danger"><i class="bi bi-heart"></i></span> by <a
href="https://saugi.me">Saugi</a></p>
</div>
</div>
</footer>
</div>
</div>
<script src="assets/js/app.js"></script>
<script src="assets/js/extensions/filepond.js"></script>
</body>
</html>
public/dashboard/ui-icons-bootstrap-icons.html 0 → 100644
View file @ 4c981655
This source diff could not be displayed because it is too large. You can view the blob instead.
public/dashboard/ui-icons-dripicons.html 0 → 100644
View file @ 4c981655
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Dripicons - Mazer Admin Dashboard</title>
<link rel="stylesheet" href="assets/css/main/app.css">
<link rel="stylesheet" href="assets/css/main/app-dark.css">
<link rel="shortcut icon" href="assets/images/logo/favicon.svg" type="image/x-icon">
<link rel="shortcut icon" href="assets/images/logo/favicon.png" type="image/png">
<link rel="stylesheet" href="assets/css/pages/dripicons.css">
</head>
<body>
<div id="app">
<div id="sidebar" class="active">
<div class="sidebar-wrapper active">
<div class="sidebar-header position-relative">
<div class="d-flex justify-content-between align-items-center">
<div class="logo">
<a href="index.html"><img src="assets/images/logo/logo.svg" alt="Logo" srcset=""></a>
</div>
<div class="theme-toggle d-flex gap-2 align-items-center mt-2">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--system-uicons" width="20" height="20" preserveAspectRatio="xMidYMid meet" viewBox="0 0 21 21"><g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"><path d="M10.5 14.5c2.219 0 4-1.763 4-3.982a4.003 4.003 0 0 0-4-4.018c-2.219 0-4 1.781-4 4c0 2.219 1.781 4 4 4zM4.136 4.136L5.55 5.55m9.9 9.9l1.414 1.414M1.5 10.5h2m14 0h2M4.135 16.863L5.55 15.45m9.899-9.9l1.414-1.415M10.5 19.5v-2m0-14v-2" opacity=".3"></path><g transform="translate(-210 -1)"><path d="M220.5 2.5v2m6.5.5l-1.5 1.5"></path><circle cx="220.5" cy="11.5" r="4"></circle><path d="m214 5l1.5 1.5m5 14v-2m6.5-.5l-1.5-1.5M214 18l1.5-1.5m-4-5h2m14 0h2"></path></g></g></svg>
<div class="form-check form-switch fs-6">
<input class="form-check-input me-0" type="checkbox" id="toggle-dark" >
<label class="form-check-label" ></label>
</div>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--mdi" width="20" height="20" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path fill="currentColor" d="m17.75 4.09l-2.53 1.94l.91 3.06l-2.63-1.81l-2.63 1.81l.91-3.06l-2.53-1.94L12.44 4l1.06-3l1.06 3l3.19.09m3.5 6.91l-1.64 1.25l.59 1.98l-1.7-1.17l-1.7 1.17l.59-1.98L15.75 11l2.06-.05L18.5 9l.69 1.95l2.06.05m-2.28 4.95c.83-.08 1.72 1.1 1.19 1.85c-.32.45-.66.87-1.08 1.27C15.17 23 8.84 23 4.94 19.07c-3.91-3.9-3.91-10.24 0-14.14c.4-.4.82-.76 1.27-1.08c.75-.53 1.93.36 1.85 1.19c-.27 2.86.69 5.83 2.89 8.02a9.96 9.96 0 0 0 8.02 2.89m-1.64 2.02a12.08 12.08 0 0 1-7.8-3.47c-2.17-2.19-3.33-5-3.49-7.82c-2.81 3.14-2.7 7.96.31 10.98c3.02 3.01 7.84 3.12 10.98.31Z"></path></svg>
</div>
<div class="sidebar-toggler x">
<a href="#" class="sidebar-hide d-xl-none d-block"><i class="bi bi-x bi-middle"></i></a>
</div>
</div>
</div>
<div class="sidebar-menu">
<ul class="menu">
<li class="sidebar-title">Menu</li>
<li
class="sidebar-item ">
<a href="index.html" class='sidebar-link'>
<i class="bi bi-grid-fill"></i>
<span>Dashboard</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-stack"></i>
<span>Components</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="component-alert.html">Alert</a>
</li>
<li class="submenu-item ">
<a href="component-badge.html">Badge</a>
</li>
<li class="submenu-item ">
<a href="component-breadcrumb.html">Breadcrumb</a>
</li>
<li class="submenu-item ">
<a href="component-button.html">Button</a>
</li>
<li class="submenu-item ">
<a href="component-card.html">Card</a>
</li>
<li class="submenu-item ">
<a href="component-carousel.html">Carousel</a>
</li>
<li class="submenu-item ">
<a href="component-collapse.html">Collapse</a>
</li>
<li class="submenu-item ">
<a href="component-dropdown.html">Dropdown</a>
</li>
<li class="submenu-item ">
<a href="component-list-group.html">List Group</a>
</li>
<li class="submenu-item ">
<a href="component-modal.html">Modal</a>
</li>
<li class="submenu-item ">
<a href="component-navs.html">Navs</a>
</li>
<li class="submenu-item ">
<a href="component-pagination.html">Pagination</a>
</li>
<li class="submenu-item ">
<a href="component-progress.html">Progress</a>
</li>
<li class="submenu-item ">
<a href="component-spinner.html">Spinner</a>
</li>
<li class="submenu-item ">
<a href="component-tooltip.html">Tooltip</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-collection-fill"></i>
<span>Extra Components</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="extra-component-avatar.html">Avatar</a>
</li>
<li class="submenu-item ">
<a href="extra-component-sweetalert.html">Sweet Alert</a>
</li>
<li class="submenu-item ">
<a href="extra-component-toastify.html">Toastify</a>
</li>
<li class="submenu-item ">
<a href="extra-component-rating.html">Rating</a>
</li>
<li class="submenu-item ">
<a href="extra-component-divider.html">Divider</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-grid-1x2-fill"></i>
<span>Layouts</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="layout-default.html">Default Layout</a>
</li>
<li class="submenu-item ">
<a href="layout-vertical-1-column.html">1 Column</a>
</li>
<li class="submenu-item ">
<a href="layout-vertical-navbar.html">Vertical Navbar</a>
</li>
<li class="submenu-item ">
<a href="layout-rtl.html">RTL Layout</a>
</li>
<li class="submenu-item ">
<a href="layout-horizontal.html">Horizontal Menu</a>
</li>
</ul>
</li>
<li class="sidebar-title">Forms &amp; Tables</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-hexagon-fill"></i>
<span>Form Elements</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="form-element-input.html">Input</a>
</li>
<li class="submenu-item ">
<a href="form-element-input-group.html">Input Group</a>
</li>
<li class="submenu-item ">
<a href="form-element-select.html">Select</a>
</li>
<li class="submenu-item ">
<a href="form-element-radio.html">Radio</a>
</li>
<li class="submenu-item ">
<a href="form-element-checkbox.html">Checkbox</a>
</li>
<li class="submenu-item ">
<a href="form-element-textarea.html">Textarea</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="form-layout.html" class='sidebar-link'>
<i class="bi bi-file-earmark-medical-fill"></i>
<span>Form Layout</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-pen-fill"></i>
<span>Form Editor</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="form-editor-quill.html">Quill</a>
</li>
<li class="submenu-item ">
<a href="form-editor-ckeditor.html">CKEditor</a>
</li>
<li class="submenu-item ">
<a href="form-editor-summernote.html">Summernote</a>
</li>
<li class="submenu-item ">
<a href="form-editor-tinymce.html">TinyMCE</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="table.html" class='sidebar-link'>
<i class="bi bi-grid-1x2-fill"></i>
<span>Table</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-file-earmark-spreadsheet-fill"></i>
<span>Datatables</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="table-datatable.html">Datatable</a>
</li>
<li class="submenu-item ">
<a href="table-datatable-jquery.html">Datatable (jQuery)</a>
</li>
</ul>
</li>
<li class="sidebar-title">Extra UI</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-pentagon-fill"></i>
<span>Widgets</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-widgets-chatbox.html">Chatbox</a>
</li>
<li class="submenu-item ">
<a href="ui-widgets-pricing.html">Pricing</a>
</li>
<li class="submenu-item ">
<a href="ui-widgets-todolist.html">To-do List</a>
</li>
</ul>
</li>
<li
class="sidebar-item active has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-egg-fill"></i>
<span>Icons</span>
</a>
<ul class="submenu active">
<li class="submenu-item ">
<a href="ui-icons-bootstrap-icons.html">Bootstrap Icons </a>
</li>
<li class="submenu-item ">
<a href="ui-icons-fontawesome.html">Fontawesome</a>
</li>
<li class="submenu-item active">
<a href="ui-icons-dripicons.html">Dripicons</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-bar-chart-fill"></i>
<span>Charts</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-chart-chartjs.html">ChartJS</a>
</li>
<li class="submenu-item ">
<a href="ui-chart-apexcharts.html">Apexcharts</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="ui-file-uploader.html" class='sidebar-link'>
<i class="bi bi-cloud-arrow-up-fill"></i>
<span>File Uploader</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-map-fill"></i>
<span>Maps</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-map-google-map.html">Google Map</a>
</li>
<li class="submenu-item ">
<a href="ui-map-jsvectormap.html">JS Vector Map</a>
</li>
</ul>
</li>
<li class="sidebar-title">Pages</li>
<li
class="sidebar-item ">
<a href="application-email.html" class='sidebar-link'>
<i class="bi bi-envelope-fill"></i>
<span>Email Application</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-chat.html" class='sidebar-link'>
<i class="bi bi-chat-dots-fill"></i>
<span>Chat Application</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-gallery.html" class='sidebar-link'>
<i class="bi bi-image-fill"></i>
<span>Photo Gallery</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-checkout.html" class='sidebar-link'>
<i class="bi bi-basket-fill"></i>
<span>Checkout Page</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-person-badge-fill"></i>
<span>Authentication</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="auth-login.html">Login</a>
</li>
<li class="submenu-item ">
<a href="auth-register.html">Register</a>
</li>
<li class="submenu-item ">
<a href="auth-forgot-password.html">Forgot Password</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-x-octagon-fill"></i>
<span>Errors</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="error-403.html">403</a>
</li>
<li class="submenu-item ">
<a href="error-404.html">404</a>
</li>
<li class="submenu-item ">
<a href="error-500.html">500</a>
</li>
</ul>
</li>
<li class="sidebar-title">Raise Support</li>
<li
class="sidebar-item ">
<a href="https://zuramai.github.io/mazer/docs" class='sidebar-link'>
<i class="bi bi-life-preserver"></i>
<span>Documentation</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="https://github.com/zuramai/mazer/blob/main/CONTRIBUTING.md" class='sidebar-link'>
<i class="bi bi-puzzle"></i>
<span>Contribute</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="https://github.com/zuramai/mazer#donation" class='sidebar-link'>
<i class="bi bi-cash"></i>
<span>Donate</span>
</a>
</li>
</ul>
</div>
</div>
</div>
<div id="main">
<header class="mb-3">
<a href="#" class="burger-btn d-block d-xl-none">
<i class="bi bi-justify fs-3"></i>
</a>
</header>
<div class="page-heading">
<div class="page-title">
<div class="row">
<div class="col-12 col-md-6 order-md-1 order-last">
<h3>Dripicons</h3>
<p class="text-subtitle text-muted">Get over 1,000+ icons with Dripicons </p>
</div>
<div class="col-12 col-md-6 order-md-2 order-first">
<nav aria-label="breadcrumb" class="breadcrumb-header float-start float-lg-end">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="index.html">Dashboard</a></li>
<li class="breadcrumb-item active" aria-current="page">Dripicons</li>
</ol>
</nav>
</div>
</div>
</div>
<section class="section">
<div class="card">
<div class="card-header">
<h4 class="card-title">Icon List</h4>
</div>
<div class="card-body">
<ul class="icons">
<ul class="glyphs css-mapping">
<li>
<div class="icon dripicons dripicons-alarm"></div>
<input type="text" readonly="readonly" value="alarm">
</li>
<li>
<div class="icon dripicons dripicons-align-center"></div>
<input type="text" readonly="readonly" value="align-center">
</li>
<li>
<div class="icon dripicons dripicons-align-justify"></div>
<input type="text" readonly="readonly" value="align-justify">
</li>
<li>
<div class="icon dripicons dripicons-align-left"></div>
<input type="text" readonly="readonly" value="align-left">
</li>
<li>
<div class="icon dripicons dripicons-align-right"></div>
<input type="text" readonly="readonly" value="align-right">
</li>
<li>
<div class="icon dripicons dripicons-anchor"></div>
<input type="text" readonly="readonly" value="anchor">
</li>
<li>
<div class="icon dripicons dripicons-archive"></div>
<input type="text" readonly="readonly" value="archive">
</li>
<li>
<div class="icon dripicons dripicons-arrow-down"></div>
<input type="text" readonly="readonly" value="arrow-down">
</li>
<li>
<div class="icon dripicons dripicons-arrow-left"></div>
<input type="text" readonly="readonly" value="arrow-left">
</li>
<li>
<div class="icon dripicons dripicons-arrow-right"></div>
<input type="text" readonly="readonly" value="arrow-right">
</li>
<li>
<div class="icon dripicons dripicons-arrow-thin-down"></div>
<input type="text" readonly="readonly" value="arrow-thin-down">
</li>
<li>
<div class="icon dripicons dripicons-arrow-thin-left"></div>
<input type="text" readonly="readonly" value="arrow-thin-left">
</li>
<li>
<div class="icon dripicons dripicons-arrow-thin-right"></div>
<input type="text" readonly="readonly" value="arrow-thin-right">
</li>
<li>
<div class="icon dripicons dripicons-arrow-thin-up"></div>
<input type="text" readonly="readonly" value="arrow-thin-up">
</li>
<li>
<div class="icon dripicons dripicons-arrow-up"></div>
<input type="text" readonly="readonly" value="arrow-up">
</li>
<li>
<div class="icon dripicons dripicons-article"></div>
<input type="text" readonly="readonly" value="article">
</li>
<li>
<div class="icon dripicons dripicons-backspace"></div>
<input type="text" readonly="readonly" value="backspace">
</li>
<li>
<div class="icon dripicons dripicons-basket"></div>
<input type="text" readonly="readonly" value="basket">
</li>
<li>
<div class="icon dripicons dripicons-basketball"></div>
<input type="text" readonly="readonly" value="basketball">
</li>
<li>
<div class="icon dripicons dripicons-battery-empty"></div>
<input type="text" readonly="readonly" value="battery-empty">
</li>
<li>
<div class="icon dripicons dripicons-battery-full"></div>
<input type="text" readonly="readonly" value="battery-full">
</li>
<li>
<div class="icon dripicons dripicons-battery-low"></div>
<input type="text" readonly="readonly" value="battery-low">
</li>
<li>
<div class="icon dripicons dripicons-battery-medium"></div>
<input type="text" readonly="readonly" value="battery-medium">
</li>
<li>
<div class="icon dripicons dripicons-bell"></div>
<input type="text" readonly="readonly" value="bell">
</li>
<li>
<div class="icon dripicons dripicons-blog"></div>
<input type="text" readonly="readonly" value="blog">
</li>
<li>
<div class="icon dripicons dripicons-bluetooth"></div>
<input type="text" readonly="readonly" value="bluetooth">
</li>
<li>
<div class="icon dripicons dripicons-bold"></div>
<input type="text" readonly="readonly" value="bold">
</li>
<li>
<div class="icon dripicons dripicons-bookmark"></div>
<input type="text" readonly="readonly" value="bookmark">
</li>
<li>
<div class="icon dripicons dripicons-bookmarks"></div>
<input type="text" readonly="readonly" value="bookmarks">
</li>
<li>
<div class="icon dripicons dripicons-box"></div>
<input type="text" readonly="readonly" value="box">
</li>
<li>
<div class="icon dripicons dripicons-briefcase"></div>
<input type="text" readonly="readonly" value="briefcase">
</li>
<li>
<div class="icon dripicons dripicons-brightness-low"></div>
<input type="text" readonly="readonly" value="brightness-low">
</li>
<li>
<div class="icon dripicons dripicons-brightness-max"></div>
<input type="text" readonly="readonly" value="brightness-max">
</li>
<li>
<div class="icon dripicons dripicons-brightness-medium"></div>
<input type="text" readonly="readonly" value="brightness-medium">
</li>
<li>
<div class="icon dripicons dripicons-broadcast"></div>
<input type="text" readonly="readonly" value="broadcast">
</li>
<li>
<div class="icon dripicons dripicons-browser"></div>
<input type="text" readonly="readonly" value="browser">
</li>
<li>
<div class="icon dripicons dripicons-browser-upload"></div>
<input type="text" readonly="readonly" value="browser-upload">
</li>
<li>
<div class="icon dripicons dripicons-brush"></div>
<input type="text" readonly="readonly" value="brush">
</li>
<li>
<div class="icon dripicons dripicons-calendar"></div>
<input type="text" readonly="readonly" value="calendar">
</li>
<li>
<div class="icon dripicons dripicons-camcorder"></div>
<input type="text" readonly="readonly" value="camcorder">
</li>
<li>
<div class="icon dripicons dripicons-camera"></div>
<input type="text" readonly="readonly" value="camera">
</li>
<li>
<div class="icon dripicons dripicons-card"></div>
<input type="text" readonly="readonly" value="card">
</li>
<li>
<div class="icon dripicons dripicons-cart"></div>
<input type="text" readonly="readonly" value="cart">
</li>
<li>
<div class="icon dripicons dripicons-checklist"></div>
<input type="text" readonly="readonly" value="checklist">
</li>
<li>
<div class="icon dripicons dripicons-checkmark"></div>
<input type="text" readonly="readonly" value="checkmark">
</li>
<li>
<div class="icon dripicons dripicons-chevron-down"></div>
<input type="text" readonly="readonly" value="chevron-down">
</li>
<li>
<div class="icon dripicons dripicons-chevron-left"></div>
<input type="text" readonly="readonly" value="chevron-left">
</li>
<li>
<div class="icon dripicons dripicons-chevron-right"></div>
<input type="text" readonly="readonly" value="chevron-right">
</li>
<li>
<div class="icon dripicons dripicons-chevron-up"></div>
<input type="text" readonly="readonly" value="chevron-up">
</li>
<li>
<div class="icon dripicons dripicons-clipboard"></div>
<input type="text" readonly="readonly" value="clipboard">
</li>
<li>
<div class="icon dripicons dripicons-clock"></div>
<input type="text" readonly="readonly" value="clock">
</li>
<li>
<div class="icon dripicons dripicons-clockwise"></div>
<input type="text" readonly="readonly" value="clockwise">
</li>
<li>
<div class="icon dripicons dripicons-cloud"></div>
<input type="text" readonly="readonly" value="cloud">
</li>
<li>
<div class="icon dripicons dripicons-cloud-download"></div>
<input type="text" readonly="readonly" value="cloud-download">
</li>
<li>
<div class="icon dripicons dripicons-cloud-upload"></div>
<input type="text" readonly="readonly" value="cloud-upload">
</li>
<li>
<div class="icon dripicons dripicons-code"></div>
<input type="text" readonly="readonly" value="code">
</li>
<li>
<div class="icon dripicons dripicons-contract"></div>
<input type="text" readonly="readonly" value="contract">
</li>
<li>
<div class="icon dripicons dripicons-contract-2"></div>
<input type="text" readonly="readonly" value="contract-2">
</li>
<li>
<div class="icon dripicons dripicons-conversation"></div>
<input type="text" readonly="readonly" value="conversation">
</li>
<li>
<div class="icon dripicons dripicons-copy"></div>
<input type="text" readonly="readonly" value="copy">
</li>
<li>
<div class="icon dripicons dripicons-crop"></div>
<input type="text" readonly="readonly" value="crop">
</li>
<li>
<div class="icon dripicons dripicons-cross"></div>
<input type="text" readonly="readonly" value="cross">
</li>
<li>
<div class="icon dripicons dripicons-crosshair"></div>
<input type="text" readonly="readonly" value="crosshair">
</li>
<li>
<div class="icon dripicons dripicons-cutlery"></div>
<input type="text" readonly="readonly" value="cutlery">
</li>
<li>
<div class="icon dripicons dripicons-device-desktop"></div>
<input type="text" readonly="readonly" value="device-desktop">
</li>
<li>
<div class="icon dripicons dripicons-device-mobile"></div>
<input type="text" readonly="readonly" value="device-mobile">
</li>
<li>
<div class="icon dripicons dripicons-device-tablet"></div>
<input type="text" readonly="readonly" value="device-tablet">
</li>
<li>
<div class="icon dripicons dripicons-direction"></div>
<input type="text" readonly="readonly" value="direction">
</li>
<li>
<div class="icon dripicons dripicons-disc"></div>
<input type="text" readonly="readonly" value="disc">
</li>
<li>
<div class="icon dripicons dripicons-document"></div>
<input type="text" readonly="readonly" value="document">
</li>
<li>
<div class="icon dripicons dripicons-document-delete"></div>
<input type="text" readonly="readonly" value="document-delete">
</li>
<li>
<div class="icon dripicons dripicons-document-edit"></div>
<input type="text" readonly="readonly" value="document-edit">
</li>
<li>
<div class="icon dripicons dripicons-document-new"></div>
<input type="text" readonly="readonly" value="document-new">
</li>
<li>
<div class="icon dripicons dripicons-document-remove"></div>
<input type="text" readonly="readonly" value="document-remove">
</li>
<li>
<div class="icon dripicons dripicons-dot"></div>
<input type="text" readonly="readonly" value="dot">
</li>
<li>
<div class="icon dripicons dripicons-dots-2"></div>
<input type="text" readonly="readonly" value="dots-2">
</li>
<li>
<div class="icon dripicons dripicons-dots-3"></div>
<input type="text" readonly="readonly" value="dots-3">
</li>
<li>
<div class="icon dripicons dripicons-download"></div>
<input type="text" readonly="readonly" value="download">
</li>
<li>
<div class="icon dripicons dripicons-duplicate"></div>
<input type="text" readonly="readonly" value="duplicate">
</li>
<li>
<div class="icon dripicons dripicons-enter"></div>
<input type="text" readonly="readonly" value="enter">
</li>
<li>
<div class="icon dripicons dripicons-exit"></div>
<input type="text" readonly="readonly" value="exit">
</li>
<li>
<div class="icon dripicons dripicons-expand"></div>
<input type="text" readonly="readonly" value="expand">
</li>
<li>
<div class="icon dripicons dripicons-expand-2"></div>
<input type="text" readonly="readonly" value="expand-2">
</li>
<li>
<div class="icon dripicons dripicons-experiment"></div>
<input type="text" readonly="readonly" value="experiment">
</li>
<li>
<div class="icon dripicons dripicons-export"></div>
<input type="text" readonly="readonly" value="export">
</li>
<li>
<div class="icon dripicons dripicons-feed"></div>
<input type="text" readonly="readonly" value="feed">
</li>
<li>
<div class="icon dripicons dripicons-flag"></div>
<input type="text" readonly="readonly" value="flag">
</li>
<li>
<div class="icon dripicons dripicons-flashlight"></div>
<input type="text" readonly="readonly" value="flashlight">
</li>
<li>
<div class="icon dripicons dripicons-folder"></div>
<input type="text" readonly="readonly" value="folder">
</li>
<li>
<div class="icon dripicons dripicons-folder-open"></div>
<input type="text" readonly="readonly" value="folder-open">
</li>
<li>
<div class="icon dripicons dripicons-forward"></div>
<input type="text" readonly="readonly" value="forward">
</li>
<li>
<div class="icon dripicons dripicons-gaming"></div>
<input type="text" readonly="readonly" value="gaming">
</li>
<li>
<div class="icon dripicons dripicons-gear"></div>
<input type="text" readonly="readonly" value="gear">
</li>
<li>
<div class="icon dripicons dripicons-graduation"></div>
<input type="text" readonly="readonly" value="graduation">
</li>
<li>
<div class="icon dripicons dripicons-graph-bar"></div>
<input type="text" readonly="readonly" value="graph-bar">
</li>
<li>
<div class="icon dripicons dripicons-graph-line"></div>
<input type="text" readonly="readonly" value="graph-line">
</li>
<li>
<div class="icon dripicons dripicons-graph-pie"></div>
<input type="text" readonly="readonly" value="graph-pie">
</li>
<li>
<div class="icon dripicons dripicons-headset"></div>
<input type="text" readonly="readonly" value="headset">
</li>
<li>
<div class="icon dripicons dripicons-heart"></div>
<input type="text" readonly="readonly" value="heart">
</li>
<li>
<div class="icon dripicons dripicons-help"></div>
<input type="text" readonly="readonly" value="help">
</li>
<li>
<div class="icon dripicons dripicons-home"></div>
<input type="text" readonly="readonly" value="home">
</li>
<li>
<div class="icon dripicons dripicons-hourglass"></div>
<input type="text" readonly="readonly" value="hourglass">
</li>
<li>
<div class="icon dripicons dripicons-inbox"></div>
<input type="text" readonly="readonly" value="inbox">
</li>
<li>
<div class="icon dripicons dripicons-information"></div>
<input type="text" readonly="readonly" value="information">
</li>
<li>
<div class="icon dripicons dripicons-italic"></div>
<input type="text" readonly="readonly" value="italic">
</li>
<li>
<div class="icon dripicons dripicons-jewel"></div>
<input type="text" readonly="readonly" value="jewel">
</li>
<li>
<div class="icon dripicons dripicons-lifting"></div>
<input type="text" readonly="readonly" value="lifting">
</li>
<li>
<div class="icon dripicons dripicons-lightbulb"></div>
<input type="text" readonly="readonly" value="lightbulb">
</li>
<li>
<div class="icon dripicons dripicons-link"></div>
<input type="text" readonly="readonly" value="link">
</li>
<li>
<div class="icon dripicons dripicons-link-broken"></div>
<input type="text" readonly="readonly" value="link-broken">
</li>
<li>
<div class="icon dripicons dripicons-list"></div>
<input type="text" readonly="readonly" value="list">
</li>
<li>
<div class="icon dripicons dripicons-loading"></div>
<input type="text" readonly="readonly" value="loading">
</li>
<li>
<div class="icon dripicons dripicons-location"></div>
<input type="text" readonly="readonly" value="location">
</li>
<li>
<div class="icon dripicons dripicons-lock"></div>
<input type="text" readonly="readonly" value="lock">
</li>
<li>
<div class="icon dripicons dripicons-lock-open"></div>
<input type="text" readonly="readonly" value="lock-open">
</li>
<li>
<div class="icon dripicons dripicons-mail"></div>
<input type="text" readonly="readonly" value="mail">
</li>
<li>
<div class="icon dripicons dripicons-map"></div>
<input type="text" readonly="readonly" value="map">
</li>
<li>
<div class="icon dripicons dripicons-media-loop"></div>
<input type="text" readonly="readonly" value="media-loop">
</li>
<li>
<div class="icon dripicons dripicons-media-next"></div>
<input type="text" readonly="readonly" value="media-next">
</li>
<li>
<div class="icon dripicons dripicons-media-pause"></div>
<input type="text" readonly="readonly" value="media-pause">
</li>
<li>
<div class="icon dripicons dripicons-media-play"></div>
<input type="text" readonly="readonly" value="media-play">
</li>
<li>
<div class="icon dripicons dripicons-media-previous"></div>
<input type="text" readonly="readonly" value="media-previous">
</li>
<li>
<div class="icon dripicons dripicons-media-record"></div>
<input type="text" readonly="readonly" value="media-record">
</li>
<li>
<div class="icon dripicons dripicons-media-shuffle"></div>
<input type="text" readonly="readonly" value="media-shuffle">
</li>
<li>
<div class="icon dripicons dripicons-media-stop"></div>
<input type="text" readonly="readonly" value="media-stop">
</li>
<li>
<div class="icon dripicons dripicons-medical"></div>
<input type="text" readonly="readonly" value="medical">
</li>
<li>
<div class="icon dripicons dripicons-menu"></div>
<input type="text" readonly="readonly" value="menu">
</li>
<li>
<div class="icon dripicons dripicons-message"></div>
<input type="text" readonly="readonly" value="message">
</li>
<li>
<div class="icon dripicons dripicons-meter"></div>
<input type="text" readonly="readonly" value="meter">
</li>
<li>
<div class="icon dripicons dripicons-microphone"></div>
<input type="text" readonly="readonly" value="microphone">
</li>
<li>
<div class="icon dripicons dripicons-minus"></div>
<input type="text" readonly="readonly" value="minus">
</li>
<li>
<div class="icon dripicons dripicons-monitor"></div>
<input type="text" readonly="readonly" value="monitor">
</li>
<li>
<div class="icon dripicons dripicons-move"></div>
<input type="text" readonly="readonly" value="move">
</li>
<li>
<div class="icon dripicons dripicons-music"></div>
<input type="text" readonly="readonly" value="music">
</li>
<li>
<div class="icon dripicons dripicons-network-1"></div>
<input type="text" readonly="readonly" value="network-1">
</li>
<li>
<div class="icon dripicons dripicons-network-2"></div>
<input type="text" readonly="readonly" value="network-2">
</li>
<li>
<div class="icon dripicons dripicons-network-3"></div>
<input type="text" readonly="readonly" value="network-3">
</li>
<li>
<div class="icon dripicons dripicons-network-4"></div>
<input type="text" readonly="readonly" value="network-4">
</li>
<li>
<div class="icon dripicons dripicons-network-5"></div>
<input type="text" readonly="readonly" value="network-5">
</li>
<li>
<div class="icon dripicons dripicons-pamphlet"></div>
<input type="text" readonly="readonly" value="pamphlet">
</li>
<li>
<div class="icon dripicons dripicons-paperclip"></div>
<input type="text" readonly="readonly" value="paperclip">
</li>
<li>
<div class="icon dripicons dripicons-pencil"></div>
<input type="text" readonly="readonly" value="pencil">
</li>
<li>
<div class="icon dripicons dripicons-phone"></div>
<input type="text" readonly="readonly" value="phone">
</li>
<li>
<div class="icon dripicons dripicons-photo"></div>
<input type="text" readonly="readonly" value="photo">
</li>
<li>
<div class="icon dripicons dripicons-photo-group"></div>
<input type="text" readonly="readonly" value="photo-group">
</li>
<li>
<div class="icon dripicons dripicons-pill"></div>
<input type="text" readonly="readonly" value="pill">
</li>
<li>
<div class="icon dripicons dripicons-pin"></div>
<input type="text" readonly="readonly" value="pin">
</li>
<li>
<div class="icon dripicons dripicons-plus"></div>
<input type="text" readonly="readonly" value="plus">
</li>
<li>
<div class="icon dripicons dripicons-power"></div>
<input type="text" readonly="readonly" value="power">
</li>
<li>
<div class="icon dripicons dripicons-preview"></div>
<input type="text" readonly="readonly" value="preview">
</li>
<li>
<div class="icon dripicons dripicons-print"></div>
<input type="text" readonly="readonly" value="print">
</li>
<li>
<div class="icon dripicons dripicons-pulse"></div>
<input type="text" readonly="readonly" value="pulse">
</li>
<li>
<div class="icon dripicons dripicons-question"></div>
<input type="text" readonly="readonly" value="question">
</li>
<li>
<div class="icon dripicons dripicons-reply"></div>
<input type="text" readonly="readonly" value="reply">
</li>
<li>
<div class="icon dripicons dripicons-reply-all"></div>
<input type="text" readonly="readonly" value="reply-all">
</li>
<li>
<div class="icon dripicons dripicons-return"></div>
<input type="text" readonly="readonly" value="return">
</li>
<li>
<div class="icon dripicons dripicons-retweet"></div>
<input type="text" readonly="readonly" value="retweet">
</li>
<li>
<div class="icon dripicons dripicons-rocket"></div>
<input type="text" readonly="readonly" value="rocket">
</li>
<li>
<div class="icon dripicons dripicons-scale"></div>
<input type="text" readonly="readonly" value="scale">
</li>
<li>
<div class="icon dripicons dripicons-search"></div>
<input type="text" readonly="readonly" value="search">
</li>
<li>
<div class="icon dripicons dripicons-shopping-bag"></div>
<input type="text" readonly="readonly" value="shopping-bag">
</li>
<li>
<div class="icon dripicons dripicons-skip"></div>
<input type="text" readonly="readonly" value="skip">
</li>
<li>
<div class="icon dripicons dripicons-stack"></div>
<input type="text" readonly="readonly" value="stack">
</li>
<li>
<div class="icon dripicons dripicons-star"></div>
<input type="text" readonly="readonly" value="star">
</li>
<li>
<div class="icon dripicons dripicons-stopwatch"></div>
<input type="text" readonly="readonly" value="stopwatch">
</li>
<li>
<div class="icon dripicons dripicons-store"></div>
<input type="text" readonly="readonly" value="store">
</li>
<li>
<div class="icon dripicons dripicons-suitcase"></div>
<input type="text" readonly="readonly" value="suitcase">
</li>
<li>
<div class="icon dripicons dripicons-swap"></div>
<input type="text" readonly="readonly" value="swap">
</li>
<li>
<div class="icon dripicons dripicons-tag"></div>
<input type="text" readonly="readonly" value="tag">
</li>
<li>
<div class="icon dripicons dripicons-tag-delete"></div>
<input type="text" readonly="readonly" value="tag-delete">
</li>
<li>
<div class="icon dripicons dripicons-tags"></div>
<input type="text" readonly="readonly" value="tags">
</li>
<li>
<div class="icon dripicons dripicons-thumbs-down"></div>
<input type="text" readonly="readonly" value="thumbs-down">
</li>
<li>
<div class="icon dripicons dripicons-thumbs-up"></div>
<input type="text" readonly="readonly" value="thumbs-up">
</li>
<li>
<div class="icon dripicons dripicons-ticket"></div>
<input type="text" readonly="readonly" value="ticket">
</li>
<li>
<div class="icon dripicons dripicons-time-reverse"></div>
<input type="text" readonly="readonly" value="time-reverse">
</li>
<li>
<div class="icon dripicons dripicons-to-do"></div>
<input type="text" readonly="readonly" value="to-do">
</li>
<li>
<div class="icon dripicons dripicons-toggles"></div>
<input type="text" readonly="readonly" value="toggles">
</li>
<li>
<div class="icon dripicons dripicons-trash"></div>
<input type="text" readonly="readonly" value="trash">
</li>
<li>
<div class="icon dripicons dripicons-trophy"></div>
<input type="text" readonly="readonly" value="trophy">
</li>
<li>
<div class="icon dripicons dripicons-upload"></div>
<input type="text" readonly="readonly" value="upload">
</li>
<li>
<div class="icon dripicons dripicons-user"></div>
<input type="text" readonly="readonly" value="user">
</li>
<li>
<div class="icon dripicons dripicons-user-group"></div>
<input type="text" readonly="readonly" value="user-group">
</li>
<li>
<div class="icon dripicons dripicons-user-id"></div>
<input type="text" readonly="readonly" value="user-id">
</li>
<li>
<div class="icon dripicons dripicons-vibrate"></div>
<input type="text" readonly="readonly" value="vibrate">
</li>
<li>
<div class="icon dripicons dripicons-view-apps"></div>
<input type="text" readonly="readonly" value="view-apps">
</li>
<li>
<div class="icon dripicons dripicons-view-list"></div>
<input type="text" readonly="readonly" value="view-list">
</li>
<li>
<div class="icon dripicons dripicons-view-list-large"></div>
<input type="text" readonly="readonly" value="view-list-large">
</li>
<li>
<div class="icon dripicons dripicons-view-thumb"></div>
<input type="text" readonly="readonly" value="view-thumb">
</li>
<li>
<div class="icon dripicons dripicons-volume-full"></div>
<input type="text" readonly="readonly" value="volume-full">
</li>
<li>
<div class="icon dripicons dripicons-volume-low"></div>
<input type="text" readonly="readonly" value="volume-low">
</li>
<li>
<div class="icon dripicons dripicons-volume-medium"></div>
<input type="text" readonly="readonly" value="volume-medium">
</li>
<li>
<div class="icon dripicons dripicons-volume-off"></div>
<input type="text" readonly="readonly" value="volume-off">
</li>
<li>
<div class="icon dripicons dripicons-wallet"></div>
<input type="text" readonly="readonly" value="wallet">
</li>
<li>
<div class="icon dripicons dripicons-warning"></div>
<input type="text" readonly="readonly" value="warning">
</li>
<li>
<div class="icon dripicons dripicons-web"></div>
<input type="text" readonly="readonly" value="web">
</li>
<li>
<div class="icon dripicons dripicons-weight"></div>
<input type="text" readonly="readonly" value="weight">
</li>
<li>
<div class="icon dripicons dripicons-wifi"></div>
<input type="text" readonly="readonly" value="wifi">
</li>
<li>
<div class="icon dripicons dripicons-wrong"></div>
<input type="text" readonly="readonly" value="wrong">
</li>
<li>
<div class="icon dripicons dripicons-zoom-in"></div>
<input type="text" readonly="readonly" value="zoom-in">
</li>
<li>
<div class="icon dripicons dripicons-zoom-out"></div>
<input type="text" readonly="readonly" value="zoom-out">
</li>
</ul>
</ul>
</div>
</div>
</section>
</div>
<footer>
<div class="footer clearfix mb-0 text-muted">
<div class="float-start">
<p>2021 &copy; Mazer</p>
</div>
<div class="float-end">
<p>Crafted with <span class="text-danger"><i class="bi bi-heart"></i></span> by <a
href="https://saugi.me">Saugi</a></p>
</div>
</div>
</footer>
</div>
</div>
<script src="assets/js/app.js"></script>
</body>
</html>
public/dashboard/ui-icons-fontawesome.html 0 → 100644
View file @ 4c981655
This source diff could not be displayed because it is too large. You can view the blob instead.
public/dashboard/ui-map-google-map.html 0 → 100644
View file @ 4c981655
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Google Map - Mazer Admin Dashboard</title>
<link rel="stylesheet" href="assets/css/main/app.css">
<link rel="stylesheet" href="assets/css/main/app-dark.css">
<link rel="shortcut icon" href="assets/images/logo/favicon.svg" type="image/x-icon">
<link rel="shortcut icon" href="assets/images/logo/favicon.png" type="image/png">
</head>
<body>
<div id="app">
<div id="sidebar" class="active">
<div class="sidebar-wrapper active">
<div class="sidebar-header position-relative">
<div class="d-flex justify-content-between align-items-center">
<div class="logo">
<a href="index.html"><img src="assets/images/logo/logo.svg" alt="Logo" srcset=""></a>
</div>
<div class="theme-toggle d-flex gap-2 align-items-center mt-2">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--system-uicons" width="20" height="20" preserveAspectRatio="xMidYMid meet" viewBox="0 0 21 21"><g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"><path d="M10.5 14.5c2.219 0 4-1.763 4-3.982a4.003 4.003 0 0 0-4-4.018c-2.219 0-4 1.781-4 4c0 2.219 1.781 4 4 4zM4.136 4.136L5.55 5.55m9.9 9.9l1.414 1.414M1.5 10.5h2m14 0h2M4.135 16.863L5.55 15.45m9.899-9.9l1.414-1.415M10.5 19.5v-2m0-14v-2" opacity=".3"></path><g transform="translate(-210 -1)"><path d="M220.5 2.5v2m6.5.5l-1.5 1.5"></path><circle cx="220.5" cy="11.5" r="4"></circle><path d="m214 5l1.5 1.5m5 14v-2m6.5-.5l-1.5-1.5M214 18l1.5-1.5m-4-5h2m14 0h2"></path></g></g></svg>
<div class="form-check form-switch fs-6">
<input class="form-check-input me-0" type="checkbox" id="toggle-dark" >
<label class="form-check-label" ></label>
</div>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--mdi" width="20" height="20" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path fill="currentColor" d="m17.75 4.09l-2.53 1.94l.91 3.06l-2.63-1.81l-2.63 1.81l.91-3.06l-2.53-1.94L12.44 4l1.06-3l1.06 3l3.19.09m3.5 6.91l-1.64 1.25l.59 1.98l-1.7-1.17l-1.7 1.17l.59-1.98L15.75 11l2.06-.05L18.5 9l.69 1.95l2.06.05m-2.28 4.95c.83-.08 1.72 1.1 1.19 1.85c-.32.45-.66.87-1.08 1.27C15.17 23 8.84 23 4.94 19.07c-3.91-3.9-3.91-10.24 0-14.14c.4-.4.82-.76 1.27-1.08c.75-.53 1.93.36 1.85 1.19c-.27 2.86.69 5.83 2.89 8.02a9.96 9.96 0 0 0 8.02 2.89m-1.64 2.02a12.08 12.08 0 0 1-7.8-3.47c-2.17-2.19-3.33-5-3.49-7.82c-2.81 3.14-2.7 7.96.31 10.98c3.02 3.01 7.84 3.12 10.98.31Z"></path></svg>
</div>
<div class="sidebar-toggler x">
<a href="#" class="sidebar-hide d-xl-none d-block"><i class="bi bi-x bi-middle"></i></a>
</div>
</div>
</div>
<div class="sidebar-menu">
<ul class="menu">
<li class="sidebar-title">Menu</li>
<li
class="sidebar-item ">
<a href="index.html" class='sidebar-link'>
<i class="bi bi-grid-fill"></i>
<span>Dashboard</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-stack"></i>
<span>Components</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="component-alert.html">Alert</a>
</li>
<li class="submenu-item ">
<a href="component-badge.html">Badge</a>
</li>
<li class="submenu-item ">
<a href="component-breadcrumb.html">Breadcrumb</a>
</li>
<li class="submenu-item ">
<a href="component-button.html">Button</a>
</li>
<li class="submenu-item ">
<a href="component-card.html">Card</a>
</li>
<li class="submenu-item ">
<a href="component-carousel.html">Carousel</a>
</li>
<li class="submenu-item ">
<a href="component-collapse.html">Collapse</a>
</li>
<li class="submenu-item ">
<a href="component-dropdown.html">Dropdown</a>
</li>
<li class="submenu-item ">
<a href="component-list-group.html">List Group</a>
</li>
<li class="submenu-item ">
<a href="component-modal.html">Modal</a>
</li>
<li class="submenu-item ">
<a href="component-navs.html">Navs</a>
</li>
<li class="submenu-item ">
<a href="component-pagination.html">Pagination</a>
</li>
<li class="submenu-item ">
<a href="component-progress.html">Progress</a>
</li>
<li class="submenu-item ">
<a href="component-spinner.html">Spinner</a>
</li>
<li class="submenu-item ">
<a href="component-tooltip.html">Tooltip</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-collection-fill"></i>
<span>Extra Components</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="extra-component-avatar.html">Avatar</a>
</li>
<li class="submenu-item ">
<a href="extra-component-sweetalert.html">Sweet Alert</a>
</li>
<li class="submenu-item ">
<a href="extra-component-toastify.html">Toastify</a>
</li>
<li class="submenu-item ">
<a href="extra-component-rating.html">Rating</a>
</li>
<li class="submenu-item ">
<a href="extra-component-divider.html">Divider</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-grid-1x2-fill"></i>
<span>Layouts</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="layout-default.html">Default Layout</a>
</li>
<li class="submenu-item ">
<a href="layout-vertical-1-column.html">1 Column</a>
</li>
<li class="submenu-item ">
<a href="layout-vertical-navbar.html">Vertical Navbar</a>
</li>
<li class="submenu-item ">
<a href="layout-rtl.html">RTL Layout</a>
</li>
<li class="submenu-item ">
<a href="layout-horizontal.html">Horizontal Menu</a>
</li>
</ul>
</li>
<li class="sidebar-title">Forms &amp; Tables</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-hexagon-fill"></i>
<span>Form Elements</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="form-element-input.html">Input</a>
</li>
<li class="submenu-item ">
<a href="form-element-input-group.html">Input Group</a>
</li>
<li class="submenu-item ">
<a href="form-element-select.html">Select</a>
</li>
<li class="submenu-item ">
<a href="form-element-radio.html">Radio</a>
</li>
<li class="submenu-item ">
<a href="form-element-checkbox.html">Checkbox</a>
</li>
<li class="submenu-item ">
<a href="form-element-textarea.html">Textarea</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="form-layout.html" class='sidebar-link'>
<i class="bi bi-file-earmark-medical-fill"></i>
<span>Form Layout</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-pen-fill"></i>
<span>Form Editor</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="form-editor-quill.html">Quill</a>
</li>
<li class="submenu-item ">
<a href="form-editor-ckeditor.html">CKEditor</a>
</li>
<li class="submenu-item ">
<a href="form-editor-summernote.html">Summernote</a>
</li>
<li class="submenu-item ">
<a href="form-editor-tinymce.html">TinyMCE</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="table.html" class='sidebar-link'>
<i class="bi bi-grid-1x2-fill"></i>
<span>Table</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-file-earmark-spreadsheet-fill"></i>
<span>Datatables</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="table-datatable.html">Datatable</a>
</li>
<li class="submenu-item ">
<a href="table-datatable-jquery.html">Datatable (jQuery)</a>
</li>
</ul>
</li>
<li class="sidebar-title">Extra UI</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-pentagon-fill"></i>
<span>Widgets</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-widgets-chatbox.html">Chatbox</a>
</li>
<li class="submenu-item ">
<a href="ui-widgets-pricing.html">Pricing</a>
</li>
<li class="submenu-item ">
<a href="ui-widgets-todolist.html">To-do List</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-egg-fill"></i>
<span>Icons</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-icons-bootstrap-icons.html">Bootstrap Icons </a>
</li>
<li class="submenu-item ">
<a href="ui-icons-fontawesome.html">Fontawesome</a>
</li>
<li class="submenu-item ">
<a href="ui-icons-dripicons.html">Dripicons</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-bar-chart-fill"></i>
<span>Charts</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-chart-chartjs.html">ChartJS</a>
</li>
<li class="submenu-item ">
<a href="ui-chart-apexcharts.html">Apexcharts</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="ui-file-uploader.html" class='sidebar-link'>
<i class="bi bi-cloud-arrow-up-fill"></i>
<span>File Uploader</span>
</a>
</li>
<li
class="sidebar-item active has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-map-fill"></i>
<span>Maps</span>
</a>
<ul class="submenu active">
<li class="submenu-item active">
<a href="ui-map-google-map.html">Google Map</a>
</li>
<li class="submenu-item ">
<a href="ui-map-jsvectormap.html">JS Vector Map</a>
</li>
</ul>
</li>
<li class="sidebar-title">Pages</li>
<li
class="sidebar-item ">
<a href="application-email.html" class='sidebar-link'>
<i class="bi bi-envelope-fill"></i>
<span>Email Application</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-chat.html" class='sidebar-link'>
<i class="bi bi-chat-dots-fill"></i>
<span>Chat Application</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-gallery.html" class='sidebar-link'>
<i class="bi bi-image-fill"></i>
<span>Photo Gallery</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-checkout.html" class='sidebar-link'>
<i class="bi bi-basket-fill"></i>
<span>Checkout Page</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-person-badge-fill"></i>
<span>Authentication</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="auth-login.html">Login</a>
</li>
<li class="submenu-item ">
<a href="auth-register.html">Register</a>
</li>
<li class="submenu-item ">
<a href="auth-forgot-password.html">Forgot Password</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-x-octagon-fill"></i>
<span>Errors</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="error-403.html">403</a>
</li>
<li class="submenu-item ">
<a href="error-404.html">404</a>
</li>
<li class="submenu-item ">
<a href="error-500.html">500</a>
</li>
</ul>
</li>
<li class="sidebar-title">Raise Support</li>
<li
class="sidebar-item ">
<a href="https://zuramai.github.io/mazer/docs" class='sidebar-link'>
<i class="bi bi-life-preserver"></i>
<span>Documentation</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="https://github.com/zuramai/mazer/blob/main/CONTRIBUTING.md" class='sidebar-link'>
<i class="bi bi-puzzle"></i>
<span>Contribute</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="https://github.com/zuramai/mazer#donation" class='sidebar-link'>
<i class="bi bi-cash"></i>
<span>Donate</span>
</a>
</li>
</ul>
</div>
</div>
</div>
<div id="main">
<header class="mb-3">
<a href="#" class="burger-btn d-block d-xl-none">
<i class="bi bi-justify fs-3"></i>
</a>
</header>
<div class="page-heading">
<div class="page-title">
<div class="row">
<div class="col-12 col-md-6 order-md-1 order-last">
<h3>Google Map</h3>
<p class="text-subtitle text-muted">Help users find your address</p>
</div>
<div class="col-12 col-md-6 order-md-2 order-first">
<nav aria-label="breadcrumb" class="breadcrumb-header float-start float-lg-end">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="index.html">Dashboard</a></li>
<li class="breadcrumb-item active" aria-current="page">Google Map</li>
</ol>
</nav>
</div>
</div>
</div>
<section class="section">
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-header">
<h5 class="card-title">Our Location</h5>
</div>
<div class="card-body">
<div class="googlemaps">
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d126748.6091242787!2d107.57311654129782!3d-6.903273917028756!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x2e68e6398252477f%3A0x146a1f93d3e815b2!2sBandung%2C%20Bandung%20City%2C%20West%20Java!5e0!3m2!1sen!2sid!4v1633023222539!5m2!1sen!2sid" width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy"></iframe>
</div>
</div>
</div>
</div>
</div>
</section>
</div>
<footer>
<div class="footer clearfix mb-0 text-muted">
<div class="float-start">
<p>2021 &copy; Mazer</p>
</div>
<div class="float-end">
<p>Crafted with <span class="text-danger"><i class="bi bi-heart"></i></span> by <a
href="https://saugi.me">Saugi</a></p>
</div>
</div>
</footer>
</div>
</div>
<script src="assets/js/app.js"></script>
</body>
</html>
public/dashboard/ui-map-jsvectormap.html 0 → 100644
View file @ 4c981655
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>JS Vector Map - Mazer Admin Dashboard</title>
<link rel="stylesheet" href="assets/css/main/app.css">
<link rel="stylesheet" href="assets/css/main/app-dark.css">
<link rel="shortcut icon" href="assets/images/logo/favicon.svg" type="image/x-icon">
<link rel="shortcut icon" href="assets/images/logo/favicon.png" type="image/png">
</head>
<body>
<div id="app">
<div id="sidebar" class="active">
<div class="sidebar-wrapper active">
<div class="sidebar-header position-relative">
<div class="d-flex justify-content-between align-items-center">
<div class="logo">
<a href="index.html"><img src="assets/images/logo/logo.svg" alt="Logo" srcset=""></a>
</div>
<div class="theme-toggle d-flex gap-2 align-items-center mt-2">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--system-uicons" width="20" height="20" preserveAspectRatio="xMidYMid meet" viewBox="0 0 21 21"><g fill="none" fill-rule="evenodd" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"><path d="M10.5 14.5c2.219 0 4-1.763 4-3.982a4.003 4.003 0 0 0-4-4.018c-2.219 0-4 1.781-4 4c0 2.219 1.781 4 4 4zM4.136 4.136L5.55 5.55m9.9 9.9l1.414 1.414M1.5 10.5h2m14 0h2M4.135 16.863L5.55 15.45m9.899-9.9l1.414-1.415M10.5 19.5v-2m0-14v-2" opacity=".3"></path><g transform="translate(-210 -1)"><path d="M220.5 2.5v2m6.5.5l-1.5 1.5"></path><circle cx="220.5" cy="11.5" r="4"></circle><path d="m214 5l1.5 1.5m5 14v-2m6.5-.5l-1.5-1.5M214 18l1.5-1.5m-4-5h2m14 0h2"></path></g></g></svg>
<div class="form-check form-switch fs-6">
<input class="form-check-input me-0" type="checkbox" id="toggle-dark" >
<label class="form-check-label" ></label>
</div>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--mdi" width="20" height="20" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path fill="currentColor" d="m17.75 4.09l-2.53 1.94l.91 3.06l-2.63-1.81l-2.63 1.81l.91-3.06l-2.53-1.94L12.44 4l1.06-3l1.06 3l3.19.09m3.5 6.91l-1.64 1.25l.59 1.98l-1.7-1.17l-1.7 1.17l.59-1.98L15.75 11l2.06-.05L18.5 9l.69 1.95l2.06.05m-2.28 4.95c.83-.08 1.72 1.1 1.19 1.85c-.32.45-.66.87-1.08 1.27C15.17 23 8.84 23 4.94 19.07c-3.91-3.9-3.91-10.24 0-14.14c.4-.4.82-.76 1.27-1.08c.75-.53 1.93.36 1.85 1.19c-.27 2.86.69 5.83 2.89 8.02a9.96 9.96 0 0 0 8.02 2.89m-1.64 2.02a12.08 12.08 0 0 1-7.8-3.47c-2.17-2.19-3.33-5-3.49-7.82c-2.81 3.14-2.7 7.96.31 10.98c3.02 3.01 7.84 3.12 10.98.31Z"></path></svg>
</div>
<div class="sidebar-toggler x">
<a href="#" class="sidebar-hide d-xl-none d-block"><i class="bi bi-x bi-middle"></i></a>
</div>
</div>
</div>
<div class="sidebar-menu">
<ul class="menu">
<li class="sidebar-title">Menu</li>
<li
class="sidebar-item ">
<a href="index.html" class='sidebar-link'>
<i class="bi bi-grid-fill"></i>
<span>Dashboard</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-stack"></i>
<span>Components</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="component-alert.html">Alert</a>
</li>
<li class="submenu-item ">
<a href="component-badge.html">Badge</a>
</li>
<li class="submenu-item ">
<a href="component-breadcrumb.html">Breadcrumb</a>
</li>
<li class="submenu-item ">
<a href="component-button.html">Button</a>
</li>
<li class="submenu-item ">
<a href="component-card.html">Card</a>
</li>
<li class="submenu-item ">
<a href="component-carousel.html">Carousel</a>
</li>
<li class="submenu-item ">
<a href="component-collapse.html">Collapse</a>
</li>
<li class="submenu-item ">
<a href="component-dropdown.html">Dropdown</a>
</li>
<li class="submenu-item ">
<a href="component-list-group.html">List Group</a>
</li>
<li class="submenu-item ">
<a href="component-modal.html">Modal</a>
</li>
<li class="submenu-item ">
<a href="component-navs.html">Navs</a>
</li>
<li class="submenu-item ">
<a href="component-pagination.html">Pagination</a>
</li>
<li class="submenu-item ">
<a href="component-progress.html">Progress</a>
</li>
<li class="submenu-item ">
<a href="component-spinner.html">Spinner</a>
</li>
<li class="submenu-item ">
<a href="component-tooltip.html">Tooltip</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-collection-fill"></i>
<span>Extra Components</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="extra-component-avatar.html">Avatar</a>
</li>
<li class="submenu-item ">
<a href="extra-component-sweetalert.html">Sweet Alert</a>
</li>
<li class="submenu-item ">
<a href="extra-component-toastify.html">Toastify</a>
</li>
<li class="submenu-item ">
<a href="extra-component-rating.html">Rating</a>
</li>
<li class="submenu-item ">
<a href="extra-component-divider.html">Divider</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-grid-1x2-fill"></i>
<span>Layouts</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="layout-default.html">Default Layout</a>
</li>
<li class="submenu-item ">
<a href="layout-vertical-1-column.html">1 Column</a>
</li>
<li class="submenu-item ">
<a href="layout-vertical-navbar.html">Vertical Navbar</a>
</li>
<li class="submenu-item ">
<a href="layout-rtl.html">RTL Layout</a>
</li>
<li class="submenu-item ">
<a href="layout-horizontal.html">Horizontal Menu</a>
</li>
</ul>
</li>
<li class="sidebar-title">Forms &amp; Tables</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-hexagon-fill"></i>
<span>Form Elements</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="form-element-input.html">Input</a>
</li>
<li class="submenu-item ">
<a href="form-element-input-group.html">Input Group</a>
</li>
<li class="submenu-item ">
<a href="form-element-select.html">Select</a>
</li>
<li class="submenu-item ">
<a href="form-element-radio.html">Radio</a>
</li>
<li class="submenu-item ">
<a href="form-element-checkbox.html">Checkbox</a>
</li>
<li class="submenu-item ">
<a href="form-element-textarea.html">Textarea</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="form-layout.html" class='sidebar-link'>
<i class="bi bi-file-earmark-medical-fill"></i>
<span>Form Layout</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-pen-fill"></i>
<span>Form Editor</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="form-editor-quill.html">Quill</a>
</li>
<li class="submenu-item ">
<a href="form-editor-ckeditor.html">CKEditor</a>
</li>
<li class="submenu-item ">
<a href="form-editor-summernote.html">Summernote</a>
</li>
<li class="submenu-item ">
<a href="form-editor-tinymce.html">TinyMCE</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="table.html" class='sidebar-link'>
<i class="bi bi-grid-1x2-fill"></i>
<span>Table</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-file-earmark-spreadsheet-fill"></i>
<span>Datatables</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="table-datatable.html">Datatable</a>
</li>
<li class="submenu-item ">
<a href="table-datatable-jquery.html">Datatable (jQuery)</a>
</li>
</ul>
</li>
<li class="sidebar-title">Extra UI</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-pentagon-fill"></i>
<span>Widgets</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-widgets-chatbox.html">Chatbox</a>
</li>
<li class="submenu-item ">
<a href="ui-widgets-pricing.html">Pricing</a>
</li>
<li class="submenu-item ">
<a href="ui-widgets-todolist.html">To-do List</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-egg-fill"></i>
<span>Icons</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-icons-bootstrap-icons.html">Bootstrap Icons </a>
</li>
<li class="submenu-item ">
<a href="ui-icons-fontawesome.html">Fontawesome</a>
</li>
<li class="submenu-item ">
<a href="ui-icons-dripicons.html">Dripicons</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-bar-chart-fill"></i>
<span>Charts</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="ui-chart-chartjs.html">ChartJS</a>
</li>
<li class="submenu-item ">
<a href="ui-chart-apexcharts.html">Apexcharts</a>
</li>
</ul>
</li>
<li
class="sidebar-item ">
<a href="ui-file-uploader.html" class='sidebar-link'>
<i class="bi bi-cloud-arrow-up-fill"></i>
<span>File Uploader</span>
</a>
</li>
<li
class="sidebar-item active has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-map-fill"></i>
<span>Maps</span>
</a>
<ul class="submenu active">
<li class="submenu-item ">
<a href="ui-map-google-map.html">Google Map</a>
</li>
<li class="submenu-item active">
<a href="ui-map-jsvectormap.html">JS Vector Map</a>
</li>
</ul>
</li>
<li class="sidebar-title">Pages</li>
<li
class="sidebar-item ">
<a href="application-email.html" class='sidebar-link'>
<i class="bi bi-envelope-fill"></i>
<span>Email Application</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-chat.html" class='sidebar-link'>
<i class="bi bi-chat-dots-fill"></i>
<span>Chat Application</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-gallery.html" class='sidebar-link'>
<i class="bi bi-image-fill"></i>
<span>Photo Gallery</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="application-checkout.html" class='sidebar-link'>
<i class="bi bi-basket-fill"></i>
<span>Checkout Page</span>
</a>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-person-badge-fill"></i>
<span>Authentication</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="auth-login.html">Login</a>
</li>
<li class="submenu-item ">
<a href="auth-register.html">Register</a>
</li>
<li class="submenu-item ">
<a href="auth-forgot-password.html">Forgot Password</a>
</li>
</ul>
</li>
<li
class="sidebar-item has-sub">
<a href="#" class='sidebar-link'>
<i class="bi bi-x-octagon-fill"></i>
<span>Errors</span>
</a>
<ul class="submenu ">
<li class="submenu-item ">
<a href="error-403.html">403</a>
</li>
<li class="submenu-item ">
<a href="error-404.html">404</a>
</li>
<li class="submenu-item ">
<a href="error-500.html">500</a>
</li>
</ul>
</li>
<li class="sidebar-title">Raise Support</li>
<li
class="sidebar-item ">
<a href="https://zuramai.github.io/mazer/docs" class='sidebar-link'>
<i class="bi bi-life-preserver"></i>
<span>Documentation</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="https://github.com/zuramai/mazer/blob/main/CONTRIBUTING.md" class='sidebar-link'>
<i class="bi bi-puzzle"></i>
<span>Contribute</span>
</a>
</li>
<li
class="sidebar-item ">
<a href="https://github.com/zuramai/mazer#donation" class='sidebar-link'>
<i class="bi bi-cash"></i>
<span>Donate</span>
</a>
</li>
</ul>
</div>
</div>
</div>
<div id="main">
<header class="mb-3">
<a href="#" class="burger-btn d-block d-xl-none">
<i class="bi bi-justify fs-3"></i>
</a>
</header>
<div class="page-heading">
<div class="page-title">
<div class="row">
<div class="col-12 col-md-6 order-md-1 order-last">
<h3>JS Vector Map</h3>
<p class="text-subtitle text-muted">A google maps alternative </p>
</div>
<div class="col-12 col-md-6 order-md-2 order-first">
<nav aria-label="breadcrumb" class="breadcrumb-header float-start float-lg-end">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="index.html">Dashboard</a></li>
<li class="breadcrumb-item active" aria-current="page">JS Vector Map</li>
</ol>
</nav>
</div>
</div>
</div>
<section class="section">
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-header">
<h5 class="card-title">Coming Soon!</h5>
</div>
<div class="card-body">
If you want to contribute, check out our <a href="https://github.com/zuramai/mazer"
target="_blank">template repository</a>.
</div>
</div>
</div>
</div>
</section>
</div>
<footer>
<div class="footer clearfix mb-0 text-muted">
<div class="float-start">
<p>2021 &copy; Mazer</p>
</div>
<div class="float-end">
<p>Crafted with <span class="text-danger"><i class="bi bi-heart"></i></span> by <a
href="https://saugi.me">Saugi</a></p>
</div>
</div>
</footer>
</div>
</div>
<script src="assets/js/app.js"></script>
</body>
</html>
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment

Dies ist die Gitlab-Instanz des Transferportals der Hochschule für Technik Stuttgart. Hier geht es zurück zum Portal