RCFilters UI: Fix CapsuleItemWidget popup styling

Bug: T158006
Change-Id: I83f72273bc5bf7bd9548d60efd094e427ff0e13a

diff --git a/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.CapsuleItemWidget.less b/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.CapsuleItemWidget.less
index 0bf6f58..65278f9 100644 (file)
--- a/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.CapsuleItemWidget.less
+++ b/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.CapsuleItemWidget.less
@@ -1,13 +1,9 @@
 @import "mw.rcfilters.mixins";
 
 .mw-rcfilters-ui-capsuleItemWidget {
-       &-popup {
-               padding: 1em;
-       }
-
-       .oo-ui-popupWidget {
-               // Fix the positioning of the popup itself
-               margin-top: 1em;
+       &-popup-content {
+               padding: 0.5em;
+               color: #54595d;
        }
 
        .oo-ui-labelElement-label {

diff --git a/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.CapsuleItemWidget.js b/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.CapsuleItemWidget.js
index a547020..4ab3681 100644 (file)
--- a/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.CapsuleItemWidget.js
+++ b/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.CapsuleItemWidget.js
@@ -14,7 +14,7 @@
         */
        mw.rcfilters.ui.CapsuleItemWidget = function MwRcfiltersUiCapsuleItemWidget( controller, model, config ) {
                var $popupContent = $( '<div>' )
-                       .addClass( 'mw-rcfilters-ui-capsuleItemWidget-popup' ),
+                               .addClass( 'mw-rcfilters-ui-capsuleItemWidget-popup-content' ),
                        descLabelWidget = new OO.ui.LabelWidget();
 
                // Configuration initialization
@@ -34,11 +34,12 @@
                // Mixin constructors
                OO.ui.mixin.PopupElement.call( this, $.extend( {
                        popup: {
-                               padded: true,
+                               padded: false,
                                align: 'center',
                                $content: $popupContent
                                        .append( descLabelWidget.$element ),
-                               $floatableContainer: this.$element
+                               $floatableContainer: this.$element,
+                               classes: [ 'mw-rcfilters-ui-capsuleItemWidget-popup' ]
                        }
                }, config ) );