TitleOptionWidget: Only set grey bg for icons

When a thumbanil image is used leave the background
transparent, as the thumbnail may have transparency.

Bug: T116588
Change-Id: Id7bd55fcdce337cfcf3f6d9aedc798630e2983c2

diff --git a/resources/src/mediawiki.widgets/mw.widgets.TitleWidget.less b/resources/src/mediawiki.widgets/mw.widgets.TitleWidget.less
index 2eb8c55..86d4cfe 100644 (file)
--- a/resources/src/mediawiki.widgets/mw.widgets.TitleWidget.less
+++ b/resources/src/mediawiki.widgets/mw.widgets.TitleWidget.less
@@ -22,7 +22,7 @@
                        min-height: 3.75em;
                        padding-left: 4.75em;
 
-                       &:not(:last-child) {
+                       &:not( :last-child ) {
                                margin-bottom: 2px;
                        }
 
@@ -31,26 +31,27 @@
                        }
 
                        &.oo-ui-iconElement {
-                               >.oo-ui-iconElement-icon {
+                               > .oo-ui-iconElement-icon {
                                        display: block;
                                        width: 3.75em;
                                        height: 3.75em;
                                        left: 0;
-                                       background-color: #ccc;
-                                       opacity: 0.4;
-                               }
-
-                               > .mw-widget-titleOptionWidget-hasImage {
-                                       border: 0;
-                                       background-size: cover;
-                                       opacity: 0.7;
+                                       &:not( .mw-widget-titleOptionWidget-hasImage ) {
+                                               background-color: #ccc;
+                                               opacity: 0.4;
+                                       }
+                                       &.mw-widget-titleOptionWidget-hasImage {
+                                               border: 0;
+                                               background-size: cover;
+                                               opacity: 0.7;
+                                       }
                                }
                        }
-               }
 
-               &.oo-ui-optionWidget-highlighted, &.oo-ui-optionWidget-selected {
-                       &.oo-ui-iconElement > .mw-widget-titleOptionWidget-hasImage {
-                               opacity: 1;
+                       &.oo-ui-optionWidget-highlighted, &.oo-ui-optionWidget-selected {
+                               &.oo-ui-iconElement > .mw-widget-titleOptionWidget-hasImage {
+                                       opacity: 1;
+                               }
                        }
                }
        }