Introduction

Efnify is a multipurpose admin template designed based on the google material and jQuery frameworks.

Efnify has a huge collection of material design animation & widgets, UI Elements, jQuery plugins and works seamlessly on all major web browsers, tablets and phones with multiple layout. User friendly and intuitive to use.

Installation

This is the simple static HTML template so no need any headech to install it.

  • 1. Unzip Downloaded File.
  • 2. Open Page in your favorite browser and Enjoy your demo.
Layout options

Below class help for customize page, Add these class in id app-layout-control inside page according to your need.

Note: Default layout is fixed header and left sidebar.
example: -
1. Unfixed sidebar class="left-sidenav-unfixed"
2. Unfixed header and unfixed sidebar class="navbar-unfixed left-sidenav-unfixed"
Class Description
.navbar-unfixed Its define position unfixed navbar
.left-sidenav-unfixed Its define position unfixed left sidebar
How to change theme color

We providing 6 theme color, defult theme color is indigo. css file is default.css

All theme css inside assets->css->theme

color Name
#3f51b5 indigo [primary color]
#303f9f indigo darken-2
#7986cb indigo lighten-2
#9fa8da indigo lighten-3
#c5cae9 indigo lighten-4
#ffab40 orange accent-2 [secondary color]
#fff3e0 orange lighten-5
#d32f2f red darken-2 [error color]
#616161 grey darken-2
#f8f8f8 grey (aprox grey lighten-4)
#eeeeee grey lighten-3
#9F9F9F [disabled color]
rgba(0, 0, 0, 0.87) black [default color for html]
#ffffff white
#fafafa grey lighten-5
Template Structure

All template files have fixed structure consisting of prepage loader, navbar, left sidebar, right sidebar, content and footer.

Font Family

The default Font Family is:


html{font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;}
                                    

Folder Structure

We follow simple structure for the template

  • Efnify
    • assets
      • css - All css files
      • data - Demo data use in datatable
      • js - All js file
      • videos - Video use for demo
    • html - HTML pages
    • node_modules - Included all third party library like materializecss, jquery, ....
    • index.html - Efnify lunch page
    • package.json - Included list of module (generated by npm)
    • package-lock.json - Included lock file of list of module (generated by npm)
    • readme.md - Efnify redme
Theme Files
CSS Files
  • app.css: Efnify main stylesheet
  • helper.css: Efnify Helper class like margin, padding,...
  • responsive.css: Efnify Responsive stylesheet (For different device like large, medium, small)
  • theme/default.css: Efnify color stylesheet
  • Library: node_modules
    • Materialize css: Material design css framework
      • materialize.min.css: Main File
    • prism: Prism syntax highlighter
      • prism.css: Main File
    • animate: Animate css library
      • animate.min.css: Main File
    • quill: Web text editor jquery library
      • quill.snow.css: Main File
    • DataTables: Table jquery library
      • jquery.dataTables.min.css: Main File
    • Range Slider: Range Slider
      • ion.rangeSlider.css: Main File
      • ion.rangeSlider.skinFlat.css: Theme stylesheet
Javascript Files
  • app.js: Efnify main script
  • search.js: Efnify Search in navbar
  • Library: node_modules
    • materialize css: Material design css framework
      • materialize.min.js: Main file
    • jquery: javascript framework
      • jquery.min.js: Main file
    • prism: Prism syntax highlighter
      • prism.js: Main file
    • sweetalert: Alert jquery library
      • sweetalert.min.js: Main file
    • Chartjs: Chart jquery library
      • Chart.min.js: Main file
    • quill: Web text editor jquery library
      • quill.min.js: Main file
    • DataTables : Table jquery library
      • jquery.dataTables.min.js: Main file
    • Range Slider: Range Slider
      • ion.rangeSlider.min.js: Main File

Source and Plugins

Plugin Website Licence Version
Materializecss Framework http://materializecss.com MIT 1.0.0-rc.2
JQuery JavaScript Library http://jquery.com MIT 3.3.1
Google Material icons https://material.io/tools/icons Apache 2.0 3.0.1
Quill Text editor https://quilljs.com/ BSD 1.3.6
Chartjs http://www.chartjs.org/ MIT 2.7.3
Datatables https://www.datatables.net/ MIT 1.10.19
Sweet Alerts https://sweetalert.js.org/ MIT 2.1.0
Animate.css https://daneden.github.io/animate.css/ MIT 3.7.0
Prism syntax highlighter http://prismjs.com/ MIT 1.15.0
RangeSlider http://ionden.com/a/plugins/ion.rangeSlider/en.html MIT 2.2.0