tmdinosaurcenter
/
tainacan
mirror of https://github.com/tainacan/tainacan
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Fixes wrong duplication of slides on auto play mode. Adjusts alignment of arrows when no title or name is displayed on carousels.

This commit is contained in:
Mateus Machado Luna 2019-08-27 10:54:23 -03:00
parent f231eb2637
commit d12f9a31a0
9 changed files with 32 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/assets/css/tainacan-gutenberg-block-carousel-collections-list.css
View File

@ -327,14 +327,14 @@
.wp-block-tainacan-carousel-collections-list .tainacan-carousel.has-arrows-left .swiper-button-next {
left: 10px;
right: auto;
top: calc(50% + 36px); }
top: calc(50% + 12px) !important; }
.wp-block-tainacan-carousel-collections-list .collections-list-edit-container.has-arrows-right .swiper-button-prev,
.wp-block-tainacan-carousel-collections-list .tainacan-carousel.has-arrows-right .swiper-button-prev {
right: 10px;
left: auto; }
.wp-block-tainacan-carousel-collections-list .collections-list-edit-container.has-arrows-right .swiper-button-next,
.wp-block-tainacan-carousel-collections-list .tainacan-carousel.has-arrows-right .swiper-button-next {
top: calc(50% + 36px); }
top: calc(50% + 12px) !important; }
.wp-block-tainacan-carousel-collections-list ul.collections-list-edit {
display: flex;
align-items: flex-start;

2
src/assets/css/tainacan-gutenberg-block-carousel-collections-list.css.map
View File

File diff suppressed because one or more lines are too long

4
src/assets/css/tainacan-gutenberg-block-carousel-items-list.css
View File

@ -323,14 +323,14 @@
.wp-block-tainacan-carousel-items-list .tainacan-carousel.has-arrows-left .swiper-button-next {
left: 10px;
right: auto;
top: calc(50% + 36px); }
top: calc(50% + 12px) !important; }
.wp-block-tainacan-carousel-items-list .items-list-edit-container.has-arrows-right .swiper-button-prev,
.wp-block-tainacan-carousel-items-list .tainacan-carousel.has-arrows-right .swiper-button-prev {
right: 10px;
left: auto; }
.wp-block-tainacan-carousel-items-list .items-list-edit-container.has-arrows-right .swiper-button-next,
.wp-block-tainacan-carousel-items-list .tainacan-carousel.has-arrows-right .swiper-button-next {
top: calc(50% + 36px); }
top: calc(50% + 12px) !important; }
.wp-block-tainacan-carousel-items-list ul.items-list-edit {
display: flex;
align-items: flex-start;

2
src/assets/css/tainacan-gutenberg-block-carousel-items-list.css.map
View File

File diff suppressed because one or more lines are too long

6
src/gutenberg-blocks/tainacan-collections/carousel-collections-list/carousel-collections-list-theme.js
View File

@ -22,7 +22,7 @@ document.addEventListener("DOMContentLoaded", () => {
autoPlay: false,
autoPlaySpeed: 3,
loopSlides: false,
hideTitle: true,
hideName: true,
showCollectionThumbnail: false,
tainacanApiRoot: '',
tainacanBaseUrl: '',
@ -38,7 +38,7 @@ document.addEventListener("DOMContentLoaded", () => {
autoPlay: this.autoPlay,
autoPlaySpeed: this.autoPlaySpeed,
loopSlides: this.loopSlides,
hideTitle: this.hideTitle,
hideName: this.hideName,
showCollectionThumbnail: this.showCollectionThumbnail,
tainacanApiRoot: this.tainacanApiRoot,
tainacanBaseUrl: this.tainacanBaseUrl,
@ -54,7 +54,7 @@ document.addEventListener("DOMContentLoaded", () => {
this.autoPlay = this.$el.attributes['auto-play'] != undefined ? this.$el.attributes['auto-play'].value == 'true' : false;
this.autoPlaySpeed = this.$el.attributes['auto-play-speed'] != undefined ? this.$el.attributes['auto-play-speed'].value : 3;
this.loopSlides = this.$el.attributes['loop-slides'] != undefined ? this.$el.attributes['loop-slides'].value == 'true' : false;
this.hideTitle = this.$el.attributes['hide-title'] != undefined ? this.$el.attributes['hide-title'].value == 'true' : false;
this.hideName = this.$el.attributes['hide-name'] != undefined ? this.$el.attributes['hide-name'].value == 'true' : false;
this.showCollectionThumbnail = this.$el.attributes['show-collection-thumbnail'] != undefined ? this.$el.attributes['show-collection-thumbnail'].value == 'true' : false;
this.tainacanApiRoot = this.$el.attributes['tainacan-api-root'] != undefined ? this.$el.attributes['tainacan-api-root'].value : undefined;
this.tainacanBaseUrl = this.$el.attributes['tainacan-base-url'] != undefined ? this.$el.attributes['tainacan-base-url'].value : undefined;

14
src/gutenberg-blocks/tainacan-collections/carousel-collections-list/carousel-collections-list-theme.vue
View File

@ -86,7 +86,8 @@
<button
class="swiper-button-prev"
:id="blockId + '-prev'"
slot="button-prev">
slot="button-prev"
:style="hideName ? 'top: calc(50% - 21px)' : 'top: calc(50% - 42px)'">
<svg
width="42"
height="42"
@ -100,7 +101,8 @@
<button
class="swiper-button-next"
:id="blockId + '-next'"
slot="button-next">
slot="button-next"
:style="hideName ? 'top: calc(50% - 21px)' : 'top: calc(50% - 42px)'">
<svg
width="42"
height="42"
@ -119,7 +121,7 @@
</div>
<!-- Swiper buttons are hidden as they actually swipe from slide to slide -->
</div>
<div v-else>
<div v-else-if="isLoading && !autoPlay">
<div :class="'tainacan-carousel has-arrows-' + arrowsPosition">
<swiper
role="list"
@ -139,7 +141,8 @@
<button
class="swiper-button-prev"
:id="blockId + '-prev'"
slot="button-prev">
slot="button-prev"
:style="hideName ? 'top: calc(50% - 21px)' : 'top: calc(50% - 42px)'">
<svg
width="42"
height="42"
@ -153,7 +156,8 @@
<button
class="swiper-button-next"
:id="blockId + '-next'"
slot="button-next">
slot="button-next"
:style="hideName ? 'top: calc(50% - 21px)' : 'top: calc(50% - 42px)'">
<svg
width="42"
height="42"

4
src/gutenberg-blocks/tainacan-collections/carousel-collections-list/carousel-collections-list.scss
View File

@ -223,14 +223,14 @@
&.has-arrows-left .swiper-button-next {
left: 10px;
right: auto;
top: calc(50% + 36px);
top: calc(50% + 12px) !important;
}
&.has-arrows-right .swiper-button-prev {
right: 10px;
left: auto;
}
&.has-arrows-right .swiper-button-next {
top: 50%;
top: calc(50% + 12px) !important;
}
}
ul.collections-list-edit {

15
src/gutenberg-blocks/tainacan-items/carousel-items-list/carousel-items-list-theme.vue
View File

@ -86,7 +86,8 @@
<button
class="swiper-button-prev"
:id="blockId + '-prev'"
slot="button-prev">
slot="button-prev"
:style="hideTitle ? 'top: calc(50% - 21px)' : 'top: calc(50% - 42px)'">
<svg
width="42"
height="42"
@ -100,7 +101,8 @@
<button
class="swiper-button-next"
:id="blockId + '-next'"
slot="button-next">
slot="button-next"
:style="hideTitle ? 'top: calc(50% - 21px)' : 'top: calc(50% - 42px)'">
<svg
width="42"
height="42"
@ -119,11 +121,12 @@
</div>
<!-- Swiper buttons are hidden as they actually swipe from slide to slide -->
</div>
<div v-else>
<div v-else-if="isLoading && !autoPlay">
<div :class="'tainacan-carousel has-arrows-' + arrowsPosition">
<swiper
role="list"
:options="swiperOptions"
ref="myItemSwiperSkeleton"
:style="{
marginTop: showCollectionHeader ? '1.35rem' : '0px'
}">
@ -142,7 +145,8 @@
<button
class="swiper-button-prev"
:id="blockId + '-prev'"
slot="button-prev">
slot="button-prev"
:style="hideTitle ? 'top: calc(50% - 21px)' : 'top: calc(50% - 42px)'">
<svg
width="42"
height="42"
@ -156,7 +160,8 @@
<button
class="swiper-button-next"
:id="blockId + '-next'"
slot="button-next">
slot="button-next"
:style="hideTitle ? 'top: calc(50% - 21px)' : 'top: calc(50% - 42px)'">
<svg
width="42"
height="42"

4
src/gutenberg-blocks/tainacan-items/carousel-items-list/carousel-items-list.scss
View File

@ -206,14 +206,14 @@
&.has-arrows-left .swiper-button-next {
left: 10px;
right: auto;
top: calc(50% + 36px);
top: calc(50% + 12px) !important;
}
&.has-arrows-right .swiper-button-prev {
right: 10px;
left: auto;
}
&.has-arrows-right .swiper-button-next {
top: calc(50% + 36px);
top: calc(50% + 12px) !important;
}
}
ul.items-list-edit {