mirror of
https://gerrit.wikimedia.org/r/mediawiki/skins/Vector.git
synced 2024-11-15 19:59:35 +00:00
Merge "Increase distance of button to container"
This commit is contained in:
commit
dca6da5767
|
@ -7,7 +7,7 @@
|
||||||
|
|
||||||
/* Framework */
|
/* Framework */
|
||||||
html {
|
html {
|
||||||
font-size: @html-font-size;
|
font-size: @font-size-root;
|
||||||
}
|
}
|
||||||
|
|
||||||
html,
|
html,
|
||||||
|
|
|
@ -38,15 +38,16 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
// The search input.
|
// The search input.
|
||||||
|
|
||||||
#searchInput {
|
#searchInput {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
.box-sizing( border-box );
|
.box-sizing( border-box );
|
||||||
border: @border-width-base solid @colorGray10;
|
border: @border-width-base solid @colorGray10;
|
||||||
border-radius: @borderRadius;
|
border-radius: @borderRadius;
|
||||||
// `padding-right` equals to `#searchbutton` width below.
|
// `padding-right` equals to `#searchbutton` width below.
|
||||||
padding: 0.4em 1.818em 0.4em 0.4em;
|
padding: 0.4em @width-search-button 0.4em 0.4em;
|
||||||
.box-shadow( @boxShadowWidget );
|
.box-shadow( @boxShadowWidget );
|
||||||
font-size: 0.8125em; // Equals to `13px` at browser default of `16px`.
|
font-size: @font-size-search-input;
|
||||||
direction: ltr;
|
direction: ltr;
|
||||||
.transition( ~'border-color 250ms, box-shadow 250ms' );
|
.transition( ~'border-color 250ms, box-shadow 250ms' );
|
||||||
// Support: Webkit browsers. Undo the proprietary styles applied to `type=search` fields,
|
// Support: Webkit browsers. Undo the proprietary styles applied to `type=search` fields,
|
||||||
|
@ -84,12 +85,15 @@
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: @border-width-base;
|
top: @border-width-base;
|
||||||
bottom: @border-width-base;
|
bottom: @border-width-base;
|
||||||
|
// `@border-width-base * 2` is in regards to harmonize position start and end.
|
||||||
right: @border-width-base;
|
right: @border-width-base;
|
||||||
min-width: 20px;
|
min-width: 24px;
|
||||||
width: 1.818em; // Equals to `20px` at `11px` base.
|
width: @width-search-button;
|
||||||
border: 0;
|
border: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
// Equal `font-size` to search input for `padding` calculationo.
|
||||||
|
font-size: @font-size-search-input;
|
||||||
/* Opera 12 on RTL flips the text in a funny way without this. */
|
/* Opera 12 on RTL flips the text in a funny way without this. */
|
||||||
/* @noflip */
|
/* @noflip */
|
||||||
direction: ltr;
|
direction: ltr;
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
@import 'mediawiki.ui/variables';
|
@import 'mediawiki.ui/variables';
|
||||||
|
|
||||||
@html-font-size: 100%;
|
@font-size-root: 100%;
|
||||||
@font-size-browser: 16; // Assumed browser default of `16px`
|
@font-size-browser: 16; // Assumed browser default of `16px`
|
||||||
|
|
||||||
@font-family-serif: 'Linux Libertine', 'Georgia', 'Times', serif;
|
@font-family-serif: 'Linux Libertine', 'Georgia', 'Times', serif;
|
||||||
|
@ -44,3 +44,7 @@
|
||||||
@background-position-menu-personal-icon: left ( 4 / @font-size-browser / @font-size-menu-personal );
|
@background-position-menu-personal-icon: left ( 4 / @font-size-browser / @font-size-menu-personal );
|
||||||
@font-size-menu-personal: 0.75em;
|
@font-size-menu-personal: 0.75em;
|
||||||
@line-height-menu-personal: 14 / @font-size-browser / @font-size-menu-personal; // equals `1.667em`≈`14px`
|
@line-height-menu-personal: 14 / @font-size-browser / @font-size-menu-personal; // equals `1.667em`≈`14px`
|
||||||
|
|
||||||
|
// Search
|
||||||
|
@width-search-button: 24 / @font-size-browser / @font-size-search-input;
|
||||||
|
@font-size-search-input: unit( 13 / @font-size-browser, em ); // Equals `0.8125em`.
|
||||||
|
|
Loading…
Reference in a new issue