1 files changed, 14 insertions, 4 deletions

diff --git a/viewer/src/views/GalleryDirectory.vue b/viewer/src/views/GalleryDirectory.vue
index bed1664..1dda027 100644
--- a/viewer/src/views/GalleryDirectory.vue
+++ b/viewer/src/views/GalleryDirectory.vue
@@ -1,20 +1,30 @@
 <template>
   <div>
     <strong>Directory: {{directory.path}}</strong>
-    <div v-for="(item, index) in directory.properties.items" :key="item.path">
-      <router-link :to="item.path">Thumbnail: {{index}}-{{item.path}}</router-link>
+    <div class="flex-thumbnails">
+      <div v-for="(item) in directory.properties.items" :key="item.path">
+        <router-link :to="item.path">
+          <gallery-thumbnail :item="item" />
+        </router-link>
+      </div>
     </div>
   </div>
 </template>
 
 <script lang="ts">
 import { Component, Vue, Prop } from "vue-property-decorator";
+import GalleryThumbnail from "./GalleryThumbnail.vue";
 
-@Component
+@Component({
+  components: { GalleryThumbnail },
+})
 export default class GalleryDirectory extends Vue {
-  @Prop({ type: Array, required: true }) readonly directory!: Gallery.Directory;
+  @Prop({ required: true }) readonly directory!: Gallery.Directory;
 }
 </script>
 
 <style lang="scss">
+.flex-thumbnails {
+  display: flex;
+}
 </style>