Enhancements to file preview icons

CHANGE.md

@@ -65,6 +65,7 @@ Change Log: `bootstrap-fileinput`
     - New template `actionDrag` will be available within `layoutTemplates` to configure your drag indicator markup.
 17. Simpler naming for files in locales and themes folders.
 18. (enh #647): Display file size in previews and templates.
+19. Enhancements to file preview icons (`other` template).
 
 ## version 4.3.1
 

css/fileinput.css

@@ -131,6 +131,18 @@
     font-size: 1.2em;
 }
 
+.file-preview-other {
+    left:0;
+    top:0;
+    right:0;
+    bottom:0;
+    margin:auto;
+    text-align: center;
+    vertical-align: middle;
+    padding: 10px;
+}
+
+/*
 .file-preview-other {
     display: table-cell;
     text-align: center;
@@ -138,6 +150,7 @@
     border: 2px solid #999;
     border-radius: 30px;
 }
+*/
 
 .file-preview-other:hover {
     opacity: 0.8;
@@ -147,16 +160,13 @@
     text-align: left;
 }
 
-.file-icon-lg {
-    font-size: 1.2em;
-}
-
-.file-icon-2x {
-    font-size: 2.4em;
+.file-other-icon {
+    font-size: 4.8em;
 }
 
-.file-icon-4x {
-    font-size: 4.8em;
+.file-zoom-dialog .file-other-icon {
+    font-size: 8em;
+    font-size: 55vmin;
 }
 
 .file-input-new .file-preview, .file-input-new .close, .file-input-new .glyphicon-file,

js/fileinput.js

@@ -852,6 +852,7 @@
                     $.each(self.previewFileExtSettings, function (key, func) {
                         if (self.previewFileIconSettings[key] && func(ext)) {
                             icn = self.previewFileIconSettings[key];
+                            return;
                         }
                     });
                 }
@@ -2043,7 +2044,7 @@
                 config = ifSet(cat, self.previewSettings, defaultPreviewSettings[cat]),
                 caption = self.slug(fname), footer = foot || self._renderFileFooter(caption, size, config.width);
             ind = ind || previewId.slice(previewId.lastIndexOf('-') + 1);
-            tmplt = self._parseFilePreviewIcon(tmplt, fname.split('.').pop());
+            tmplt = self._parseFilePreviewIcon(tmplt, fname);
             if (isError) {
                 footer += '<div class="file-other-error" title="' + self.fileActionSettings.indicatorErrorTitle +
                     '">' + self.fileActionSettings.indicatorError + '</div>';
@@ -3112,7 +3113,7 @@
         previewSettings: defaultPreviewSettings,
         fileTypeSettings: defaultFileTypeSettings,
         previewFileIcon: '<i class="glyphicon glyphicon-file"></i>',
-        previewFileIconClass: 'file-icon-4x',
+        previewFileIconClass: 'file-other-icon',
         previewFileIconSettings: {},
         previewFileExtSettings: {},
         buttonLabelClass: 'hidden-xs',