Version 1.0

Olian - Bootstrap Minimal & Clean Admin Template

The perfect combination of Design & Development for your next project

powered_by

Documentation

Setting up your Admin Panel is very easy with our clean coding and
simply explained narration.

Introduction

Olian is minimal and clean Bootstrap Admin Template. It is built with latest Bootstrap version keeping user friendliness in mind. It comes with online documentation to make it easy for developers. It also has dedicated light demos for CRM, eCommerce. It also come with Vertical, Horizontal, Semi Dark layout version is add on to it.

Files Structure

We have maintained hierarchy of Files and consecutive path while developing this theme in order to modify it with Great Ease. Following sections are explaining the theme File & Folder structure.

         Olian/
        ├──  assets/
        │   └──  css/
        │       └──  All css files
        │   └──  fonts/
        │       └──  All font files
        │   └──  icons/
        │       └──  All icons files
        │   └──  images/
        │       └──  All images files
        │   └──  js
        │       └──  All javascript files
        │   └──  plugins
        │       └──  All plugins files
        │   └──  scss
        │       └──  All scss files
        └── *.html
            └──  ALL HTML files

         Documentation/
            └── index.html - Index file for documentation.

Bootstrap

Build responsive, mobile-first projects on the web with the world's most popular front-end component library.

Bootstrap is an open source toolkit for developing with HTML, CSS, and JS. Quickly prototype your ideas or build your entire app with our Sass variables and mixins, responsive grid system, extensive prebuilt components, and powerful plugins built on jQuery. Olian purely built using bootstrap.

HTML

Olian is built with very clean HTML code and also well commented, so you can easily customized as well.

CSS & SCSS

Olian has used most popular technologies in now days like CSS3 and SCSS.

Cascading Style Sheets is a style sheet language used for describing the presentation of a document written in a markup language like HTML. CSS is a cornerstone technology of the World Wide Web, alongside HTML and JavaScript.

Sass is completely compatible with all versions of CSS. We take this compatibility seriously, so that you can seamlessly use any available CSS libraries. Sass is the most mature, stable, and powerful professional grade CSS extension language in the world.

File Description
bootstrap.min.scss/bootstrap.min.css Olian used the bootstrap v4.4.1 in all the pages.
responsive.scss/responsive.css This file containing all responsive css.
icons.scss/icons.css All font icons load from this css file.
style.scss/style.css Containing all page common css.

Javascript

Olian has used latest version of jQuery, Bootstrap and some others open source third-party plugins according to our need. you can also used other third-party plugins as per your need.

File Description
jquery.min.js This is a core jquery js file.
popper.min.j This is a core Popper js file.
bootstrap.min.js This is a core Bootstrap js file.
modernizr.min.js This is a core Modernizr js file.
detect.js This is a core Detect js file.
jquery.slimscroll.js This is a core Slimscroll js file.
vertical-menu.js/horizontal-menu.js This is a main vertical or horizntal menu js file. It contains the menu js code.
plugins/**.js All the integrated third-party plugins js files are included here.
js/custom/*.js These are the files containing all the pages individualy js code.
core.js This is a core js file. It contains the all custom js code.

Helper Classes

Olian comes with pre-built helper classes which used for better designing.

Class Description
Padding
.p-t-5 Add 5px padding to top
.p-t-10 Add 10px padding to top
.p-t-15 Add 15px padding to top
.p-t-20 Add 20px padding to top
.p-t-25 Add 25px padding to top
.p-t-30 Add 30px padding to top
.p-t-35 Add 35px padding to top
.p-t-40 Add 40px padding to top
.p-t-45 Add 45px padding to top
.p-t-50 Add 50px padding to top
.p-r-5 Add 5px padding to right
.p-r-10 Add 10px padding to right
.p-r-15 Add 15px padding to right
.p-r-20 Add 20px padding to right
.p-r-25 Add 25px padding to right
.p-r-30 Add 30px padding to right
.p-r-35 Add 35px padding to right
.p-r-40 Add 40px padding to right
.p-r-45 Add 45px padding to right
.p-r-50 Add 50px padding to right
.p-b-5 Add 5px padding to bottom
.p-b-10 Add 10px padding to bottom
.p-b-15 Add 15px padding to bottom
.p-b-20 Add 20px padding to bottom
.p-b-25 Add 25px padding to bottom
.p-b-30 Add 30px padding to bottom
.p-b-35 Add 35px padding to bottom
.p-b-40 Add 40px padding to bottom
.p-b-45 Add 45px padding to bottom
.p-b-50 Add 50px padding to bottom
.p-l-5 Add 5px padding to left
.p-l-10 Add 10px padding to left
.p-l-15 Add 15px padding to left
.p-l-20 Add 20px padding to left
.p-l-25 Add 25px padding to left
.p-l-30 Add 30px padding to left
.p-l-35 Add 35px padding to left
.p-l-40 Add 40px padding to left
.p-l-45 Add 45px padding to left
.p-l-50 Add 50px padding to left
Margin
.m-t-5 Add 5px pmarginto top
.m-t-10 Add 10px margin to top
.m-t-15 Add 15px margin to top
.m-t-20 Add 20px margin to top
.m-t-25 Add 25px margin to top
.m-t-30 Add 30px margin to top
.m-t-35 Add 35px margin to top
.m-t-40 Add 40px margin to top
.m-t-45 Add 45px margin to top
.m-t-50 Add 50px margin to top
.m-r-5 Add 5px pmarginto right
.m-r-10 Add 10px margin to right
.m-r-15 Add 15px margin to right
.m-r-20 Add 20px margin to right
.m-r-25 Add 25px margin to right
.m-r-30 Add 30px margin to right
.m-r-35 Add 35px margin to right
.m-r-40 Add 40px margin to right
.m-r-45 Add 45px margin to right
.m-r-50 Add 50px margin to right
.m-b-5 Add 5px pmarginto bottom
.m-b-10 Add 10px margin to bottom
.m-b-15 Add 15px margin to bottom
.m-b-20 Add 20px margin to bottom
.m-b-25 Add 25px margin to bottom
.m-b-30 Add 30px margin to bottom
.m-b-35 Add 35px margin to bottom
.m-b-40 Add 40px margin to bottom
.m-b-45 Add 45px margin to bottom
.m-b-50 Add 50px margin to bottom
.m-l-5 Add 5px pmarginto left
.m-l-10 Add 10px margin to left
.m-l-15 Add 15px margin to left
.m-l-20 Add 20px margin to left
.m-l-25 Add 25px margin to left
.m-l-30 Add 30px margin to left
.m-l-35 Add 35px margin to left
.m-l-40 Add 40px margin to left
.m-l-45 Add 45px margin to left
.m-l-50 Add 50px margin to left
Line Height
.l-h-20 Set 20px line height
.l-h-22 Set 22px line height
.l-h-24 Set 24px line height
.l-h-26 Set 26px line height
.l-h-28 Set 28px line height
.l-h-30 Set 30px line height
.l-h-32 Set 32px line height
.l-h-34 Set 34px line height
.l-h-36 Set 36px line height
.l-h-38 Set 38px line height
.l-h-40 Set 20px line height
Font Size
.font-10 Set 10px font size
.font-11 Set 11px font size
.font-12 Set 12px font size
.font-13 Set 13px font size
.font-14 Set 14px font size
.font-15 Set 15px font size
.font-16 Set 16px font size
.font-17 Set 17px font size
.font-18 Set 18px font size
.font-19 Set 19px font size
.font-20 Set 20px font size
.font-21 Set 21px font size
.font-22 Set 22px font size
.font-23 Set 23px font size
.font-24 Set 24px font size
.font-25 Set 25px font size
.font-26 Set 26px font size
.font-27 Set 27px font size
.font-28 Set 28px font size
.font-29 Set 29px font size
.font-30 Set 30px font size
.font-31 Set 31px font size
.font-32 Set 32px font size
.font-33 Set 33px font size
.font-34 Set 34px font size
.font-35 Set 35px font size
.font-36 Set 36px font size
.font-37 Set 37px font size
.font-38 Set 38px font size
.font-39 Set 39px font size
.font-40 Set 40px font size
Font Weight
.f-w-3 Set 300 font weight
.f-w-4 Set 400 font weight
.f-w-5 Set 500 font weight
.f-w-6 Set 600 font weight
.f-w-7 Set 700 font weight
Border Radius
.b-r-1 Set 1px border radius
.b-r-2 Set 2px border radius
.b-r-3 Set 3px border radius
.b-r-4 Set 4px border radius
.b-r-5 Set 5px border radius
.b-r-6 Set 6px border radius
.b-r-7 Set 7px border radius
.b-r-8 Set 8px border radius
.b-r-9 Set 9px border radius
.b-r-10 Set 10px border radius
.b-r-15 Set 15px border radius
.b-r-20 Set 20px border radius
.b-r-25 Set 25px border radius
.b-r-30 Set 30px border radius
.b-r-35 Set 35px border radius
.b-r-40 Set 40px border radius
.b-r-45 Set 45px border radius
.b-r-50 Set 50px border radius
.b-r-100 Set 100px border radius
Extra
.chart-height Set 320px height to chart
.v-a-m Set vertical align to middle
.psn-abs Set position to absolute
.bx-shadow Set box shadow

Features

We have added following features into Olian.

  • Responsive
  • Multi Purpose
  • UI Kits
  • Creative Widgets
  • Useful Plugins
  • Authentication Pages
  • 10+ Icons Sets
  • 100+ Pages
  • 3+ Unique Dasboard Layout
  • Vertical Layout
  • Horizontal Layout
  • Easy Customization
  • Clean Design
  • SASS Supported
  • Well Commented & Quality Code
  • W3C Validated
  • All Browser Support

Credit & Resources

We have used the following open source plugins.

  • jQuery
  • Bootstrap
  • Popper
  • Modernizr
  • Detect
  • jQuery Slimscroll
  • Animate CSS
  • jQuery Confirm
  • Carousel
  • Slick Slider
  • Full Calendar
  • Dragula
  • Cropperjs
  • Nestable
  • Pnotify
  • ion rangeSlider
  • jQuery Bar Rating
  • Bootstrap Session Timeout
  • Sweet Alert2
  • Switchery
  • jQuery Toolbar
  • Product Tour
  • JS Tree
  • Bootstrap Inputmask
  • Bootstrap MaxLength
  • Bootstrap Tags Input
  • Bootstrap Touch Spin
  • Bootstrap X-editable
  • Bootstrap Date Picker
  • Bootstrap Color Picker
  • Select2
  • Dropzone
  • Summernote
  • Tinymce
  • Codemirror
  • Validate JS
  • jQuery Step
  • jQuery UI
  • C3 Chart
  • Chartist JS
  • Chart JS
  • Flot Chart
  • Knob Chart
  • Morris Chart
  • Piety Chart
  • Sparkline Chart
  • D3
  • Moment JS
  • Raphael
  • Dripicons Icons
  • Feather Icons
  • Flag Icons
  • Font Awesome Icons
  • Ion Icons
  • Line Awesome Icons
  • Material Design Icons
  • Remixicon
  • Simple Line Icons
  • Socicon Icons
  • Themify Icons
  • Typicons Icons
  • Bootstrap Table
  • Data Table
  • Editable Table
  • Foo Table
  • RWD Table
  • Google Map
  • Vector Map
  • Creditcard js
  • Isotope js
  • Vertical Timeline
  • jQuery Countdown
  • jQuery Countdown
  • undraw.co

Support

We thank you once again for your purchase. Be Happy to connect with us regarding any Issue/Query. If you have any suggestions regarding new features or functions that we can implement, Do let us know. We will surely try to add them in our next Version/Update.

Have a Great Day. Peace!

- Team Olian