Zurb Foundation

Note: there is new Foundation 5 on the market, looks similar to Foundation 4. I didn't have time to test it deeply.

Foundation is a collection of usefull sass and JS files helping us developing websites faster.

You can see detailed info on their page.

What is great in Foundation:

1. I can turn ON/OFF any CSS component easily (wasn't possible in Foundation 3). So I wireframe with Foundation and final coding can be finished by customization of ready to use components or I can create custom ones.
   
   Example (you can disable output to final css for any component you use, so output is as small as possible, but you can still use all the available mixins, function - even on disabled components):
   

   // SCSS; variables.scss
   ...
   $include-html-joyride-classes: false;
   $include-html-clearing-classes: false;
   $include-html-alert-classes: true;
   $include-html-nav-classes: true;
   ...

2. Variables - tune wireframe easily.
   
   Example:
   

   // SCSS, variables.scss
   ...
   // Tooltip Variables
   $has-tip-border-bottom: dotted 1px #ccc;
   $has-tip-font-weight: bold;
   $has-tip-font-color: #333;
   $has-tip-border-bottom-hover: dotted 1px darken($primary-color, 20%);
   $has-tip-font-color-hover: $primary-color;
   ...
   
   

3. So many ready to use components, which look really good.
   Check Foundation docs.

 

komentárový systém: Disqus