add number text on slideshow, refactor names

assets/scss/snap-gallery.scss

@@ -1,6 +1,7 @@
 $gap: var(--gap);
 
-.snap-gallery-wrapper, .snap-slideshow-wrapper {
+.snap-gallery,
+.snap-slideshow {
   margin-bottom: $gap;
 
   /* Create equal columns in flexbox */
@@ -19,14 +20,14 @@ $gap: var(--gap);
   }
 }
 
-.snap-gallery-wrapper {
+.snap-gallery {
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
   gap: $gap;
 }
 
-.snap-slideshow-wrapper {
+.snap-slideshow {
 
   // Hide all contained images except the first
   .snap-image:not(:first-child) {
@@ -85,16 +86,6 @@ $gap: var(--gap);
   max-height: 80%;
   height: 100%;
 
-  /* Number text (1/3 etc) */
-  .numbertext {
-    color: #f2f2f2;
-    background-color: #000;
-    font-size: 12px;
-    padding: 8px 12px;
-    position: absolute;
-    top: 10%;
-  }
-
   img {
     max-height: 100%;
   }
@@ -107,6 +98,18 @@ $gap: var(--gap);
   }
 }
 
+/* Number text (1/3 etc) */
+.snap-lightbox,
+.snap-slideshow {
+  .numbertext {
+    color: #f2f2f2;
+    background-color: #000;
+    font-size: 12px;
+    padding: 8px 12px;
+    position: absolute;
+  }
+}
+
 // /* Caption text */
 // .caption-container {
 //   text-align: center;