Added proper support for button images

diff --git a/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabButton.js b/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabButton.js
index 2622325489685cf93009ad6f98b2586439b485b0..41370b0a072077d41f470dfc80e6ffde0dc4e08a 100644 (file)
--- a/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabButton.js
+++ b/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabButton.js
@@ -17,7 +17,7 @@ $.Redactor.prototype.WoltLabButton = function() {
                        }
                        
                        // set button icons and labels
-                       var buttonData;
+                       var buttonData, icon, iconIsImage;
                        for (i = 0, length = this.opts.buttons.length; i < length; i++) {
                                buttonName = this.opts.buttons[i];
                                
@@ -58,8 +58,15 @@ $.Redactor.prototype.WoltLabButton = function() {
                                                break;
                                }
                                
+                               icon = buttonData.icon;
+                               iconIsImage = false;
+                               if (!icon.match(/^fa-/) && icon.match(/\.(gif|jpe?g|png|svg)$/)) {
+                                       iconIsImage = true;
+                               }
+                               
                                // set icon
-                               this.button.setIcon(button, '<span class="icon icon16 ' + buttonData.icon + '"></span>');
+                               //noinspection CssUnknownTarget
+                               this.button.setIcon(button, '<span class="icon icon16 ' + (iconIsImage ? 'redactorButtonImage' : icon) + '"' + (iconIsImage ? ' style="background-image: url(\'' + WCF_PATH + 'icon/' + icon + '\')"' : '') + '></span>');
                                if (!button[0]) {
                                        throw new Error("Missing button element for '" + buttonName + "'.");
                                }

diff --git a/wcfsetup/install/files/style/ui/redactor.scss b/wcfsetup/install/files/style/ui/redactor.scss
index 39ebb683659d01a84d529376f0727529676b1745..2384b5adf6b838619a7eac671f7bc0dd73c0d698 100644 (file)
--- a/wcfsetup/install/files/style/ui/redactor.scss
+++ b/wcfsetup/install/files/style/ui/redactor.scss
@@ -183,6 +183,11 @@
                        .icon {
                                color: inherit;
                                cursor: inherit !important;
+                               
+                               &.redactorButtonImage {
+                                       background: no-repeat center center;
+                                       background-size: contain;
+                               }
                        }
                        
                        @include screen-lg {