Free Vanilla JavaScript Bootstrap 5 Admin and Dashboard Template that comes with all essential dashboard components, elements, charts, graph and application pages.

Home Page: https://plainadmin.com/

License: MIT License

HTML 77.36% CSS 13.41% JavaScript 1.10% SCSS 8.13%

bootstrap admin-dashboard admin-template free dashboard html-admin backend bootstrap5 charts graphs

plain-free-bootstrap-admin-template's Introduction

PlainAdmin - Free Vanilla JS Bootstrap 5 Admin Dashboard Template

PlainAdmin is a free and open-source Vanilla JS admin dashboard template based on Bootstrap 5 that comes with 5 unique dashboard variations, 300+ essential dashboard components, pages, UI elements, charts, graphs, application UI pages, and more. to provide everything you need to build a data-rich backend or admin panel for almost any sort of web app.

🚀 View Demo

✨ Visit Website

⬇️ Download Now

📄 Documentation/Installation

⚡ PRO Version

It comes with a minimal UI design that suits almost any kind of web project and offers the best possible user experience. PlainAdmin comes with SCSS files, an organized codebase, gulp support for efficient workflow, rich documentation, and everything else that you can expect from a modern admin template.

PlainAdmin is built with vanilla Javascript (no jQuery), Bootstrap 5 and the simplest possible way to make it easy to maintain and easy to port your back-end projects.

👉 Check out our Admin Template for Tailwind CSS

If you are looking for a high-quality free admin template that comes with all essential dashboard components and features then, PlainAdmin is the perfect choice for you.

📄 Documentation

Update Logs - 2.0 :

Rebranded the entire template.
Updated the style guide
The sidebar menu icons have been updated.
The overall design of the sidebar has been enhanced.
The header menu icons have been updated.
The design of the header dropdown has been updated.
Additional buttons have been added to the Button Page.
Updated essential dependencies
The charts code has been adjusted to accommodate the updated version.
UX and UI enhancements

Update Logs - 1.2 :

Added Kanban (App) [PRO]
Added File Manager (App) [PRO]
Dependencies updated
FullCalender updated

Update Logs - 1.1.2 :

FullCalender updated
Dependencies updates

Update Logs - 1.1.1 :

Updated to v5.1.3 (Latest)
Fixed minor bugs
Changed primary color
Multiple sidebar variations
Improved UX
Optimized codebase

Update Logs - 1.1 :

Updated to Bootstrap 5.1.1
Fixed minor bugs
Enhanced the UI and Improved Typography

plain-free-bootstrap-admin-template's People

Contributors

Stargazers

Watchers

plain-free-bootstrap-admin-template's Issues

Upgrade datatables package

PlainAdmin (Pro version) uses Vanilla Datatables, which is deprecated. Please consider upgrading to https://github.com/fiduswriter/Simple-DataTables!

lineicons.css incorrect file references

Currently the font files are being referenced in lowercase:

@font-face {
  font-family: 'lineicons';
  src: url('../fonts/lineicons.eot');
  src: url('../fonts/lineicons.eot') format('embedded-opentype'),
       url('../fonts/lineicons.woff2') format('woff2'),
       url('../fonts/lineicons.woff') format('woff'),
       url('../fonts/lineicons.ttf') format('truetype'),
       url('../fonts/lineicons.svg') format('svg');
}

When it should be:

@font-face {
  font-family: 'lineicons';
  src: url('../fonts/LineIcons.eot');
  src: url('../fonts/LineIcons.eot') format('embedded-opentype'),
       url('../fonts/LineIcons.woff2') format('woff2'),
       url('../fonts/LineIcons.woff') format('woff'),
       url('../fonts/LineIcons.ttf') format('truetype'),
       url('../fonts/LineIcons.svg') format('svg');
}

This causes a 404 error when trying to fetch the font files from a web server.

SVG icons on menu

First, fantastic template.

On menu there are icons in SVG that doesn't included both from Lineicons or MDI. Is there a template to create the SVG or the icons created online?

Docs page 404 error

Hey. Something wrong with docs

Active for slidebar

Help me set active for slidebar using jquery:

$(function () {
  var url = window.location.href;
  $(".sidebar-nav a").each(function () {
    if (url === this.href) {
      console.log(url);
      console.log(this.href);
      $(this).addClass("active");
      $(this).closest(".nav-item.nav-item-has-children").find("a[data-bs-toggle='collapse']").removeClass("collapsed");
      $(this).closest(".nav-item.nav-item-has-children").find(".collapse.dropdown-nav").addClass("show").attr("aria-expanded", "true");
      $(this).closest(".nav-item.nav-item-has-children").find(".collapse.dropdown-nav li a").addClass("active");
    } else {
      $(this).removeClass("active");
      $(this).closest(".nav-item.nav-item-has-children").find("a[data-bs-toggle='collapse']").addClass("collapsed");
      $(this).closest(".nav-item.nav-item-has-children").find(".collapse.dropdown-nav li a").removeClass("active");
    }
  });
  $(".nav-item").each(function () {
    if ($(this).find("a.active").length > 0) {
      $(this).addClass("active");
    } else {
      $(this).removeClass("active");
    }
  });
});

lineicons.css stylesheet

Hi,

Seems that there is an issue with the stylesheet assets/css/LineIcons.css on index.html while the file is named lineicons.css in that folder :
<link rel="stylesheet" href="assets/css/LineIcons.css" />

plainadmin / plain-free-bootstrap-admin-template Goto Github PK