Jordan Vidrine
84 lines
1.9 KiB
SCSS
84 lines
1.9 KiB
SCSS
.custom-search-banner-wrap {
|
|
display: grid;
|
|
grid-template-rows: 0.33fr 0.33fr 0.33fr;
|
|
grid-template-columns: 1fr 1fr;
|
|
grid-column-gap: 1em;
|
|
grid-row-gap: 0.5em;
|
|
border-bottom: 1px solid var(--primary-300);
|
|
padding: 1.5em 0 2.5em;
|
|
margin-bottom: 0;
|
|
@media screen and (max-width: 900px) {
|
|
padding-bottom: 1em;
|
|
}
|
|
h1 {
|
|
grid-column: 1/2;
|
|
grid-row: 1/-1;
|
|
padding: 0 1em;
|
|
text-align: left;
|
|
align-self: center;
|
|
margin: 0;
|
|
font-weight: 400;
|
|
color: var(--search-banner-text-color);
|
|
@media screen and (max-width: 1028px) {
|
|
font-size: var(--font-up-4);
|
|
grid-column: 1/-1;
|
|
grid-row: 1;
|
|
text-align: center;
|
|
margin-bottom: 0.5em;
|
|
}
|
|
@media screen and (max-width: 768px) {
|
|
text-align: left;
|
|
grid-column: 1/2;
|
|
grid-row: 1/-1;
|
|
font-size: var(--font-up-3);
|
|
}
|
|
@media screen and (max-width: 600px) {
|
|
grid-column: 1/-1;
|
|
grid-row: 1;
|
|
text-align: center;
|
|
margin-bottom: 0.5em;
|
|
}
|
|
}
|
|
.search-menu {
|
|
grid-column: 2/3;
|
|
grid-row: 1/-1;
|
|
width: 100%;
|
|
align-self: center;
|
|
@media screen and (max-width: 1028px) {
|
|
grid-row: 2/-1;
|
|
grid-column: 1/-1;
|
|
}
|
|
@media screen and (max-width: 768px) {
|
|
grid-column: 2/-1;
|
|
grid-row: 1/-1;
|
|
}
|
|
@media screen and (max-width: 600px) {
|
|
grid-row: 2/-1;
|
|
grid-column: 1/-1;
|
|
}
|
|
}
|
|
p {
|
|
display: none;
|
|
}
|
|
.search-input {
|
|
background: var(--d-content-background);
|
|
border: 1px solid var(--search-color);
|
|
box-shadow: 0 4px 10px rgba(52, 6, 121, 15%);
|
|
}
|
|
.search-menu .search-input:focus-within,
|
|
.search-menu-container .search-input:focus-within {
|
|
border: 1px solid var(--search-color);
|
|
outline: 2px solid var(--search-color);
|
|
}
|
|
.search-menu .d-icon,
|
|
.search-menu .searching .d-icon {
|
|
color: var(--search-color);
|
|
}
|
|
.panel-body {
|
|
z-index: z("dropdown");
|
|
}
|
|
.results {
|
|
background: var(--d-content-background);
|
|
}
|
|
}
|