Keep buttons from changing size when they change state
authorkaldari <rkaldari@wikimedia.org>
Fri, 14 Nov 2014 18:34:50 +0000 (10:34 -0800)
committerkaldari <rkaldari@wikimedia.org>
Fri, 14 Nov 2014 18:40:45 +0000 (10:40 -0800)
Right now if a button changes from a light color to a dark color
based on some user action or state change, the button width also
changes, potentially reflowing the content and making the button
move to a completely different location. Both the height and width
need to stay the same (as was discussed in mw-ui standardization
meetings). The effect on the hover-shadow gimmick is virtually
imperceptable.

Bug: 73381
Change-Id: I27edeb4f1317c9d163bc87f54f35a161cdcd686e

resources/src/mediawiki.less/mediawiki.ui/mixins.less

index ec9888f..5d0fefb 100644 (file)
 .button-colors(@bgColor) when (lightness(@bgColor) < 70%) {
        color: #fff;
        // border of the same color as background so that light background and
-       // dark background buttons are the same height (only top and bottom to
-       // make box shadow on hover cover the corners too)
+       // dark background buttons are the same height and width
        border: 1px solid @bgColor;
-       border-left: none;
-       border-right: none;
        text-shadow: 0 1px rgba(0, 0, 0, .1);
 
        &:disabled {