change css of the size info popup for mobile version

This commit is contained in:
Rodney Figaro 2016-08-23 12:06:39 +02:00
parent 2a2949882d
commit b95db0bb8c
3 changed files with 48 additions and 14 deletions

View File

@ -3878,7 +3878,8 @@ body#index .jqibuttons span.gradient{
cursor: pointer;
display: none;
}
.box_add_to_cart{
.box_add_to_cart,
.box_info_size {
display: none;
box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.1);
position: fixed;
@ -3891,13 +3892,15 @@ body#index .jqibuttons span.gradient{
margin-left: -150px;
padding: 20px;
}
.box_add_to_cart .close{
.box_add_to_cart .close,
.box_info_size .close {
position: absolute;
right: 26px;
top: 26px;
cursor: pointer;
}
.box_add_to_cart .content{
.box_add_to_cart .content,
.box_info_size .content {
background: #fff;
padding: 15px;
}
@ -3944,7 +3947,7 @@ body#index .jqibuttons span.gradient{
font-size: 20px;
color: #e36ea2;
}
.box_add_to_cart .content .others_links{
.box_add_to_cart .content .others_links {
border-top: 1px solid #ccc;
padding-top: 15px;
clear: both;
@ -3984,10 +3987,12 @@ body#index .jqibuttons span.gradient{
display: block;
display: block;
}
.box_add_to_cart .content .others_links .show_fdp_info{
.box_add_to_cart .content .others_links .show_fdp_info,
.box_info_size .content .innerbox_info .show_size_info {
font-size: 11px; padding-top: 10px
}
.box_add_to_cart .content .others_links .show_cart{
.box_add_to_cart .content .others_links .show_cart {
display: block;
clear: both;
color: #FFF;
@ -4006,7 +4011,7 @@ body#index .jqibuttons span.gradient{
background-size: 10%;
}
.box_add_to_cart .content_best_sales{
.box_add_to_cart .content_best_sales {
display: none;
overflow: auto;
background: #eaeaea;
@ -4847,10 +4852,14 @@ body#product #best-sellers_block_product{
background: url("../img/cart.png") no-repeat left 12px center #504D8B;
background-size: 10%;
}
.box_add_to_cart .content .others_links .show_fdp_info {
.box_add_to_cart .content .others_links .show_fdp_info,
.box_info_size .content .innerbox_info .show_info_size {
text-align: center;
font-size: 13px;
}
.box_info_size .content .innerbox_info .show_info_size {
padding-top : 25px;
}
#product .help_tailles {
background: url('../img/aide-contact.png') no-repeat left center;
@ -4858,6 +4867,7 @@ body#product #best-sellers_block_product{
display:inline-block;
}
/*
#product .info_tailles {
background: url("../img/bg_help_size_bottom.png") no-repeat;
height: 170px;
@ -4879,3 +4889,4 @@ body#product #best-sellers_block_product{
text-align: justify;
width: 200px;
}
*/

View File

@ -494,9 +494,23 @@ $(document).ready(function()
});
}
$('.tailles').click(function() {
$('.info_tailles').toggle();
$('.tailles').click(function(e) {
$('.box_info_size').css({
'position' : 'fixed',
'top' : '50%',
'margin-top': -$('.box_info_size').outerHeight()/2
});
$('.info_tailles').stop(true, true).fadeIn();
});
var closeInfoSize = function() {
$('.overlay_bbb').fadeOut();
$('.box_info_size').fadeOut();
}
$('.box_info_size .close').click(closeInfoSize);
$('.overlay_bbb').click(closeInfoSize);
});
function saveCustomization()

View File

@ -317,10 +317,19 @@ var fieldRequired = '{l s='Please fill in all required fields, then save the cus
:</label>
{if $id_attribute_group == '1' || $id_attribute_group == '5'}
<div class="info_tailles" style="display:none">
<p>
{l s='La taille affichée correspond au standard français. Elle peut différer de la taille inscrite sur l\'emballage du produit.'}
</p>
<div class="info_tailles overlay_bbb" style="display:none"></div>
<div class="info_tailles box_info_size" style="display:none">
<div class="content">
<div class="close" id="close_add_to_cart">
<img src="{$img_dir}/close.jpg" alt="{l s='Fermer la fenètre'}">
</div>
<div class="innerbox_info">
<p class="show_info_size">
{l s='La talla indicada corresponde a los estándares españoles. En ocasiones, puede ser diferente de la talla que aparezca en el envoltorio del producto (talla europea).'}
</p>
</div>
</div>
</div>
{/if}