inputs.less: Lower baseline

[lhc/web/wiklou.git] / resources / src / mediawiki.ui / components / inputs.less

diff --git a/resources/src/mediawiki.ui/components/inputs.less b/resources/src/mediawiki.ui/components/inputs.less
index 0a50e10..77894b3 100644 (file)
--- a/resources/src/mediawiki.ui/components/inputs.less
+++ b/resources/src/mediawiki.ui/components/inputs.less
@@ -32,7 +32,7 @@
        border: 1px solid @colorFieldBorder;
        .box-sizing(border-box);
        width: 100%;
-       padding: .3em .3em .3em .6em;
+       padding: .4em .3em .2em .6em;
        display: block;
        vertical-align: middle;
        // Override user agent stylesheet properties. Instead use parent element.
@@ -56,19 +56,20 @@
                .field-placeholder-styling;
        }
 
-       &:focus {
-               box-shadow: inset .45em 0 0 #5088f7;
-               border-color: @colorGrayDark;
-               // Remove focus glow on input[type="search"]
-               outline: 0;
-       }
-
        // Remove red outline from inputs which have required field and invalid content.
        // This is a Firefox only issue
        // See https://developer.mozilla.org/en-US/docs/Web/CSS/:invalid
+       // This should be above :focus so focus behaviour takes preference
        &:invalid {
                box-shadow: none;
        }
+
+       &:focus {
+               box-shadow: inset .45em 0 0 @colorProgressive;
+               border-color: @colorGrayDark;
+               // Remove focus glow on input[type="search"]
+               outline: 0;
+       }
 }
 
 textarea.mw-ui-input {
@@ -84,6 +85,7 @@ textarea.mw-ui-input {
 // <button class="mw-ui-button mw-ui-constructive">go</button>
 //
 // Styleguide 1.2.
+input[type="number"],
 .mw-ui-input-inline {
        display: inline-block;
        width: auto;