the-glorious-startpage/css/search-engine-settings.css
Gerome Matilla 84727755db
Cleanups (#20)
* centedbox css

* add font-weight to the css

* some cleanup
2020-06-10 14:47:04 +08:00

125 lines
2.1 KiB
CSS

.searchEngine {
font-family: roboto, sans-serif;
font-weight: 400;
width: 100%;
height: auto;
position: relative;;
border-radius: 6px;
color: var(--base-color);
background: var(--base-container);
margin-top: 10px;
}
#searchEnginePadding {
padding: 10px;
height: auto;
}
#searchEngineHeader {
height: 32px;
width: 100%;
display: flex;
flex-direction: row;
justify-content: left;
}
#searchEngineHeaderIcon {
background: url('../assets/ui-icons/internet.svg');
background-size: cover;
margin-right: 10px;
width: 28px;
height: 28px;
}
#searchEngineHeaderLabel {
text-align: left;
font-weight: bold;
font-size: 14pt;
margin-top: auto;
margin-bottom: auto;
}
#searchEngineContainer {
margin-top: 5px;
}
#searchEngineSelect {
height: 32px;
width: 100%;
box-sizing: border-box;
margin-top: 5px;
border: none;
text-align: center;
border-radius: 6px;
color: var(--base-color);
background: var(--base-container);
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
#searchEngineSelect:hover {
outline: none !important;
cursor: pointer;
background: var(--base-hover-bg) !important;
}
#searchEngineSelect:focus {
outline: none !important;
background: var(--base-focus-bg) !important;
}
#searchEngineSelect:active {
outline: none !important;
background: var(--base-active-bg) !important;
}
#searchEngineSelect option {
color: initial;
border: none;
}
select::-ms-expand {
display: none;
}
#searchEngineAsDefault {
background: var(--base-container);
color: var(--base-color);
text-align: center;
width: 100%;
height: 32px;
margin-top: 5px;
border-radius: 6px;
cursor: pointer;
border: none;
/*Center vertically*/
display: flex;
justify-content: center;
align-items: center;
}
#searchEngineAsDefault:hover {
outline: none;
background: var(--base-hover-bg);
}
#searchEngineAsDefault:active {
outline: none;
background: var(--base-active-bg);
}
#searchEngineAsDefault:focus {
outline: none;
background: var(--base-focus-bg);
}
@media screen and (max-width: 580px) {
.searchEngine {
width: 96vw;
box-sizing: border-box;
}
}