active gallery highlighted

components/GalleryFeatured.vue

@@ -2,6 +2,7 @@
   <ul class="gallery-featured">
     <li v-for="(gallery, index) in galleries"
         class="featured-image thumb-overlay"
+        :class="{ 'is-active': index === galleryActive }"
         :style="{ 'background-image': 'url(' + gallery.featuredImage + ')' }"
         :key="index"
         @click="$emit('clicked', index)">
@@ -95,6 +96,26 @@ export default {
     height: 0;
     padding-top: 100%;
     margin-bottom: 4px;
+
+    &::before {
+      content: '';
+      display: block;
+      position: absolute;
+      width: 100%;
+      height: 100%;
+      top: 0;
+      left: 0;
+
+      transition: opacity 1s;
+      opacity: 0;
+
+      border: 1px solid $color__neutral-700;;
+    }
+
+    &.is-active::before {
+      transition: opacity 2s .2s;
+      opacity: 1;
+    }
   }
 
   .gallery-title {