diff --git a/frontend/src/css/styles.css b/frontend/src/css/styles.css
index 6e6d6ba2..5cff40fa 100644
--- a/frontend/src/css/styles.css
+++ b/frontend/src/css/styles.css
@@ -205,6 +205,34 @@ main .spinner .bounce2 {
height: 100%;
}
+#previewer .preview .info {
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ font-size: 1.5em;
+ color: #fff;
+}
+#previewer .preview .info .title {
+ margin-bottom: 1em;
+}
+#previewer .preview .info .title i {
+ display: block;
+ margin-bottom: .1em;
+ font-size: 4em;
+}
+#previewer .preview .info .button {
+ display: inline-block;
+}
+#previewer .preview .info .button:hover {
+ background-color: rgba(255, 255, 255, 0.2)
+}
+#previewer .preview .info .button i {
+ display: block;
+ margin-bottom: 4px;
+ font-size: 1.3em;
+}
+
#previewer .pdf {
width: 100%;
height: 100%;
diff --git a/frontend/src/i18n/en.json b/frontend/src/i18n/en.json
index 7bced4cd..38e3a42e 100644
--- a/frontend/src/i18n/en.json
+++ b/frontend/src/i18n/en.json
@@ -63,7 +63,8 @@
"size": "Size",
"sortByLastModified": "Sort by last modified",
"sortByName": "Sort by name",
- "sortBySize": "Sort by size"
+ "sortBySize": "Sort by size",
+ "noPreview": "Preview is not available for this file."
},
"help": {
"click": "select file or directory",
diff --git a/frontend/src/views/files/Preview.vue b/frontend/src/views/files/Preview.vue
index 3fb23a5b..013e526f 100644
--- a/frontend/src/views/files/Preview.vue
+++ b/frontend/src/views/files/Preview.vue
@@ -89,12 +89,31 @@
class="pdf"
:data="raw"
>
-
-
- {{ $t("buttons.download") }}
- file_download
-
-
+