MediaWiki:Common.css/src/interface/mainBox/navBar/search.scss

From Terraria Wiki
Jump to navigation Jump to search

This page is one of the SCSS pages which are the basis for MediaWiki:Common.css. After you edit this page, you will need to recompile them for your changes to take effect. See Terraria Wiki:CSS to learn more.

@use "../../../lib";
/*** search form  ***/
#mw-head #p-search{
	--theme-border-radius: 2px;
	--theme-background: var(--theme-tab-background);
	--theme-background-active: var(--theme-tab-background-selected);
	--theme-border-color: var(--theme-legacy-search-border-color);
	--theme-border-color-active: var(--theme-legacy-search-border-color-active);
	background: var(--theme-background-shadow);
	border: 0;
	border-bottom: 1px solid var(--theme-border-bottom-color);
	margin: 0;
	padding: 1px var(--layout-gap) 0 2px;
	>div{
		display: flex;
		align-items: flex-start;
		height: 100%;
	}
	form{
		margin: 0;
		overflow: hidden;
		width: auto;
		opacity: unset;
		align-self: stretch;
		padding-bottom: var(--layout-gap);

	}


	#simpleSearch{
		margin: 0;
		width: 50vw;
		max-width: 15em;
		display: flex;
	}

	.vector-search-box-input{
		height: unset;
		padding: 0 26px 0 4px;
		box-shadow: none;
		caret-color: var(--theme-text-color);
		align-self: stretch;
		border-radius: var(--theme-border-radius);
		border-width: 1px;
		border-style: solid;
		border-color: var(--theme-border-color);
		background: var(--theme-background);
		color: var(--theme-text-color);
		&:focus{
			outline: 0;
			border-color: var(--theme-border-color-active);
		}
		&::placeholder{
			color: var(--theme-text-color-note);
		}
	}

	.mw-searchButton{
		opacity: 0;
	}
	.searchButton{
		width: 26px;
		min-width: unset;
		opacity: 1;
		background-image: none;
		//@include lib.mask-icon(#fff, );
		@include lib.mask-icon(var(--theme-icon-color), var(--icon-search), 19px 19px);
		&:hover{
			@include lib.mask-icon(var(--theme-icon-color-hover));
		}
		&.mw-fallbackSearchButton{
			opacity: 0;
		}
	}
}

/* @import interface/mainBox/navBar/search/suggestions.css */