Split Searchbox layout styles for legacy and modern
No changes made to the CSS rules. * 'SearchBox.less' is the common part that won't change in modern. * layout styles copied to both 'layout.less' Bug: T249363 Change-Id: I340b9e7e91960713c0ebb4d3d26e2ae2d5628f37
This commit is contained in:
parent
56dbfd9a46
commit
ba8ec2f842
|
@ -4,16 +4,8 @@
|
|||
|
||||
/* Search */
|
||||
#p-search {
|
||||
float: left;
|
||||
margin-right: 0.5em;
|
||||
margin-left: 0.5em;
|
||||
|
||||
h3 {
|
||||
.mixin-screen-reader-text;
|
||||
}
|
||||
|
||||
form {
|
||||
margin: 0.5em 0 0;
|
||||
.mixin-screen-reader-text();
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -21,12 +13,6 @@
|
|||
// Provide extra element for gadgets due to `form` already carrying an `id`.
|
||||
#simpleSearch {
|
||||
position: relative;
|
||||
min-width: 5em;
|
||||
// Support: IE 8, Firefox 18-, Chrome 19-, Safari 5.1-, Opera 19-, Android 4.4.4-.
|
||||
width: 13.2em;
|
||||
// Support: Modern browsers, responsive width.
|
||||
width: 20vw;
|
||||
max-width: 20em;
|
||||
height: 100%;
|
||||
|
||||
// Styles for both the search input and the button.
|
||||
|
|
|
@ -74,6 +74,32 @@ body {
|
|||
z-index: @z-index-header;
|
||||
}
|
||||
|
||||
/* Searchbox */
|
||||
#p-search {
|
||||
float: left;
|
||||
margin-right: 0.5em;
|
||||
margin-left: 0.5em;
|
||||
|
||||
// FIXME: This selector requires knowledge of the internals of the search component
|
||||
// and should not be used here.
|
||||
form {
|
||||
margin: 0.5em 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Defined as `div`.
|
||||
// Provide extra element for gadgets due to `form` already carrying an `id`.
|
||||
// FIXME: This selector requires knowledge of the internals of the search component
|
||||
// and should not be used here.
|
||||
#simpleSearch {
|
||||
min-width: 5em;
|
||||
// Support: IE 8, Firefox 18-, Chrome 19-, Safari 5.1-, Opera 19-, Android 4.4.4-.
|
||||
width: 13.2em;
|
||||
// Support: Modern browsers, responsive width.
|
||||
width: 20vw;
|
||||
max-width: 20em;
|
||||
}
|
||||
|
||||
/* Main column */
|
||||
.mw-body,
|
||||
#mw-data-after-content,
|
||||
|
|
|
@ -108,6 +108,33 @@ body {
|
|||
margin-top: 2.5em;
|
||||
}
|
||||
|
||||
/* Search */
|
||||
#p-search {
|
||||
float: left;
|
||||
margin-right: 0.5em;
|
||||
margin-left: 0.5em;
|
||||
|
||||
// FIXME: This selector requires knowledge of the internals of the search component
|
||||
// and should not be used here.
|
||||
form {
|
||||
margin: 0.5em 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Defined as `div`.
|
||||
// Provide extra element for gadgets due to `form` already carrying an `id`.
|
||||
// FIXME: This selector requires knowledge of the internals of the search component
|
||||
// and should not be used here.
|
||||
#simpleSearch {
|
||||
min-width: 5em;
|
||||
// Support: IE 8, Firefox 18-, Chrome 19-, Safari 5.1-, Opera 19-, Android 4.4.4-.
|
||||
width: 13.2em;
|
||||
// Support: Modern browsers, responsive width.
|
||||
width: 20vw;
|
||||
max-width: 20em;
|
||||
}
|
||||
|
||||
/* Sidebar */
|
||||
#mw-panel {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
|
|
Loading…
Reference in New Issue