@asd20/ui 3.2.555 → 3.2.556

package/package.json

@@ -5,7 +5,7 @@
     "*.scss",
     "*.vue"
   ],
-  "version": "3.2.555",
+  "version": "3.2.556",
   "private": false,
   "license": "MIT",
   "repository": {

package/src/components/molecules/Asd20Swipe/index.vue

@@ -24,6 +24,11 @@
             }"
           ></span>
         </div>
+        <div class="asd20-swipe__download">
+          <button @click.stop.prevent="download" name="Download">
+            <span><b>↓ Download</b></span>
+          </button>
+        </div>
       </slot>
     </div>
     <div v-if="showArrows && childLen > 1" class="asd20-swipe__arrows">
@@ -77,6 +82,10 @@ export default {
       type: Number,
       default: 0,
     },
+    imageThumbnails: {
+      type: Array,
+      default: () => [],
+    },
   },
   data() {
     return {
@@ -324,6 +333,9 @@ export default {
         this.diff = -this.wrapWidth * this.cur
       }
     },
+    download() {
+      window.open(this.imageThumbnails[this.index].url, '_blank')
+    },
   },
 }
 </script>
@@ -341,11 +353,14 @@ export default {
   }
   &__indicator {
     position: absolute;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    flex-shrink: 1;
     bottom: 0;
     left: 0;
     right: 0;
-    display: flex;
-    justify-content: center;
+    align-items: center;
     &__list {
       display: flex;
       justify-content: center;
@@ -353,6 +368,8 @@ export default {
       width: auto;
       background: rgba(255, 255, 255, 0.6);
       border-radius: 1rem;
+      width: min-content;
+      margin-bottom: 0.25rem;
     }
     &__item {
       display: inline-block;
@@ -362,6 +379,24 @@ export default {
       border-radius: 50%;
     }
   }
+  &__download {
+    z-index: 20000;
+    margin-bottom: 0.25rem;
+    :hover {
+      background: rgba(255, 255, 255, 0.8);
+    }
+    button {
+      border-radius: 0.75rem;
+      background: rgba(255, 255, 255, 0.6);
+      height: 1.5rem;
+      width: 6rem;
+      border: none;
+      padding: 0.25rem;
+      :hover {
+        background: rgba(255, 255, 255, 0);
+      }
+    }
+  }
   &__arrows {
     position: absolute;
     left: 0;

package/src/components/organisms/Asd20ImageGallery/index.vue

@@ -35,6 +35,7 @@
         @click.native="showSlideshow = false"
         @keyup.esc.native="showSlideshow = false"
         :change-index="selectedIndex"
+        :imageThumbnails="imageThumbnails"
       >
         <asd20-swipe-item
           v-for="(image, index) in imageThumbnails"
@@ -202,7 +203,7 @@ export default {
   .text-overlay {
     position: absolute;
     display: block;
-    bottom: space(2.25);
+    bottom: space(2.5);
     color: #fff;
     background: rgba(50, 50, 50, 0.7);
     padding: space(0.5);

package/src/components/organisms/Asd20PageHeader/index.vue

@@ -219,7 +219,12 @@ export default {
   methods: {
     goBack() {
       if (typeof window === 'undefined') return
-      this.returnURL = document.referrer
+      if (document.referrer === undefined) {
+        const currentURL = new URL(window.location.href)
+        this.returnURL = currentURL.origin
+      } else {
+        this.returnURL = document.referrer
+      }
       // window.history.back()
       // const url = window.location.href
       // return url.slice(0, url.lastIndexOf('/'))