[FIX] website_sale: the cart and modal in ecomerce are not responsive for phone
This commit is contained in:
Christophe Matthieu
parent
e4030e2016
commit
414175cb30
|
|
@ -250,6 +250,79 @@
|
|||
height: 760px;
|
||||
}
|
||||
}
|
||||
/* ---- Cart ---- */
|
||||
.oe_cart a span.visible-xs-inline, #modal_optional_products a span.visible-xs-inline {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.oe_cart a span.hidden-xs, #modal_optional_products a span.hidden-xs {
|
||||
display: inline !important;
|
||||
}
|
||||
|
||||
.oe_cart table td:first-child {
|
||||
min-width: 76px;
|
||||
}
|
||||
|
||||
@media (max-width: 992px) {
|
||||
#modal_optional_products table:last-child td:last-child {
|
||||
overflow: hidden;
|
||||
}
|
||||
#modal_optional_products table:last-child td:nth-child(2) {
|
||||
width: 50%;
|
||||
}
|
||||
#modal_optional_products table:last-child td:nth-child(3) {
|
||||
width: 20%;
|
||||
}
|
||||
#modal_optional_products table:last-child td:last-child, #modal_optional_products table:last-child td:nth-last-child(2) {
|
||||
width: 15%;
|
||||
}
|
||||
}
|
||||
@media (max-width: 500px) {
|
||||
.oe_website_sale .oe_website_spinner {
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.oe_cart table, #modal_optional_products table {
|
||||
display: inline-block;
|
||||
}
|
||||
.oe_cart table thead, #modal_optional_products table thead {
|
||||
display: none;
|
||||
}
|
||||
.oe_cart table tbody, .oe_cart table tr, .oe_cart table td, #modal_optional_products table tbody, #modal_optional_products table tr, #modal_optional_products table td {
|
||||
float: left;
|
||||
width: 100% !important;
|
||||
display: inline-block;
|
||||
}
|
||||
.oe_cart table td:first-child, #modal_optional_products table td:first-child {
|
||||
display: none;
|
||||
}
|
||||
.oe_cart table td:nth-child(2), #modal_optional_products table td:nth-child(2) {
|
||||
border-top-style: double;
|
||||
border-top-width: 6px;
|
||||
}
|
||||
.oe_cart table td:last-child, #modal_optional_products table td:last-child {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
.oe_cart table:last-child tr:last-child td:last-child, #modal_optional_products table:last-child tr:last-child td:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.oe_cart table td:last-child, .oe_cart table td:nth-last-child(2), #modal_optional_products table td:last-child, #modal_optional_products table td:nth-last-child(2) {
|
||||
width: 50% !important;
|
||||
height: 46px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#modal_optional_products table:last-child td:nth-child(3) > div {
|
||||
float: none !important;
|
||||
}
|
||||
|
||||
.oe_cart a span.hidden-xs, #modal_optional_products a span.hidden-xs {
|
||||
display: none !important;
|
||||
}
|
||||
.oe_cart a span.visible-xs-inline, #modal_optional_products a span.visible-xs-inline {
|
||||
display: inline !important;
|
||||
}
|
||||
}
|
||||
/* ---- Product list style ---- */
|
||||
@media (min-width: 400px) {
|
||||
.oe_product.oe_list {
|
||||
|
|
|
|||
|
|
@ -215,6 +215,58 @@
|
|||
.oe-height-8
|
||||
height: 760px
|
||||
|
||||
/* ---- Cart ---- */
|
||||
.oe_cart, #modal_optional_products
|
||||
a span.visible-xs-inline
|
||||
display: none !important
|
||||
.oe_cart, #modal_optional_products
|
||||
a span.hidden-xs
|
||||
display: inline !important
|
||||
|
||||
.oe_cart table td:first-child
|
||||
min-width: 76px
|
||||
|
||||
@media (max-width: 992px)
|
||||
#modal_optional_products table:last-child
|
||||
td:last-child
|
||||
overflow: hidden
|
||||
td:nth-child(2)
|
||||
width: 50%
|
||||
td:nth-child(3)
|
||||
width: 20%
|
||||
td:last-child, td:nth-last-child(2)
|
||||
width: 15%
|
||||
@media (max-width: 500px)
|
||||
.oe_website_sale .oe_website_spinner
|
||||
margin: auto
|
||||
.oe_cart table, #modal_optional_products table
|
||||
display: inline-block
|
||||
thead
|
||||
display: none
|
||||
tbody, tr, td
|
||||
float: left
|
||||
width: 100% !important
|
||||
display: inline-block
|
||||
td:first-child
|
||||
display: none
|
||||
td:nth-child(2)
|
||||
border-top-style: double
|
||||
border-top-width: 6px
|
||||
td:last-child
|
||||
margin-bottom: 16px
|
||||
&:last-child tr:last-child td:last-child
|
||||
margin-bottom: 0
|
||||
td:last-child, td:nth-last-child(2)
|
||||
width: 50% !important
|
||||
height: 46px
|
||||
text-align: center
|
||||
#modal_optional_products table:last-child td:nth-child(3) > div
|
||||
float: none !important
|
||||
.oe_cart a, #modal_optional_products a
|
||||
span.hidden-xs
|
||||
display: none !important
|
||||
span.visible-xs-inline
|
||||
display: inline !important
|
||||
/* ---- Product list style ---- */
|
||||
|
||||
@media (min-width: 400px)
|
||||
|
|
|
|||
|
|
@ -721,7 +721,7 @@
|
|||
<t t-call="website_sale.total"/>
|
||||
<div class="clearfix"/>
|
||||
|
||||
<a t-if="not optional_products and website_sale_order and website_sale_order.website_order_line" class="btn btn-primary pull-right mb32" href="/shop/checkout">Process Checkout <span class="fa fa-long-arrow-right"/></a>
|
||||
<a t-if="not optional_products and website_sale_order and website_sale_order.website_order_line" class="btn btn-primary pull-right mb32" href="/shop/checkout"><span class="hidden-xs">Process Checkout</span><span class="visible-xs-inline">Checkout</span> <span class="fa fa-long-arrow-right"/></a>
|
||||
|
||||
<div class="oe_structure"/>
|
||||
</div>
|
||||
|
|
@ -804,7 +804,7 @@
|
|||
|
||||
<template id="continue_shopping" inherit_id="website_sale.cart" customize_show="True" name="Continue Shopping Button">
|
||||
<xpath expr="//a[@href='/shop/checkout']" position="before">
|
||||
<a href="/shop" class="btn btn-default mb32"><span class="fa fa-long-arrow-left"/> Continue Shopping</a>
|
||||
<a href="/shop" class="btn btn-default mb32"><span class="fa fa-long-arrow-left"/> <span class="hidden-xs">Continue Shopping</span><span class="visible-xs-inline">Continue</span></a>
|
||||
</xpath>
|
||||
</template>
|
||||
|
||||
|
|
|
|||
|
|
@ -61,7 +61,7 @@
|
|||
"widget": "monetary",
|
||||
"from_currency": "website.currency_id",
|
||||
"display_currency": "user_id.partner_id.property_product_pricelist.currency_id"
|
||||
}'/><br/>
|
||||
}'/>
|
||||
<span class="oe_price" style="white-space: nowrap;"
|
||||
t-field="product.price"
|
||||
t-field-options='{
|
||||
|
|
@ -138,8 +138,8 @@
|
|||
</table>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<a class="btn btn-default a-submit js_goto_shop"><i class="fa fa-chevron-left"></i> Continue shopping</a>
|
||||
<a class="btn btn-primary pull-right a-submit"><i class="fa fa-shopping-cart fa-fw"></i> Proceed to checkout</a>
|
||||
<a class="btn btn-default a-submit js_goto_shop"><i class="fa fa-chevron-left"></i> <span class="hidden-xs">Continue Shopping</span><span class="visible-xs-inline">Continue</span></a>
|
||||
<a class="btn btn-primary pull-right a-submit"><i class="fa fa-shopping-cart fa-fw"></i> <span class="hidden-xs">Proceed to checkout</span><span class="visible-xs-inline">Checkout</span></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in New Issue