@mixd-id/web-scaffold 0.1.230406208 → 0.1.230406210

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@mixd-id/web-scaffold",
   "private": false,
-  "version": "0.1.230406208",
+  "version": "0.1.230406210",
   "scripts": {
     "dev": "vite serve",
     "build": "vite build",

package/src/components/Carousel.vue

@@ -51,11 +51,6 @@ export default{
 			default: false
 		},
 
-		gap: {
-			type: Array,
-			default: [ '0' ]
-		},
-
 		ratio: Array,
 
 		autoPlay: [ Number, String ],
@@ -84,15 +79,6 @@ export default{
 			]
 				.filter(_ => _)
 				.join(' ')
-		},
-
-		gaps(){
-			if(!this.gap) return []
-
-			return [
-				this.gap[0] ? this.gap[0] : '',
-				this.gap[1] ? this.gap[1] : (this.gap[0] ? this.gap[0] : '')
-			]
 		}
 
 	},
@@ -150,18 +136,13 @@ export default{
 					left += item.clientWidth
 			}
 
-			const paddingRight = parseInt(window.getComputedStyle(this.$refs.inner)['padding-right'])
-			if(index === this.$refs.inner.children.length - 1){
-				left -= paddingRight
-			}
-			else if(index === 0){
-			}
-			else{
-				left -= Math.round(paddingRight / 2)
-			}
+      const gapPx = parseInt(window.getComputedStyle(this.$refs.inner).getPropertyValue('column-gap'))
+      left += gapPx
 
 			left *= -1
 
+      console.log('left', left)
+
 			if(!noAnimation){
 				this.$el.firstElementChild.addEventListener('transitionend', function(){
 					this.classList.remove('transition-carousel')
@@ -218,13 +199,13 @@ export default{
       const dy = sy - this._props['sy']
 
       if(!this._props['direction']){
-        if(Math.abs(dy) > 3){
-          this._props['direction'] = 'vertical'
-        }
-        else if(Math.abs(dx) > 3){
+        if(Math.abs(dx) > 3){
           this._props['direction'] = 'horizontal'
           this.swiping = true
         }
+        else if(Math.abs(dy) > 3){
+          this._props['direction'] = 'vertical'
+        }
       }
       else if(this._props['direction'] === 'horizontal'){
         let ix
@@ -352,10 +333,6 @@ export default{
 	vertical-align: top;
 }
 
-.item{
-	padding-right: v-bind(gaps[0])
-}
-
 .legend{
 	@apply flex justify-center gap-2 py-1;
 }