Buttons

Default buttons

It is really simply to create a button, just the .btn class to any <a> or <button> element.

Default button

            <a href="javascript:void(0)" class="btn">Default button</a>
         

Default button

            <button href="javascript:void(0)" class="btn">Default button</button>
         

Disable buttons

You can mark a button as disabled just by adding the 'disabled' class

Default button

            <a href="javascript:void(0)" class="btn disabled">Default button</a>
         

Default button

            <button href="javascript:void(0)" class="btn disabled">Default button</button>
         

Primary buttons

This is the main button for primary actions across the website, just add the 'btn-primary' class

Primary button

            <a href="javascript:void(0)" class="btn btn-primary">Primary button</a>
         

Primary button

            <button href="javascript:void(0)" class="btn btn-primary">Primary button</button>
         

Colorful buttons

It is easy to switch between button colors

Button Button Button Button Button Button

           <a href="javascript:void(0)" class="btn btn-success">Button</a>
           <a href="javascript:void(0)" class="btn btn-danger">Button</a>
           <a href="javascript:void(0)" class="btn btn-warning">Button</a>
           <a href="javascript:void(0)" class="btn btn-inverse">Button</a>
           <a href="javascript:void(0)" class="btn btn-info">Button</a>
           <a href="javascript:void(0)" class="btn btn-funky">Button</a>
         

Sizing buttons

Furatto comes with 4 different button sizes for you to play around...

Button Button Button Button

           <a href="javascript:void(0)" class="btn btn-primary btn-mini">Button</a>
           <a href="javascript:void(0)" class="btn btn-primary btn-small">Button</a>
           <a href="javascript:void(0)" class="btn btn-primary btn-large">Button</a>
           <a href="javascript:void(0)" class="btn btn-primary btn-xlarge">Button</a>
         

Block buttons

Button

          <a href="javascript:void(0)" class="btn btn-primary btn-block">Button</a>
         

Buttons with icons

Checkout Settings

           <a href="javascript:void(0)" class="btn btn-primary">
             <i class="icon-shopping-cart icon-white"></i>
             Checkout
           </a>
           <a href="javascript:void(0)" class="btn btn-success btn-large">
             <i class="icon-cog icon-white"></i>
             Settings
           </a>