@@ Line 10: / Line 10: @@
      --content-border-top-color: #678002;
      --content-border-top-color-hovered: #7b9904;
+	--simplesearch-top-border-color: #FFFFFF;
+	--simplesearch-left-border-color: #888888;
+	--simplesearch-topright-grass-color: #6BA41E;
+	--searchinput-placeholder-color: #72777D;
 }
@@ Line 263: / Line 269: @@
+nav.mw-portlet.emptyPortlet {
+	display: none;
+}
 .mw-body, .parsoid-body,
@@ Line 368: / Line 377: @@
 	color: var(--color-inverted-fixed);
 }
+/* Style the simple search */
+#p-search {
+	margin-left: 0;
+}
+#p-search form {
+	position: relative;
+	margin-top: 6px;
+	padding: 0 4px 0 5px;
+	height: 27px;
+}
+#simpleSearch {
+	top: -3px;
+	border: 0;
+	border-top: 3px solid var(--simplesearch-top-border-color);
+	border-left: 3px solid var(--simplesearch-left-border-color);
+	background-color: #D0CFCF;
+	background-image: -webkit-linear-gradient(#C3C3C3, #DBDBDB);
+	background-image: linear-gradient(#C3C3C3, #DBDBDB);
+	-webkit-transition: none !important;
+	-moz-transition: none !important;
+	transition: none !important;
+}
+#simpleSearch:before {
+	content: "";
+	position: absolute;
+	bottom: 0;
+	left: -3px;
+	border-top: 3px solid var(--simplesearch-left-border-color);
+	border-left: 3px solid var(--content-border-top-color);
+	z-index: 1;
+}
+#simpleSearch:after {
+	content: "";
+	position: absolute;
+	top: -3px;
+	right: 0;
+	border-top: 3px solid var(--simplesearch-topright-grass-color);
+	border-left: 3px solid var(--simplesearch-top-border-color);
+}
+/* Remove border of search bar */
+#simpleSearch .vector-search-box-input {
+    border: none;
+    border-radius: 0;
+    outline: none;
+    box-shadow: none;
+    height: 27px;
+}
+.vector-search-box-input::placeholder {
+	color: var(--searchinput-placeholder-color);
+}
+/* Style the simple search */
+#p-search {
+	margin-left: 0;
+	width: unset;
+	min-width: unset;
+}
+#p-search #searchform {
+	position: relative;
+	margin-top: 6px;
+	padding: 0 4px 0 5px;
+}
+/* Unstyle codex search */
+#p-search #searchform .cdx-text-input__input,
+#p-search #searchform .cdx-search-input,
+#p-search #searchform {
+	background: none;
+	display: block;
+    border: none;
+    border-radius: 0;
+    outline: none;
+    box-shadow: none;
+    height: 27px;
+}
+/* Keep old vector default styles */
+#p-search #searchform .cdx-search-input__input-wrapper {
+    height: 100%;
+    min-width: 6.5em;
+    width: 20vw;
+    max-width: 26em;
+    margin: 0;
+}
+#p-search #searchform .cdx-search-input__input-wrapper {
+	position: relative;
+	top: -3px;
+	border: 0;
+	border-top: 3px solid var(--simplesearch-top-border-color);
+	border-left: 3px solid var(--simplesearch-left-border-color);
+	background-color: #D0CFCF;
+	background-image: -webkit-linear-gradient(#C3C3C3, #DBDBDB);
+	background-image: linear-gradient(#C3C3C3, #DBDBDB);
+	-webkit-transition: none !important;
+	-moz-transition: none !important;
+	transition: none !important;
+}
+#p-search #searchform .cdx-search-input__input-wrapper:before {
+	content: "";
+	position: absolute;
+	bottom: 0;
+	left: -3px;
+	border-top: 3px solid var(--simplesearch-left-border-color);
+	border-left: 3px solid var(--content-border-top-color);
+	z-index: 1;
+}
+#p-search #searchform .cdx-search-input__input-wrapper:after {
+	content: "";
+	position: absolute;
+	top: -3px;
+	right: 0;
+	border-top: 3px solid var(--simplesearch-topright-grass-color);
+	border-left: 3px solid var(--simplesearch-top-border-color);
+}
+#p-search #searchform .cdx-text-input__input {
+    background-color: rgba(255, 255, 255, 0.5);
+    color: #000;
+    min-height: unset;
+    padding: 5px 2.15384615em 5px 0.4em;
+}
+#p-search #searchform .cdx-text-input__input::placeholder {
+	color: var(--searchinput-placeholder-color);
+}
+#p-search #searchform .cdx-search-input__end-button {
+	display: block;
+    position: absolute;
+    top: 1px;
+    bottom: 1px;
+    right: 1px;
+    min-width: 28px;
+    width: 2.15384615em;
+    border: 0;
+    padding: 0;
+    cursor: pointer;
+    direction: ltr;
+    text-indent: -99999px;
+    white-space: nowrap;
+    overflow: hidden;
+    z-index: 1;
+    background: no-repeat center / 1.23076923em url(/skins/Vector/resources/skins.vector.styles.legacy/images/search.svg?ac00d);
+    opacity: 0.67;
+    margin: 0;
+    min-height: unset;
+}
+#p-search #searchform > .cdx-search-input__end-button {
+	right: 5px;
+}
+#p-search #searchform .cdx-thumbnail__placeholder,
+#p-search #searchform .cdx-thumbnail__image {
+	background-color: var(--background-color-base);
+}
+/* Fix placeholder text being too light in chrome */
+::-webkit-input-placeholder {
+	color: inherit;
+	opacity: 0.54;
+}
+/* The suggestions shown under the search bar */
+.suggestions.searchbar {
+	margin-right: -1px;
+}
+.suggestions.searchbar > .suggestions-results,
+.suggestions.searchbar > .mw-searchSuggest-link {
+	display: block;
+	margin-left: 1px;
+}
+.suggestions.searchbar .suggestions-results,
+.suggestions.searchbar .suggestions-special,
+.suggestions .suggestions-results,
+.suggestions .suggestions-special {
+	background-color: #DBDADA !important;
+	border-color: #3C3B3B !important;
+}
+.suggestions.searchbar .suggestions-result-current,
+.suggestions .suggestions-result-current {
+	background-color: #0078D7 !important;
+}

MediaWiki:Vector.css: Difference between revisions