refactor(docs-infra): clean up `aio-search-results` styles (#31390)

PR Close #31390
This commit is contained in:
George Kalpakas 2019-07-02 17:37:33 +03:00 committed by Matias Niemelä
parent 2d4f507b61
commit 75b6b0e1ba
1 changed files with 99 additions and 93 deletions

View File

@ -1,102 +1,108 @@
aio-search-results { aio-search-results {
z-index: 10; z-index: 10;
}
.search-results { .search-results {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: space-around; justify-content: space-around;
overflow: auto; overflow: auto;
padding: 68px 32px 0; padding: 68px 32px 0;
color: $offwhite; width: auto;
width: auto; max-height: 95vh;
max-height: 95vh; position: fixed;
position: fixed; top: 0;
top: 0; left: 0;
left: 0; right: 0;
right: 0; z-index: 5;
z-index: 5; background-color: $darkgray;
background-color: $darkgray; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.3);
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.3); box-sizing: border-box;
box-sizing: border-box;
@media (max-width: 480px) {
display: block;
.search-area { .search-area {
display: flex;
flex-direction: column;
margin: 16px;
height: 100%;
.search-section-header {
@include font-size(16);
font-weight: 400;
margin: 10px 0px 5px;
text-transform: uppercase;
color: $white;
}
ul {
margin: 0;
padding: 0;
li {
list-style: none;
}
.search-result-item {
@include font-size(14);
color: $lightgray;
font-weight: normal;
&a {
text-decoration: none;
}
&:hover {
color: $white;
}
.symbol {
margin-right: 8px;
}
}
&.priority-pages {
padding: 0.5rem 0;
.search-result-item {
font-weight: bold;
}
}
}
@include bp(tiny) {
display: block;
}
}
@media (max-width: 480px) {
display: block; display: block;
margin: 16px 16px;
.search-area {
display: block;
}
}
}
&.embedded {
.search-results {
padding: 0;
color: inherit;
max-height: 100%;
position: relative;
background-color: inherit;
box-shadow: none;
.search-area {
.search-section-header {
color: $darkgray;
}
.search-result-item {
color: lighten($darkgray, 10);
&:hover {
color: $accentblue;
}
}
}
} }
} }
} }
aio-search-results.embedded .search-results {
padding: 0;
color: inherit;
width: auto;
max-height: 100%;
position: relative;
background-color: inherit;
box-shadow: none;
box-sizing: border-box;
.search-area a {
color: lighten($darkgray, 10);
&:hover {
color: $accentblue;
}
}
}
.search-area {
display: flex;
flex-direction: column;
margin: 16px 16px;
height: 100%;
.search-section-header {
@include font-size(16);
font-weight: 400;
margin: 10px 0px 5px;
text-transform: uppercase;
color: $white;
}
ul {
margin: 0;
padding: 0;
li {
list-style: none;
}
}
a {
@include font-size(14);
color: $lightgray;
text-decoration: none;
font-weight: normal;
&:hover {
color: $white;
}
&:visited {
text-decoration: none;
}
span.symbol {
margin-right: 8px;
}
}
.priority-pages {
padding: 0.5rem 0;
a {
font-weight: bold;
}
}
@include bp(tiny) {
display: block;
}
}