[FIX] website, website_sale: BS4, adapt carousel controls

Completes https://github.com/odoo/odoo/commit/20d033a782f4d85fdd6f15df68d116b2fd7a7dfd

Closes https://github.com/odoo/odoo/pull/26077
This commit is contained in:
Deep Patel
2018-08-07 10:03:59 +02:00
committed by qsm-odoo
parent 5caa9a46a0
commit 70df0bb586
7 changed files with 21 additions and 23 deletions
+2 -2
View File
@@ -159,10 +159,10 @@ response = request.render("website.template_partner_comment", {
</div>
</div>
</div>
<div class="carousel-control left d-none" data-slide="prev" data-target="#myCarousel0" href="#myCarousel0" style="width: 10%" role="img" aria-label="Previous" title="Previous">
<div class="carousel-control-prev d-none" data-slide="prev" data-target="#myCarousel0" href="#myCarousel0" style="width: 10%" role="img" aria-label="Previous" title="Previous">
<i class="fa fa-chevron-left"/>
</div>
<div class="carousel-control right d-none" data-slide="next" data-target="#myCarousel0" href="#myCarousel0" style="width: 10%" role="img" aria-label="Next" title="Next">
<div class="carousel-control-next d-none" data-slide="next" data-target="#myCarousel0" href="#myCarousel0" style="width: 10%" role="img" aria-label="Next" title="Next">
<i class="fa fa-chevron-right"/>
</div>
</div>
@@ -188,7 +188,7 @@ options.registry.carousel = options.Class.extend({
var cycle = this.$inner.find('.item').length;
var $active = this.$inner.find('.item.active, .item.prev, .item.next').first();
var index = $active.index();
this.$('.carousel-control, .carousel-indicators').removeClass('d-none');
this.$('.carousel-control-prev, .carousel-control-next, .carousel-indicators').removeClass('d-none');
this.$indicators.append('<li data-target="#' + this.id + '" data-slide-to="' + cycle + '"></li>');
var $clone = this.$('.item:first').clone(true);
$clone.removeClass('active').insertAfter($active);
@@ -223,7 +223,7 @@ options.registry.carousel = options.Class.extend({
self._rebindEvents();
self.remove_process = false;
if (cycle === 1) {
self.$target.find('.carousel-control, .carousel-indicators').addClass('d-none');
self.$target.find('.carousel-control-prev, .carousel-control-next, .carousel-indicators').addClass('d-none');
}
});
_.defer(function () {
@@ -258,7 +258,7 @@ options.registry.carousel = options.Class.extend({
*/
_rebindEvents: function () {
var self = this;
this.$target.find('.carousel-control').off('click').on('click', function () {
this.$target.find('.carousel-control-prev, .carousel-control-next').off('click').on('click', function () {
self.$target.carousel($(this).data('slide'));
});
this.$target.find('.carousel-indicators [data-slide-to]').off('click').on('click', function () {
+8 -10
View File
@@ -190,7 +190,7 @@ table.table_desc tr td {
.item {
height: 100%;
}
.carousel-control {
.carousel-control-prev, .carousel-control-next {
cursor: pointer;
span {
top: 50%;
@@ -199,8 +199,8 @@ table.table_desc tr td {
}
}
}
.carousel .carousel-control {
&.left {
.carousel {
.carousel-control-prev {
left: -10px;
* {
position: absolute;
@@ -209,7 +209,7 @@ table.table_desc tr td {
right: 50%;
}
}
&.right {
.carousel-control-next {
right: -10px;
* {
position: absolute;
@@ -439,11 +439,9 @@ div.carousel .container {
}
}
.carousel-control {
&.right, &.left {
background-image: none;
background-color: transparent;
}
.carousel-control-next, .carousel-control-prev {
background-image: none;
background-color: transparent;
}
}
}
@@ -461,7 +459,7 @@ div.carousel {
max-height: 95%;
padding: 10px;
}
.carousel-control {
.carousel-control-prev, .carousel-control-next {
cursor: pointer;
}
}
@@ -27,8 +27,8 @@
<li class="fa fa-chevron-right o_indicators_right" style="overflow: hidden; padding: 12px; border: 0;" aria-label="Next" title="Next"></li>
</ul>
<a class="carousel-control left" t-attf-href="##{id}" data-slide="prev" aria-label="Previous" title="Previous"><span class="fa fa-chevron-left"/></a>
<a class="carousel-control right" t-attf-href="##{id}" data-slide="next" aria-label="Next" title="Next"><span class="fa fa-chevron-right"/></a>
<a class="carousel-control-prev" t-attf-href="##{id}" data-slide="prev" aria-label="Previous" title="Previous"><span class="fa fa-chevron-left"/></a>
<a class="carousel-control-next" t-attf-href="##{id}" data-slide="next" aria-label="Next" title="Next"><span class="fa fa-chevron-right"/></a>
</div>
</t>
+2 -2
View File
@@ -36,8 +36,8 @@
</div>
</div>
</div>
<div class="carousel-control left d-none" data-target="#myCarousel" data-slide="prev" style="width: 10%" role="img" aria-label="Previous" title="Previous"><i class="fa fa-chevron-left"></i></div>
<div class="carousel-control right d-none" data-target="#myCarousel" data-slide="next" style="width: 10%" role="img" aria-label="Next" title="Next"><i class="fa fa-chevron-right"></i></div>
<div class="carousel-control-prev d-none" data-target="#myCarousel" data-slide="prev" style="width: 10%" role="img" aria-label="Previous" title="Previous"><i class="fa fa-chevron-left"></i></div>
<div class="carousel-control-next d-none" data-target="#myCarousel" data-slide="next" style="width: 10%" role="img" aria-label="Next" title="Next"><i class="fa fa-chevron-right"></i></div>
</div>
</template>
@@ -725,14 +725,14 @@ a.no-decoration {
}
#o-carousel-product {
.carousel-inner div.item, .carousel-control {
.carousel-inner div.item, .carousel-control-prev, .carousel-control-next {
height: 400px;
}
.carousel-inner div.item img {
max-height: 100%;
}
.carousel-control {
.carousel-control-prev, carousel-control-next {
background-image: none !important;
}
+2 -2
View File
@@ -437,10 +437,10 @@
</div>
<t t-if="len(image_ids) or variant_img">
<a class="carousel-control left" href="#o-carousel-product" role="button" data-slide="prev" >
<a class="carousel-control-prev" href="#o-carousel-product" role="button" data-slide="prev" >
<span class="fa fa-chevron-left" role="img" aria-label="Previous" title="Previous"/>
</a>
<a class="carousel-control right" href="#o-carousel-product" role="button" data-slide="next">
<a class="carousel-control-next" href="#o-carousel-product" role="button" data-slide="next">
<span class="fa fa-chevron-right" role="img" aria-label="Next" title="Next"/>
</a>
</t>