If you have any questions that are beyond the scope of this documentation, please feel free to email or contact us via my page.

SimpleAdmin is a bootstrap based premium admin template. It has super clean user interface, customizable components and widgets and three different color schemes. It is fully responsive and easy to customize. The code is super easy to understand and gives power to any developer to turn this theme into real web application.

We really care for our buyers and so in case if you have any question or feedback, please feel free to get back to us.

I have tried to follow the standards and modular structure while developing the theme. Following sections are explaining the theme File & Folder, structure, html file struture and plugins.

File & Folder Structure



├── html files
Src/assets/
├── Scss/
│   └── All Scss files
├── css/
│   └── All css files.
├── fonts/
├── pages/
│   └── All the pages related scripts
├── images/
│   └── All images
├── plugins/
│   └── The plugins files - which are not available through bower
└── js/
    └── All common Javascripts files

HTML Structure


CSS & Sass


Sass is the most mature, stable, and powerful professional grade CSS extension language in the world.

All the css files are pre-compiled using compass compiler and provided inside the assets/css/ folder. In case if you are not familiar with sass/scss or don't have any environment setup which can be used to compile these files, you can use these CSS files directly. But if you are familiar with saas, I'll suggest you to use the scss files.

Note that you will need to install compass, nodejs, npm, gulp etc in order to compile the scss file. I am sure you know this ;)

Files are explained below:

File Description
bootstrap Simple uses the bootstrap 4.2.1.
style.sccs/style.css This is main style file. The scss version is importing all the custom scss files. Each of the scss file is containing style for speicic element. E.g Buttons, checkbox, icons, forms, etc.
style_dark.scss/style_dark.css If you would like to have a dark topbar(dark background), please include this file. Remove the style.css from it.
_variable.scss This file is containing all the constants values. This allows you to easily customize may things including colors, fonts, text sizes, etc.
icons.scss / icons.css Combines various font icons. You should remove the fonts you don't plan to use from this file and recompile it.
_pages.scss Pages contains the styles for all extra pages and pages. It has overwritten version of styles.
_forms.scss The form's related styles are available into this file. You can easily change the styles for some of form elements.
_form-advanced.scss The form-advanced related styles are available into this file. You can easily change the styles for some of form elements.
_core.scss Common contains some common styles used in various pages.
_buttons.scss Button styles are available here.
_charts.scss All the chart related styles are present into this file.
_checkbox-radio.scss Custom checkboxes and radio button styles are available in this file.
_helper.scss Some of the helper classes are available in this file.
_menu.scss This includes the style for topbar, and left side bar.
_modal.scss Contains the style for modals.
_alerts.scss Notifications related styles are available in this file.
_panel.scss Panel related styles are available in this file.
_invoice.scss Invoice related custom styles are available in this file.
_pricing.scss Pricing related custom styles are available in this file.
_timeline.scss Timeline related custom styles are available in this file.
_tables.scss All the tables related styles are available in this file.
_tabs.scss Tabs related styles are available in this file.
_typography.scss Typography are available in this file.
_widgets.scss Contains the widgets related styles.

Javascript


SimpleAdmin uses jQuery, Bootstrap JS framework(at its core) and some of the third-party plugins. There are may more third party plugin which you can use according to your needs. The css is already containing matching style for these plugins so you will not need to do anything around it.

Files are explained below:

File Description
jquery.js, bootstrap.js, jquery.slimscroll, etc. These files are used at core of the theme.
jquery.app.js This is a main js file. It contains the custom JS code needed for features including layout, sidebar, etc.
pages/*.js These are the files containing pages specific code. They are mainly used for demo purpose.
plugins/**.js All supported and integrated third-party plugins are included in here.

The theme contains various utilies including some helper classes, widgets, etc. Please see below some helper classes.

Helper Classes:

Class Description
.p-0 Removes all padding space
.p-20 Adds 20px padding
.p-t-50 Adds 50px top padding
.p-b-10 Adds 10px bottom padding
.p-l-0 Remove left 0px padding
.m-0 Remove all margin
.m-r-10 Adds 10px right margin
.m-l-10 Adds 10px left margin
.m-t-0 Remove top margin
.m-t-10 Adds 10px top margin
.m-t-30 Adds 30px top margin
.m-b-0 Remove bottom margin
.m-b-5 Adds 5px bottom margin
.m-b-20 Adds 20px bottom margin
.m-b-30 Adds 30px bottom margin
.font-normal font normal
.font-13 font size 13px

Once again thank you for your purchase. I'll be happy to answer the the questions you have related to the theme. In case if you have any suggestion or feature, request please feel free to contact me, I'll try to implement it and will release as part of future updates.

Stay Awesome!

- Coderthemes

Version 1.4.0     09 Jan 2019

  • Update Bootstrap to v4.2.1
  • Updated plugins:
    • Jquery v3.1.1 to v3.3.1
    • Popper js to latest version
    • Material design icons v1.6.5 to v3.2.89
  • Some bugs are fixed

Version 1.3.0     28 Apr 2018

  • Update Bootstrap to v4.1.0
  • Added new datatables

Version 1.2.0     10 Nov 2017

  • Added bootsrap 4 versions.

Version 1.1.0     21 Jan 2017

  • Added new layout(horizontal).

Version 1.0.0     10 Dec 2016

  • Initial released

Copyright © 2016 - 2019 Coderthemes.