From: Paramjit Singh Sahota <psa@tinyerp.com>
Date: Mon, 26 Aug 2013 06:19:42 +0000 (+0530)
Subject: [MERGE] Merged lp:~openerp-dev/openobject-addons/trunk-website-bootstrap-3.0-bth
X-Git-Tag: InsPy_master01~73^2~1696^2~40^2~8
X-Git-Url: http://git.inspyration.org/?a=commitdiff_plain;h=7e718a680438bf6013739a9a2b2a25824155dac4;hp=a0dc6a502ea1089b820b1a2510da7e6b2e0c5d58;p=odoo%2Fodoo.git

[MERGE] Merged lp:~openerp-dev/openobject-addons/trunk-website-bootstrap-3.0-bth

bzr revid: psa@tinyerp.com-20130826061942-dr9m4iv3jvtl77ib
---

diff --git a/addons/website_sale/static/description/index.html b/addons/website_sale/static/description/index.html
index 4a6d40f..4d3ad24 100644
--- a/addons/website_sale/static/description/index.html
+++ b/addons/website_sale/static/description/index.html
@@ -1,10 +1,10 @@
 <section class="oe_container">
     <div class="oe_row oe_spaced">
-        <div class="oe_span12">
+        <div class="oe_col-md-12">
             <h2 class="oe_slogan">Open Source eCommerce</h2>
             <h3 class="oe_slogan">Optimize sales with an awesome online store.</h3>
         </div>
-        <div class="oe_span6">
+        <div class="oe_col-md-6">
             <div class="oe_demo oe_picture oe_screenshot">
                 <a href="https://www.openerp.com/saas_master/demo?lang=en_US&module=website_sale">
                     <img src="">
@@ -12,7 +12,7 @@
                 <div class="oe_demo_footer oe_centeralign">Online Demo</div>
             </div>
         </div>
-        <div class="oe_span6">
+        <div class="oe_col-md-6">
             <p class='oe_mt32'>
                 OpenERP eCommerce is unlike anything you have ever seen before.
                 It's at the same time full-featured, integrated with your
@@ -29,7 +29,7 @@
     <div class="oe_row">
         <h2 class="oe_slogan">Create Awsome Product Pages</h2>
         <h3 class="oe_slogan">Get rid of old WYSIWYG editors</h3>
-        <div class="oe_span6">
+        <div class="oe_col-md-6">
             <p class='oe_mt32'>
                 OpenERP's unique <em>'edit inline'</em> approach makes website
                 and product pages creation surprisingly easy. "Want to change
@@ -41,7 +41,7 @@
                 create beautifull product pages that your customer will love.
             </p>
         </div>
-        <div class="oe_span6">
+        <div class="oe_col-md-6">
             <div class="oe_bg_img oe_centered">
                 <img class="oe_picture" src="">
             </div>
@@ -53,10 +53,10 @@
     <div class="oe_row">
         <h2 class="oe_slogan">Increase Your Revenue Per Order</h2>
         <h3 class="oe_slogan">Do you want fries with that?</h3>
-        <div class="oe_span6">
+        <div class="oe_col-md-6">
             <img class="oe_picture oe_screenshot" src="">
         </div>
-        <div class="oe_span6">
+        <div class="oe_col-md-6">
            <p class='oe_mt32'>
                 Use the built-in cross-selling feature helps you offer extra
                 products related to what the shopper put in his cart. (e.g.
@@ -78,7 +78,7 @@
     <div class="oe_row">
         <h2 class="oe_slogan">A Clean Google Analytics Integration</h2>
         <h3 class="oe_slogan">Control your sales funnel with Google Analytics</h3>
-        <div class="oe_span6">
+        <div class="oe_col-md-6">
           <p class='oe_mt32'>
             Get a clear visibility of your sales funnel. OpenERP's Google
             Analytics trackers are configured by default to track all kind of
@@ -88,7 +88,7 @@
             linked with Google Analytics, you get a 360° view of your business.
           </p>
         </div>
-        <div class="oe_span6">
+        <div class="oe_col-md-6">
             <img class="oe_picture oe_screenshot" src="">
         </div>
    </div>
@@ -98,12 +98,12 @@
     <div class="oe_row">
         <h2 class="oe_slogan">Target New Markets</h2>
         <h3 class="oe_slogan">Multi-languages Without Pain</h3>
-        <div class="oe_span6">
+        <div class="oe_col-md-6">
             <div class="oe_bg_img">
                 <img class="oe_picture" src="">
             </div>
         </div>
-        <div class="oe_span6">
+        <div class="oe_col-md-6">
           <p class='oe_mt32'>
               Get your website translated in multiple languages with no effort.
               OpenERP proposes and propagates translations automatically
@@ -123,7 +123,7 @@
     <div class="oe_row">
         <h2 class="oe_slogan">Designer-Friendly Themes</h2>
         <h3 class="oe_slogan">Designers love working on OpenERP</h3>
-        <div class="oe_span6">
+        <div class="oe_col-md-6">
           <p class='oe_mt32'>
               Themes are awesome and easy to design. You don't need to develop
               to create new pages, themes or building blocks. We use a clean
@@ -134,7 +134,7 @@
               after the end-users start creating new contents.
           </p>
         </div>
-        <div class="oe_span6">
+        <div class="oe_col-md-6">
             <div class="oe_row_img oe_centered">
                 <img class="oe_picture" src="">
             </div>
@@ -146,12 +146,12 @@
     <div class="oe_row">
         <h2 class="oe_slogan">Acquire New Customers</h2>
         <h3 class="oe_slogan">SEO tools at your finger tips</h3>
-        <div class="oe_span6">
+        <div class="oe_col-md-6">
             <div class="oe_bg_img">
                 <img class="oe_picture oe_screenshot" src="">
             </div>
         </div>
-        <div class="oe_span6">
+        <div class="oe_col-md-6">
           <p class='oe_mt32'>
               SEO tools are ready to use, with no configuration required.
               OpenERP suggests keywords according to Google most searched
@@ -169,14 +169,14 @@
     <div class="oe_row">
         <h2 class="oe_slogan">Leverage Social Media</h2>
         <h3 class="oe_slogan">Optimize: from Ads to Conversions</h3>
-        <div class="oe_span6">
+        <div class="oe_col-md-6">
           <p class='oe_mt32'>
               Create new landing pages easily with the OpenERP inline edition
               feature. Send visitors of your different marketing campaigns to
               specific landing pages to optimize conversions.
           </p>
         </div>
-        <div class="oe_span6">
+        <div class="oe_col-md-6">
             <div class="oe_bg_img">
                 <img class="oe_picture oe_screenshot" src="">
             </div>
@@ -189,12 +189,12 @@
     <div class="oe_row">
         <h2 class="oe_slogan">Manage a Resellers Network</h2>
         <h3 class="oe_slogan">Referencing, Lead Forward, Pricelists</h3>
-        <div class="oe_span6">
+        <div class="oe_col-md-6">
             <div class="oe_bg_img">
                 <img class="oe_picture oe_screenshot" src="">
             </div>
         </div>
-        <div class="oe_span6">
+        <div class="oe_col-md-6">
           <p class='oe_mt32'>
               Manage a reseller network to target new market, have local
               presences or broaden your distribution. Give them access to your
@@ -213,7 +213,7 @@
     <div class="oe_row">
         <h2 class="oe_slogan"></h2>
         <h3 class="oe_slogan">Integrated vs Interfaced</h3>
-        <div class="oe_span6">
+        <div class="oe_col-md-6">
             <p class='oe_mt32'>
                 Benefit from the power of OpenERP, in your online store: a
                 powerfull tax engine, flexible pricing structures, a real
@@ -226,7 +226,7 @@
                 pain, real time.
             </p>
         </div>
-        <div class="oe_span6">
+        <div class="oe_col-md-6">
             <div class="oe_bg_img oe_centered">
                 <img class="oe_picture" src="">
             </div>
@@ -238,7 +238,7 @@
 <section class="oe_container">
     <div class="oe_row">
         <h2 class="oe_slogan">And much more...</h2>
-        <div class="oe_span4">
+        <div class="oe_col-md-4">
             <h3 class="oe_slogan">Online Sales</h3>
             <ul>
                 <li>Mobile Interface</li>
@@ -248,7 +248,7 @@
                 <li>Multiple stores</li>
             </ul>
         </div>
-        <div class="oe_span4">
+        <div class="oe_col-md-4">
             <h3 class="oe_slogan">Customer Service</h3>
             <ul>
                 <li>Customer Portal to track orders</li>
@@ -258,7 +258,7 @@
                 <li>Coupons or gift certificates</li>
             </ul>
         </div>
-        <div class="oe_span4">
+        <div class="oe_col-md-4">
             <h3 class="oe_slogan">Order Management</h3>
             <ul>
                 <li>Advanced warehouse management features</li>
@@ -275,7 +275,7 @@
     <div class="oe_row">
         <h2 class="oe_slogan">Fully Integrated With Others Apps</h2>
         <h3 class="oe_slogan">Get hundreds of open source apps for free</h3>
-        <div class="oe_span4">
+        <div class="oe_col-md-4">
             <a href="/apps/website">
                 <h3>CMS</h3>
                 <div class="oe_row_img oe_centered">
@@ -286,7 +286,7 @@
                 Easily create awesome websites with no technical knowledge required.
             </p>
         </div>
-        <div class="oe_span4">
+        <div class="oe_col-md-4">
             <a href="/apps/website_mail">
                 <h3>Blogs</h3>
                 <div class="oe_row_img oe_centered">
@@ -297,7 +297,7 @@
                 Write news, attract new visitors, build customer loyalty.
             </p>
         </div>
-        <div class="oe_span4">
+        <div class="oe_col-md-4">
             <a href="/apps/website_event">
                 <h3>Online Events</h3>
                 <div class="oe_row_img oe_centered">
@@ -309,7 +309,7 @@
                 webinars, trainings, etc.
             </p>
         </div>
-        <div class="oe_span12 oe_centered oe_muted">
+        <div class="oe_col-md-12 oe_centered oe_muted">
             <a href="/apps">
                 and hundreds more applications...
             </a>
diff --git a/addons/website_sale/views/website_sale.xml b/addons/website_sale/views/website_sale.xml
index 5c71e4c..d3f8fae 100644
--- a/addons/website_sale/views/website_sale.xml
+++ b/addons/website_sale/views/website_sale.xml
@@ -55,7 +55,7 @@
             <t t-set="title">Shop - <t t-raw="title">Categories</t></t>
             <div class="container mt48 oe_website_sale">
                 <div class="row">
-                    <div class="span12" id="shop_content">
+                    <div class="col-md-12" id="shop_content">
                         <t t-raw="shop_content" />
                     </div>
                 </div>
@@ -64,8 +64,8 @@
     </template>
     <template id="products_categories" inherit_id="website_sale.layout" inherit_option_id="website_sale.layout" name="Left Product Categories">
         <xpath expr="//div[@id='shop_content']" position="before">
-            <div class="span4">
-                <ul class="nav nav-list">
+            <div class="col-md-4">
+                <ul class="nav">
                     <li t-att-class=" '' if category_id else 'active' " class='active'><a href="/shop/">All Products</a></li>
                 <t t-foreach="categories" t-as="category">
                     <t t-call="website_sale.categories_recursive"/>
@@ -74,7 +74,7 @@
             </div>
         </xpath>
         <xpath expr="//div[@id='shop_content']" position="attributes">
-            <attribute name="class">span8</attribute>
+            <attribute name="class">col-md-8</attribute>
         </xpath>
     </template>
 
@@ -83,7 +83,7 @@
     <template id="categories_recursive">
         <li t-att-class="category.id == category_id and 'active' or ''">
             <a t-attf-href="/shop/category/#{ category.id }/" t-field="category.name"></a>
-            <ul t-if="category.child_id" class="nav nav-list">
+            <ul t-if="category.child_id" class="nav">
                 <t t-foreach="category.child_id" t-as="category">
                     <t t-call="website_sale.categories_recursive"/>
                 </t>
@@ -103,13 +103,13 @@
                             <t t-set="classname">pull-left</t>
                         </t>
                         <form t-attf-action="/shop/#{ category_id and ('category/%s/' % category_id) or ''}" method="get" class="navbar-search pull-right pagination">
-                            <input type="text" name="search" class="search-query span2" placeholder="Search" t-att-value="search or '' or ''"/>
+                            <input type="text" name="search" class="search-query col-md-2" placeholder="Search" t-att-value="search or '' or ''"/>
                         </form>
                     </div>
                 </div>
                 <div class='row grid grid-align-top'>
                     <t t-foreach="products" t-as="product">
-                    <div t-attf-class="span2 mb16 thumbnail text-center #{not product.website_published and 'alert' or ''}">
+                    <div t-attf-class="col-md-2 mb16 thumbnail text-center #{not product.website_published and 'alert' or ''}">
                         <a t-attf-href="/shop/product/#{ product.id }/?#{ search and ('search=%s' % search) or ''}#{ category_id and ('&amp;category_id=%s' % category_id) or ''}">
                             <h5  t-field="product.name"> </h5>
                             <img class="img-rounded" t-att-src="product.img('image_small')"/>
@@ -123,7 +123,7 @@
                                 <b><t t-esc="product.product_variant_ids[0].price" /> €</b>
                             </div>
                             <div class="mb8 mt8">
-                                <a t-if="product.website_published" t-attf-href="./add_cart/#{ product.id }/" class="btn btn-small btn-success">Add to cart</a>
+                                <a t-if="product.website_published" t-attf-href="./add_cart/#{ product.id }/" class="btn btn-default btn-small btn-success">Add to cart</a>
                             </div>
                         </div>
                     </div>
@@ -145,21 +145,21 @@
                 <div class='navbar navbar-inverse'>
                     <div class='navbar-inner'>
                         <form t-attf-action="/shop/#{ category_id and ('category/%s/' % category_id) or ''}" method="get" class="navbar-search pull-right pagination">
-                            <input type="text" name="search" class="search-query span2" placeholder="Search" t-att-value="search or '' or ''"/>
+                            <input type="text" name="search" class="search-query col-md-2" placeholder="Search" t-att-value="search or '' or ''"/>
                         </form>
                     </div>
                 </div>
                 <div id="product_detail">
                     <t t-call="website.publish"><t t-set="object" t-value="product"/></t>
                     <h2 t-field="product.name"></h2>
-                    <a t-if="not product.product_variant_ids" t-attf-href="./add_cart/#{ product.id }/" class="btn btn-small btn-success pull-right">Add to cart</a>
+                    <a t-if="not product.product_variant_ids" t-attf-href="./add_cart/#{ product.id }/" class="btn btn-default btn-small btn-success pull-right">Add to cart</a>
                     <form t-if="len(product.product_variant_ids) > 1" action="./add_cart/" class="pull-right">
-                        <label class="radio" t-foreach="product.product_variant_ids" t-as="product">
-                            <input type="radio" name="product_id" t-att-value="product.id" t-att-checked="product == product.product_variant_ids[0] or None"/>
+                        <label label-default="label-default" class="radio" t-foreach="product.product_variant_ids" t-as="product">
+                            <input type="radio" name="product_id" t-att-value="product.id" t-att-checked="product == product.product_variant_ids[0] or None" />
                             <t t-esc="product.variants or ''">Standard</t>
                             <span class="badge" t-if="product.price_extra"><t t-esc="product.price_extra > 0 and '+' or ''"/><t t-esc="product.price_extra"/> €</span>
-                        </label><br/>
-                        <button class="btn btn-small btn-success">Add to cart</button>
+                        </label></br>
+                        <button class="btn btn-default btn-small btn-success">Add to cart</button>
                     </form>
                     <img class="media-object" t-att-src="product.img('image_medium')"/>
                     <div t-field="product.website_description"></div>
@@ -179,7 +179,7 @@
                 <h4>Customers who have bought this item also bought</h4>
                 <div class='row mt16'>
                 <t t-foreach="product.recommended_products()" t-as="product">
-                    <div class='span2 thumbnail'>
+                    <div class='col-md-2 thumbnail'>
                         <a t-attf-href="/shop/product/#{ product.id }/">
                             <div class='mt16 text-center'>
                                 <img t-att-src="product.img('image_small')"/>
@@ -199,7 +199,7 @@
         <t t-call="website_sale.layout">
             <t t-set="title">My cart</t>
             <t t-set="shop_content">
-                <div class="span8 oe_mycart">
+                <div class="col-md-8 oe_mycart">
                     <h2>My Shopping Cart</h2>
                     <table class='table' id="mycart_products">
                         <colgroup>
@@ -237,8 +237,8 @@
                                     <td>
                                         <div class="mb8 mt8 pull-right">
                                             <input type="text" class="js_quantity input-mini" t-att-data-id="line.product_id.id" t-att-value="line.product_uom_qty"/>
-                                            <a t-attf-href="./remove_cart/#{ line.product_id.id }/" class="btn mb8 btn-small btn-inverse">-</a>
-                                            <a t-attf-href="./add_cart/#{ line.product_id.id }/" class="btn mb8 btn-small btn-success">+</a>
+                                            <a t-attf-href="./remove_cart/#{ line.product_id.id }/" class="btn btn-default mb8 btn-small btn-inverse">-</a>
+                                            <a t-attf-href="./add_cart/#{ line.product_id.id }/" class="btn btn-default mb8 btn-small btn-success">+</a>
                                         </div>
                                     </td>
                                 </tr>
@@ -258,7 +258,7 @@
                             <tr> <th colspan="3"><h4>Total</h4></th> <th><h4><t t-esc="order and order.amount_total or 0"/> €</h4></th></tr>
                         </thead>
                     </table>
-                    <a t-if="order and order.order_line" href="/shop/checkout/" class="btn btn-success">Proceed To Payment</a>
+                    <a t-if="order and order.order_line" href="/shop/checkout/" class="btn btn-default btn-success">Proceed To Payment</a>
                 </div>
             </t>
         </t>
@@ -288,7 +288,7 @@
                             </td>
                             <td>
                                 <div class="pull-right">
-                                    <a t-attf-href="./add_cart/#{ product.id }/" class="btn btn-small btn-success">+</a>
+                                    <a t-attf-href="./add_cart/#{ product.id }/" class="btn btn-default btn-small btn-success">+</a>
                                 </div>
                             </td>
                         </tr>
@@ -303,7 +303,7 @@
                 <h4>Suggested products</h4>
                 <div class='row mt16'>
                 <t t-foreach="suggested_products" t-as="product">
-                    <div class='span2 thumbnail'>
+                    <div class='col-md-2 thumbnail'>
                         <a t-attf-href="/shop/product/#{ product.id }/">
                             <div class='mt16 text-center'>
                                 <img t-att-src="product.img('image_small')"/>
@@ -337,7 +337,7 @@
             <t t-set="title">Shop - Checkout</t>
             <div class="container mt48 oe_website_sale">
                 <div class="row">
-                    <div class="span4">
+                    <div class="col-md-4">
                         <table class="table table-condensed">
                             <thead>
                                 <tr>
@@ -362,54 +362,55 @@
                             </tfoot>
                         </table>
                     </div>
-                    <form class="span8 form-horizontal" action="/shop/confirm_order/" method="post">
+                    <form class="col-md-8 form-horizontal" action="/shop/confirm_order/" method="post">
                         <div class=" row">
-                            <a t-if="not partner" t-attf-href="/admin#action=redirect&amp;url=#{ host_url }/shop/checkout/" class="btn btn-primary">Log me, I have an account</a>
-                            <h3 class="span8">Billing Information</h3>
-                             <div t-attf-class="control-group #{error.get('name', '')}">
-                                <label class="control-label" for="contact_name">Name and firstname</label>
+                            <a t-if="not partner" t-attf-href="/admin#action=redirect&amp;url=#{ host_url }/shop/checkout/" class="btn btn-default btn-primary">Log me, I have an account</a>
+                            <h3 class="col-md-8">Billing Information</h3>
+                            <div t-attf-class="control-group #{error.get('name', '')}">
+                                <label class="control-label label-default" for="contact_name">Name and firstname</label>
                                 <div class="controls">
-                                    <input type="text" name="name" t-att-value="checkout.get('name', '')"/>
+                                    <input type="text" name="name" t-att-value="checkout.get('name', '')"
+                                    />
                                 </div>
                             </div>
                             <div t-attf-class="control-group #{error.get('phone', '')}">
-                                <label class="control-label" for="contact_name">Telephone</label>
+                                <label class="control-label label-default" for="contact_name">Telephone</label>
                                 <div class="controls">
                                     <input type="tel" name="phone" t-att-value="checkout.get('phone', '')"/>
                                 </div>
                             </div>
                             <div t-attf-class="control-group #{error.get('fax', '')}">
-                                <label class="control-label" for="contact_name">Fax</label>
+                                <label class="control-label label-default" for="contact_name">Fax</label>
                                 <div class="controls">
                                     <input type="tel" name="fax" t-att-value="checkout.get('fax', '')"/>
                                 </div>
                             </div>
                             <div t-attf-class="control-group #{error.get('company', '')}">
-                                <label class="control-label" for="contact_name">Company</label>
+                                <label class="control-label label-default" for="contact_name">Company</label>
                                 <div class="controls">
                                     <input type="tel" name="company" t-att-value="checkout.get('company', '')"/>
                                 </div>
                             </div>
                             <div t-attf-class="control-group #{error.get('email', '')}">
-                                <label class="control-label" for="contact_name">Email address</label>
+                                <label class="control-label label-default" for="contact_name">Email address</label>
                                 <div class="controls">
                                     <input type="tel" name="email" t-att-value="checkout.get('email', '')"/>
                                 </div>
                             </div>
                             <div t-attf-class="control-group #{error.get('street', '')}">
-                                <label class="control-label" for="contact_name">Street</label>
+                                <label class="control-label label-default" for="contact_name">Street</label>
                                 <div class="controls">
                                     <input type="tel" name="street" t-att-value="checkout.get('street', '')"/>
                                 </div>
                             </div>
                             <div t-attf-class="control-group #{error.get('city', '')}">
-                                <label class="control-label" for="contact_name">City</label>
+                                <label class="control-label label-default" for="contact_name">City</label>
                                 <div class="controls">
                                     <input type="tel" name="city" t-att-value="checkout.get('city', '')"/>
                                 </div>
                             </div>
                             <div t-attf-class="control-group #{error.get('state_id', '')}">
-                                <label class="control-label" for="contact_name">State / Province</label>
+                                <label class="control-label label-default" for="contact_name">State / Province</label>
                                 <div class="controls">
                                     <select name="state_id">
                                         <option value="">State / Province...</option>
@@ -420,13 +421,13 @@
                                 </div>
                             </div>
                             <div t-attf-class="control-group #{error.get('zip', '')}">
-                                <label class="control-label" for="contact_name">Zip / Postal Code</label>
+                                <label class="control-label label-default" for="contact_name">Zip / Postal Code</label>
                                 <div class="controls">
                                     <input type="tel" name="zip" t-att-value="checkout.get('zip', '')"/>
                                 </div>
                             </div>
                             <div t-attf-class="control-group #{error.get('country_id', '')}">
-                                <label class="control-label" for="contact_name">Country</label>
+                                <label class="control-label label-default" for="contact_name">Country</label>
                                 <div class="controls">
                                     <select name="country_id">
                                         <option value="">Country...</option>
@@ -438,7 +439,7 @@
                             </div>
                             <div class="control-group checkbox">
                                 <div class="controls">
-                                    <label class="checkbox">
+                                    <label label-default="label-default" class="checkbox">
                                         <input t-if="not shipping" type="checkbox" name="shipping_different"/>
                                         <input t-if="shipping" type="checkbox" name="shipping_different" checked="1"/>
                                         Ship to different address
@@ -447,39 +448,39 @@
                             </div>
                         </div>
                         <div class="js_shipping row" t-att-style="not shipping and 'display:none' or ''">
-                            <h3 class="span8 oe_shipping">Shipping Information</h3>
+                            <h3 class="col-md-8 oe_shipping">Shipping Information</h3>
                              <div t-attf-class="control-group #{error.get('shipping_name', '')}">
-                                <label class="control-label" for="contact_name">Name and firstname</label>
+                                <label class="control-label label-default" for="contact_name">Name and firstname</label>
                                 <div class="controls">
                                     <input type="text" name="shipping_name" t-att-value="checkout.get('shipping_name', '')"/>
                                 </div>
                             </div>
                             <div t-attf-class="control-group #{error.get('shipping_phone', '')}">
-                                <label class="control-label" for="contact_name">Telephone</label>
+                                <label class="control-label label-default" for="contact_name">Telephone</label>
                                 <div class="controls">
                                     <input type="tel" name="shipping_phone" t-att-value="checkout.get('shipping_phone', '')"/>
                                 </div>
                             </div>
                             <div t-attf-class="control-group #{error.get('shipping_fax', '')}">
-                                <label class="control-label" for="contact_name">Fax</label>
+                                <label class="control-label label-default" for="contact_name">Fax</label>
                                 <div class="controls">
                                     <input type="tel" name="shipping_fax" t-att-value="checkout.get('shipping_fax', '')"/>
                                 </div>
                             </div>
                             <div t-attf-class="control-group #{error.get('shipping_street', '')}">
-                                <label class="control-label" for="contact_name">Street</label>
+                                <label class="control-label label-default" for="contact_name">Street</label>
                                 <div class="controls">
                                     <input type="tel" name="shipping_street" t-att-value="checkout.get('shipping_street', '')"/>
                                 </div>
                             </div>
                             <div t-attf-class="control-group #{error.get('shipping_city', '')}">
-                                <label class="control-label" for="contact_name">City</label>
+                                <label class="control-label label-default" for="contact_name">City</label>
                                 <div class="controls">
                                     <input type="tel" name="shipping_city" t-att-value="checkout.get('shipping_city', '')"/>
                                 </div>
                             </div>
                             <div t-attf-class="control-group #{error.get('shipping_state_id', '')}">
-                                <label class="control-label" for="contact_name">State / Province</label>
+                                <label class="control-label label-default" for="contact_name">State / Province</label>
                                 <div class="controls">
                                     <select name="shipping_state_id">
                                         <option value="">State / Province...</option>
@@ -490,13 +491,13 @@
                                 </div>
                             </div>
                             <div t-attf-class="control-group #{error.get('shipping_zip', '')}">
-                                <label class="control-label" for="contact_name">Zip / Postal Code</label>
+                                <label class="control-label label-default" for="contact_name">Zip / Postal Code</label>
                                 <div class="controls">
                                     <input type="tel" name="shipping_zip" t-att-value="checkout.get('shipping_zip', '')"/>
                                 </div>
                             </div>
                             <div t-attf-class="control-group #{error.get('shipping_country_id', '')}">
-                                <label class="control-label" for="contact_name">Country</label>
+                                <label class="control-label label-default" for="contact_name">Country</label>
                                 <div class="controls">
                                     <select name="shipping_country_id">
                                         <option value="">Country...</option>
@@ -523,7 +524,7 @@
             <t t-set="title">Shop - Payment</t>
             <div class="container mt48 oe_website_sale">
                 <div class="row">
-                    <div class="span4">
+                    <div class="col-md-4">
                         <table class="table table-condensed" t-if="order">
                             <thead>
                                 <tr>
@@ -548,10 +549,10 @@
                             </tfoot>
                         </table>
                     </div>
-                    <div class="span8">
+                    <div class="col-md-8">
                         <div class="js_payment row">
-                            <h3 class="span8">Click on your payment method</h3>
-                            <div class="span2">
+                            <h3 class="col-md-8">Click on your payment method</h3>
+                            <div class="col-md-2">
                                 <t t-foreach="payments or []" t-as="payment">
                                     <label>
                                         <input t-att-value="payment.id" type="radio" name="payment_type"/> <t t-esc="payment.name"/>
@@ -559,7 +560,7 @@
                                 </t>
                             </div>
                             <t t-foreach="payments or []" t-as="payment">
-                                <div t-att-data-id="payment.id" t-raw="payment._content" class="hidden span6"/>
+                                <div t-att-data-id="payment.id" t-raw="payment._content" class="hidden col-md-6"/>
                             </t>
                             <a href="/shop/payment_validate/" class="hidden btn">I validate my payment</a>
                         </div>