Css structure

Float is built using sass preprocessor. Its make customization easier.

Support Url: Design_Mylife

Support Email: mylifedesign143@gmail.com

01. Css Structure

Include a css file to html page

<!-- Latest compiled and customizable css file -->
<link rel="stylesheet" href="css/style.css"> 

Sass Structure

Before use the sass files you need to install a sass compiler for your pc, get right information from Here

If you are not familiar with sass you can directly customize css/style.css file,

If you are love to use sass, you have a good news because float is built using sass. here are some info about .scss files

Scss file Use
_base.scss basic css
_blog.scss Blog pages
_buttons.scss Buttons styles
_calendar.scss Event calendar customize file
_charts.scss Charts & graphs
_dropdwns.scss All dropdown css
_form-elements.scss Forms and inputs
_gallery.scss Gallery page
_jquery-ui-elements.scss Jquery UI styles
_label_badges.scss For label and badges
_layout-horizontal.scss Horizontal menu layout
_left-nav.scss For left navigation style
_mailbox.scss Mail pages style
_misc.scss For login, register, 404 styles
_mixins.scss For css3 transitions, box-shadows, border-radius mixins
_modal-popups.scss For bootstrap modals
_page-header.scss For page breadcrumb
_pagination.scss For bootstrap paginations
_panels.scss For panel cards
_pricing.scss Pricing tables style
_progress-bars.scss For progress bar style
_responsive.scss Responsive style
_right-sidebar.scss For right sidebar panel
_tables.scss All tables styles
_tabs-accordions.scss For tabs and accordions
_timeline-scss For timeline style
_top-bar.scss For top bar style
_variables.scss For background, text colors, font-family variables
_widget.scss All widget styles
style.scss Main scss file, include into the other scss files, Footer style also included into this file.
landing-style.scss Landing page style

02. Icons

Float is using the Font-awesome and simple line icons pack

Generate icon

                    
  <!-- Font awesome -->
  <i class="fa fa-home"></i>     

 <!-- Simple line icons -->
  <i class="icon-home"></i>