Dmeki is a responsive HTML 5 Tailwind Based admin dashboard template. This Admin dashboard template is comfortable with all devices & all browser like mobile, laptop, tablet , desktop , Mozilla Firefox , chrome , opera, safari.
Everyone who is working as a developer and looking for an admin template for quick and easy custom developer-friendly HTML based template, with all type of useful features, and easily customizable no further than Dmeki. We’ve considered the highest industrial standards and quality to bring them the very best admin template that is not only fast and easy to use but quickly expandable. They'll be able to build their own customizable application according their requirement with very less effort.
Dmeki is built with CSS3, Tailwind, HTML5, Latest JQuery, SCSS, Variable so developers can easily customize and develop Dashboard Template. The most important thing is that it is 100% W3C Validated , structured code completely well commented code.
Gulp is a cross-platform, streaming task runner that lets developers automate many development tasks. At a high level, gulp reads files as streams and pipes the streams to different tasks. These tasks are code-based and use plugins. The tasks modify the files, building source files into production files.Gulp js is a toolkit that helps you automate time consuming tasks in your workflow.
for about more details in gulp plugin use this link https://gulpjs.com/plugins
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="keywords" content="">
<meta name="description" content="Dmeki - Admin Dashboard Html 5 Tailwind Responsive Template">
<title> Dmeki | Home </title>
<!-- favicon-->
<link rel="shortcut icon" type="image/png" href="../assets/images/logo/icon-logo.webp">
<!-- google fonts-->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="">
<link href="https://fonts.googleapis.com/css2?family=Rajdhani:wght@300;400;500;600;700&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">
<!-- font awesome css-->
<link rel="stylesheet" type="text/css" href="../assets/css/vendor/font-awesome.css">
<link rel="stylesheet" type="text/css" href="../assets/css/vendor/themify-icons.css">
<!-- animate css-->
<link rel="stylesheet" type="text/css" href="../assets/css/vendor/animate.css">
<!-- magnific popup css-->
<link rel="stylesheet" type="text/css" href="../assets/css/vendor/magnific-popup.css">
<!-- simplebar css-->
<link rel="stylesheet" type="text/css" href="../assets/css/vendor/simplebar.css">
<!-- fancybox css-->
<link rel="stylesheet" type="text/css" href="../assets/css/vendor/fancybox.css">
<!-- nice select css-->
<link rel="stylesheet" type="text/css" href="../assets/css/vendor/nice-select.css">
<!-- sal css-->
<link rel="stylesheet" type="text/css" href="../assets/css/vendor/sal.css">
<!-- swiper css-->
<link rel="stylesheet" type="text/css" href="../assets/css/vendor/swiper-bundle.min.css">
<!-- tailwindcss css -->
<!-- main css-->
<link rel="stylesheet" type="text/css" href="../assets/css/style.css">
</head>
<body>
<!-- loader start-->
<div class="codex-loader"></div>
<!-- loader end-->
<!-- header start-->
<div class="top-header"></div>
<header></header>
<div class="search-bar"></div>
<!-- header end-->
<!-- hero intro start-->
<section class="hero-intro"></section>
<!-- hero intro end-->
<!-- category start-->
<section class="category space-py-100"></section>
<!-- category end-->
<!-- course start-->
<section class="bg-light space-py-100"></section>
<!-- course end-->
<!-- discount banner start-->
<section class="discount-upcoming cdx-overlay space-py-100"></section>
<!-- discount banner end-->
<!-- testimonial start-->
<section class="space-py-100">
</section>
<!-- testimonial end-->
<!-- subscrib start-->
<section class="newsletter-subscribe"></section>
<!-- subscrib end-->
<!-- why choose start-->
<section class="why-choose space-py-100"></section>
<!-- why choose end -->
<!-- team start-->
<section class="space-py-100 bg-light"></section>
<!-- team end-->
<!-- blog start-->
<section class="space-py-100"></section>
<!-- blog end-->
<!-- footer start -->
<footer class="space-py-100">
<!-- Tap To Top Start-->
<a class="scroll-top" href="Javascript:void(0)"><i class="fa fa-angle-double-up"></i></a>
<!-- Tap To Top End-->
</footer>
<div class="subfooter"></div>
<!-- footer end-->
<!-- chat bar start-->
<div class="livechat-bar"></div>
<!-- chat bar end-->
<!-- jQuery js-->
<script src="../assets/js/jquery-3.6.0.min.js"></script>
<!-- feather icon-->
<script src="../assets/js/feather.min.js"></script>
<!-- swiper js-->
<script src="../assets/js/swiper-bundle.min.js"></script>
<script src="../assets/js/swiper-custom.js"></script>
<!-- magnific popup js-->
<script src="../assets/js/magnific-popup.min.js"></script>
<!-- modernizr js-->
<script src="../assets/js/modernizr.min.js"></script>
<!-- nice select js-->
<script src="../assets/js/jquery.nice-select.min.js"></script>
<!-- custom scrollbar-->
<script src="../assets/js/simplebar.js"></script>
<!-- custom scrollbar-->
<script src="../assets/js/sal.js"></script>
<!-- fancybox js-->
<script src="../assets/js/fancybox.js"></script>
<!-- chat js-->
<script src="../assets/js/chat.js"></script>
<!-- timer js-->
<script src="../assets/js/countdown.js"></script>
<!-- custom script js-->
<script src="../assets/js/script.js"></script>
</body>
</html>
* {
margin: 0;
padding: 0;
}
body {
font-family: "Rajdhani", sans-serif;
font-weight: 500;
color: #181e43;
font-size: 14px;
}
ul {
margin: 0;
padding: 0;
}
li {
list-style: none;
}
a,
button {
transition: all 0.3s ease;
}
button {
cursor: pointer;
}
button:focus {
outline: 0;
}
a {
color: #181e43;
text-decoration: none;
outline: none;
}
a:visited, a:focus, a:active, a:hover {
text-decoration: none;
outline: none;
color: #181e43;
}
h1, h2, h3, h4, h5, h6, p {
margin-bottom: 0;
}
h1 {
font-size: 70px;
}
h2 {
font-size: 45px;
}
h3 {
font-size: 24px;
}
h4 {
font-size: 22px;
}
h5 {
font-size: 18px;
}
h6 {
font-size: 16px;
}
p {
font-size: calc(16px + 2 * (100vw - 420px) / 1500);
font-weight: 400;
color: #99a4b1;
font-family: "Rubik", sans-serif;
}
.img-fluid {
width: 100%;
}
img {
display: inline-block;
}
svg {
display: inline-block;
}
h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1 {
line-height: 1.2;
}
//*** Loader Show
$(window).on('load', function() {
$(".codex-loader").fadeOut("slow");
});
$(document).ready(function() {
//*** sticky header
$(window).scroll(function() {
if($(this).scrollTop() > 50){
$('header').addClass("sticky");
$('header.land-header').removeClass("fixed");
} else {
$('header').removeClass("sticky");
$('header.land-header').addClass("fixed");
}
});
});