Jdlrobson has uploaded a new change for review. https://gerrit.wikimedia.org/r/110973
Change subject: Rewrite search.less again with nesting ...................................................................... Rewrite search.less again with nesting Follow up to I5fe0543e273aab4fbfb88f8ce933bc49872d4793 LESS nesting allows us to merge the -webkit-appearance rule with its identical rule above. Change-Id: I724ea8221e225895f1429a12eea3be111feeef32 --- M skins/vector/components/search.less 1 file changed, 72 insertions(+), 76 deletions(-) git pull ssh://gerrit.wikimedia.org:29418/mediawiki/core refs/changes/73/110973/1 diff --git a/skins/vector/components/search.less b/skins/vector/components/search.less index f3073f1..b810dfe 100644 --- a/skins/vector/components/search.less +++ b/skins/vector/components/search.less @@ -29,90 +29,86 @@ .background-image('images/search-fade.png'); background-position: top left; background-repeat: repeat-x; -} + // Styles for both the search input and the button + input { + position: absolute; + margin: 0; + padding: 0; + border: 0; + color: black; + background-color: transparent; + } -// Styles for both the search input and the button -div#simpleSearch input { - position: absolute; - margin: 0; - padding: 0; - border: 0; - color: black; - background-color: transparent; -} + // The search input + #searchInput { + top: 0; + left: 0; + width: 90%; + padding: 0.2em 0 0.2em 0.2em; + font-size: 13px; + direction: ltr; + // Undo the styles Webkit browsers apply to type=search fields, + // we provide our own + -webkit-appearance: textfield; -// The search input -div#simpleSearch #searchInput { - top: 0; - left: 0; - width: 90%; - padding: 0.2em 0 0.2em 0.2em; - font-size: 13px; - direction: ltr; -} + &::-webkit-search-decoration, + &::-webkit-search-cancel-button, + &::-webkit-search-results-button, + &::-webkit-search-results-decoration { + -webkit-appearance: textfield; + } -div#simpleSearch #searchInput:focus { - outline: none; -} + &:focus { + outline: none; + } -div#simpleSearch input { - color: black; -} + // Placeholder colors. These rules MAY NOT be merged because of how + // CSS requires browsers to parse unrecognized selectors! + &.placeholder { + color: #999; + } + &::-webkit-input-placeholder { + color: #999; + } + &:-moz-placeholder { + color: #999; + } + &:-ms-input-placeholder { + color: #999; + } + } -// Placeholder colors. These rules MAY NOT be merged because of how -// CSS requires browsers to parse unrecognized selectors! -div#simpleSearch #searchInput.placeholder { - color: #999; -} -div#simpleSearch #searchInput::-webkit-input-placeholder { - color: #999; -} -div#simpleSearch #searchInput:-moz-placeholder { - color: #999; -} -div#simpleSearch #searchInput:-ms-input-placeholder { - color: #999; -} + input { + color: black; + } -// Undo the styles Webkit browsers apply to type=search fields, -// we provide our own -div#simpleSearch #searchInput { - -webkit-appearance: textfield; -} -div#simpleSearch #searchInput::-webkit-search-decoration, -div#simpleSearch #searchInput::-webkit-search-cancel-button, -div#simpleSearch #searchInput::-webkit-search-results-button, -div#simpleSearch #searchInput::-webkit-search-results-decoration { - -webkit-appearance: textfield; -} + // The buttons. They are displayed in the same position, and if both are + // present the fulltext search one obscures the 'Go' one. + #searchButton, + #mw-searchButton { + top: 0; + right: 0; + width: 10%; + height: 100%; + cursor: pointer; + /* Hide button text and replace it with the image. */ + text-indent: 100%; + /* Needed to make IE6 respect the text-indent. */ + line-height: 1; + /* Opera 12 on RTL flips the text in a funny way without this. */ + /* @noflip */ + direction: ltr; + white-space: nowrap; + overflow: hidden; + .background-image-svg('images/search-ltr.svg', 'images/search-ltr.png'); + background-position: center center; + background-repeat: no-repeat; + } -// The buttons. They are displayed in the same position, and if both are -// present the fulltext search one obscures the 'Go' one. -div#simpleSearch #searchButton, -div#simpleSearch #mw-searchButton { - top: 0; - right: 0; - width: 10%; - height: 100%; - cursor: pointer; - /* Hide button text and replace it with the image. */ - text-indent: 100%; - /* Needed to make IE6 respect the text-indent. */ - line-height: 1; - /* Opera 12 on RTL flips the text in a funny way without this. */ - /* @noflip */ - direction: ltr; - white-space: nowrap; - overflow: hidden; - .background-image-svg('images/search-ltr.svg', 'images/search-ltr.png'); - background-position: center center; - background-repeat: no-repeat; + #mw-searchButton { + z-index: 1; + } } - -div#simpleSearch #mw-searchButton { - z-index: 1; -} - // The following styles exist only for backwards-compatibility with // cached HTML and are to be removed before 1.23 release. -- To view, visit https://gerrit.wikimedia.org/r/110973 To unsubscribe, visit https://gerrit.wikimedia.org/r/settings Gerrit-MessageType: newchange Gerrit-Change-Id: I724ea8221e225895f1429a12eea3be111feeef32 Gerrit-PatchSet: 1 Gerrit-Project: mediawiki/core Gerrit-Branch: master Gerrit-Owner: Jdlrobson <jrob...@wikimedia.org> _______________________________________________ MediaWiki-commits mailing list MediaWiki-commits@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits