add attachment counter

src/components/media_modal/media_modal.vue

@@ -65,6 +65,11 @@
     >
       {{ description }}
     </span>
+    <span
+      class="counter"
+    >
+      {{ currentIndex + 1 }} / {{ media.length }}
+    </span>
     <span
       v-if="loading"
       class="loading-spinner"
@@ -110,15 +115,22 @@
     }
   }
 
+  .description,
+  .counter {
     /* Hardcoded since background is also hardcoded */
-  .description {
     color: white;
     margin-top: 1em;
     text-shadow: 0 0 10px black, 0 0 10px black;
+    padding: 0.2em 2em;
+  }
+
+  .description {
+    flex: 0 0 auto;
+    overflow-y: auto;
+    min-height: 1em;
     max-width: 500px;
     max-height: 9.5em;
-    overflow-y: auto;
-    padding: 0 2em;
+    word-break: break-all;
   }
 
   .modal-image {
@@ -141,6 +153,7 @@
     display: flex;
     justify-content: center;
     align-items: center;
+
     svg {
       color: white;
     }