UX: adjust styles to meet core changes (#148)
This commit is contained in:
+33
-36
@@ -1,8 +1,5 @@
|
||||
.welcome-banner {
|
||||
z-index: calc(z("base") + 1);
|
||||
}
|
||||
|
||||
.welcome-banner__wrap {
|
||||
&__wrap {
|
||||
display: grid;
|
||||
grid-template-rows: 0.33fr 0.33fr 0.33fr;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
@@ -22,38 +19,6 @@
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
h1 {
|
||||
grid-column: 1/2;
|
||||
grid-row: 1/-1;
|
||||
text-align: left;
|
||||
align-self: center;
|
||||
margin: 0;
|
||||
font-weight: 400;
|
||||
color: var(--search-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;
|
||||
}
|
||||
@include breakpoint("mobile-extra-large") {
|
||||
font-size: var(--font-up-2);
|
||||
}
|
||||
}
|
||||
|
||||
.search-menu {
|
||||
grid-column: 2/3;
|
||||
grid-row: 1/-1;
|
||||
@@ -102,3 +67,35 @@
|
||||
.results {
|
||||
background: var(--d-content-background);
|
||||
}
|
||||
&__title {
|
||||
grid-column: 1/2;
|
||||
grid-row: 1/-1;
|
||||
text-align: left;
|
||||
align-self: center;
|
||||
margin: 0;
|
||||
font-weight: 400;
|
||||
color: var(--search-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;
|
||||
}
|
||||
@include breakpoint("mobile-extra-large") {
|
||||
font-size: var(--font-up-2);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user