💄 Site > Preview > Add style

site/src/components/file/style.styl

@@ -5,7 +5,6 @@
     left 315px
     right 0
     height 100%
-    background rgba(0, 255, 0, 0.3)
 
 header
     position absolute
@@ -110,4 +109,27 @@ header
         letter-spacing 0.25px
 
         .directory
-            opacity 0.3
+            opacity 0.3
+
+.preview
+    position absolute
+    top 50px
+    right 0
+    bottom 0
+    left 0
+    background #2d2d49
+    text-align center
+
+    .inner
+        display flex
+        align-items center
+        justify-content center
+        position absolute
+        top 50px
+        right 50px
+        bottom 50px
+        left 50px
+
+    img
+        max-width 100%
+        max-height 100%

site/src/components/file/template.html

@@ -35,7 +35,9 @@
 
     <!-- Preview -->
     <div class="preview" v-if="isImage">
-        <img :src="downloadUrl">
+        <div class="inner">
+            <img :src="downloadUrl">
+        </div>
     </div>
 
     <!-- Can't read -->