↑ Top

KodeDocumentation

Getting Started

Thanks for Purchasing Kode. Kode is a admin template based on Boostrap.Builded with CSS, jQuery and Less.

Theme Files

Html Files

Css Files

Javascript Files

Fireworks Layout PNG

Includes

Css Files
Javascript Files

You can take a look javascript files bottom on index.html codes

Topbar '#top div'

Topbar comes fixed on top of page. You can change it if u dont want to. Open style.css and find #top class.
Change position value as absolute and it will be not fixed.
All top bar elements coded based as rgba. You can create different styles just changing #top background:
How to change logo ?

Logo is inside of .applogo and its text. Put your project logo as image inside on it or just edit as text

What is Sidebar or Sidepanel open buttons ?

These buttons one of left and other is right of topbar.

Open sidebar button has 2 different type. One mobile and one desktop pc. Mobile is only can be see on mobile resolution. Actually these buttons have same style, just doing different work. Normal sidebar button is working on desktop and hide itselft on mobile. Mobile sidebar button works on mobile and hide itself on desktop resolution.

About Css

How to use multiple class for css ?

Example:
div class="sidebar" - just classed as sidebar
div class="sidebar leftmenu" - classed as sidebar and leftmenu

What is style.less?

Its less version of your style.css. Kode developed on less but used style.css. You can use it if you are working based on Less.

Sidebar

How to change sidebar background?

Sidebar background based on body background. Change body background. Text and icons colors coded as rgba.

Sidebar is relative on desktop mode and it hide itself on mobile
On mobile mode sidebar position value is absolute.

All sidebar menu coded as group and classed .sidebar-panel

Layouts

Default
Default layouts are #top, .sidebar, .footer and .content. Also there is a .sidepanel
#top - Topbar
.sidebar - Sidebar
.footer - Footer
.content - Content
.sidepanel - Side panel right of screen.
Container Layouts
.container-widget - Container layout for widgets
.container-default - Container default
.container-padding - Container with padding.
.container-no-padding - Container without padding.
.container-mail - Container for mailbox.

Grid

Kode using bootstrap grid system

Bootstrap includes a responsive, mobile first fluid grid system that appropriately scales up to 12 columns as the device or viewport size increases. It includes predefined classes for easy layout options, as well as powerful mixins for generating more semantic layouts.

Learn more about Bootstrap grid system http://getbootstrap.com/css/#grid

Extra small devices Phones (<768px) Small devices Tablets (≥768px) Medium devices Desktops (≥992px) Large devices Desktops (≥1200px)
Grid behavior Horizontal at all times Collapsed to start, horizontal above breakpoints
Container width None (auto) 750px 970px 1170px
Class prefix .col-xs- .col-sm- .col-md- .col-lg-
# of columns 12
Column width Auto ~62px ~81px ~97px
Gutter width 30px (15px on each side of a column)
Nestable Yes
Offsets Yes
Column ordering Yes

Based on Boostrap

Kode using Bootstrap. Bootstrap is most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on the web.
Learn more about bootstrap
http://getbootstrap.com

Source and Plugins

Plugin Website Licence
Bootstrap Framework http://getbootstrap.com MIT
jQuery JavaScript Library http://jquery.com MIT
jQuery UI https://jqueryui.com MIT
Font Awesome http://fortawesome.github.io/Font-Awesome MIT
Awesome Bootstrap Checkbox hhttps://github.com/flatlogic/awesome-bootstrap-checkbox MIT
Bootstrap Select http://silviomoreto.github.io/bootstrap-select MIT
Bootstrap Toggle http://www.bootstraptoggle.com MIT
Bootstrap wysihtml5 http://jhollingworth.github.io/bootstrap-wysihtml5 MIT
Chartist http://gionkunz.github.io/chartist-js WTFPL
Easy Pie Chart http://rendro.github.io/easy-pie-chart MIT
Flot http://www.flotcharts.org MIT
Gmaps https://hpneo.github.io/gmaps MIT
Sparklines http://omnipotent.net/jquery.sparkline BSD
Datatables http://www.datatables.net Multi
Rickshaw http://code.shutterstock.com/rickshaw MIT
Summernote http://summernote.org MIT
Sweet Alerts http://tristanedwards.me/sweetalert MIT
Full Calendar http://fullcalendar.io MIT
Date Range Picker http://www.daterangepicker.com MIT
Picjumbo (pictures) http://picjumbo.com/ Commercial Free

Support

Contact with me for your feedbacks or questions.

themeforest.net/user/egemem