recipes/backend/scss/search.scss

73 lines
No EOL
1.5 KiB
SCSS

@use 'sass:color';
@use 'constants' as consts;
#search {
position: relative;
display: inline-flex;
align-items: center;
input {
width: 100%;
line-height: 28px;
padding: 0 1rem;
padding-left: 2.5rem;
border-radius: 8px;
background-color: consts.$color-2;
}
input::placeholder {
color: consts.$text-dimished;
}
.icon {
position: absolute;
left: 1rem;
fill: consts.$color-3;
width: 1rem;
height: 1rem;
}
.results {
display: none;
z-index: 2;
position: absolute;
background-color: white;
vertical-align: top;
top: 100%;
border: solid 1px consts.$color-3;
background-color: consts.$color-1;
box-shadow: 0 0 5px color.adjust(consts.$color-3, $lightness: -20%);
.message {
display: hidden;
padding:
var(--margin) calc(2 * var(--margin)) var(--margin) calc(2 * var(--margin));
}
ul {
padding: 0px;
margin: 0px;
li {
padding:
var(--margin) calc(2 * var(--margin)) var(--margin) calc(2 * var(--margin));
list-style-type: none;
em {
font-weight: bold;
}
}
li:nth-child(odd) {
background: consts.$color-2;
}
}
}
}
#hidden-templates-search {
display: none;
}