diff --git a/src/assets/css/channel.scss b/src/assets/css/channel.scss
index 9f306ee..c34efc9 100644
--- a/src/assets/css/channel.scss
+++ b/src/assets/css/channel.scss
@@ -207,6 +207,9 @@
     &:hover {
       opacity: 0.7;
     }
+    & .zip {
+      color: #0060e5;
+    }   
   }
 
   .swipeable-thumbnails-view {
diff --git a/src/assets/css/chat.scss b/src/assets/css/chat.scss
index 4fae2ca..63c895c 100644
--- a/src/assets/css/chat.scss
+++ b/src/assets/css/chat.scss
@@ -1610,4 +1610,8 @@ body {
   height: $small-button-height !important;
   margin-top: $chat-standard-padding-xs;
   margin-bottom: $chat-standard-padding-xs;
-}
\ No newline at end of file
+}
+
+.thumbnail-item .zip {
+  color: #1d1d1d;
+}
diff --git a/src/assets/icons/ic_zip.vue b/src/assets/icons/ic_zip.vue
index a58cdeb..c5439eb 100644
--- a/src/assets/icons/ic_zip.vue
+++ b/src/assets/icons/ic_zip.vue
@@ -3,6 +3,6 @@
         <rect width="56" height="56" rx="13" fill="#FCFCFC" />
         <path
             d="M30.5667 36.6733C30.5667 38.8627 25.4307 38.8453 25.4307 36.6773C25.4307 34.4267 30.5667 34.3747 30.5667 36.6733ZM44 18.6667V37.3333C44 41.0147 41.016 44 37.3333 44H18.6667C14.984 44 12 41.0147 12 37.3333V18.6667C12 14.9853 14.984 12 18.6667 12H37.3333C41.016 12 44 14.9853 44 18.6667ZM25.3333 21.3333H30.6667V20H25.3333V21.3333ZM25.3333 18.6667H30.6667V17.3333H25.3333V18.6667ZM25.3333 16H30.6667V14.6667H25.3333V16ZM25.3333 24H30.6667V22.6667H25.3333V24ZM25.3333 26.6667H30.6667V25.3333H25.3333V26.6667ZM32.1573 35.7147C31.64 33.056 30.668 28 30.668 28H25.3347C25.3347 28 24.3907 32.944 23.8453 35.7147C23.3053 38.4493 25.2173 40 28.0013 40C30.788 40 32.6893 38.4467 32.1573 35.7147Z"
-            fill="#1D1D1D" />
+            fill="currentColor" />
     </svg>
 </template>
\ No newline at end of file
diff --git a/src/components/Chat.vue b/src/components/Chat.vue
index c6bc948..76de6bc 100644
--- a/src/components/Chat.vue
+++ b/src/components/Chat.vue
@@ -1601,7 +1601,7 @@ export default {
      * @param {*} element Root element for the chat message.
      */
     onLayoutChange(action, element) {
-      if (!element || !element.parentElemen || this.useVoiceMode || this.useFileModeNonAdmin) {
+      if (!element || !element.parentElement || this.useVoiceMode || this.useFileModeNonAdmin) {
         action();
         return
       }
diff --git a/src/components/file_mode/ThumbnailView.vue b/src/components/file_mode/ThumbnailView.vue
index 19fa788..b1d4990 100644
--- a/src/components/file_mode/ThumbnailView.vue
+++ b/src/components/file_mode/ThumbnailView.vue
@@ -7,7 +7,7 @@
         </v-responsive>
         <v-img v-else-if="item.event.getContent().msgtype == 'm.image' && item.src" :aspect-ratio="previewOnly ? (16 / 9) : undefined" :class="{'thumbnail-item': true, 'preview': previewOnly}" :src="item.src" :contain="!previewOnly" :cover="previewOnly" />
         <div v-else :class="{'thumbnail-item': true, 'preview': previewOnly, 'file-item': true}" >
-            <v-icon>{{ fileTypeIcon }}</v-icon>
+            <v-icon :class="fileTypeIconClass">{{ fileTypeIcon }}</v-icon>
             <b>{{ $sanitize(fileName) }}</b>
             <div>{{ fileSize }}</div>
         </div>
@@ -54,6 +54,12 @@ export default {
             }
             return "description"
         },
+        fileTypeIconClass() {
+            if (util.isFileTypeZip(this.item.event)) {
+                return "zip";
+            } 
+            return undefined;
+        },
         fileName() {
             return util.getFileName(this.item.event);
         },