1
0
mirror of https://github.com/oceanprotocol/commons.git synced 2023-03-15 18:03:00 +01:00

asset grid tweaks

This commit is contained in:
Matthias Kretschmann 2019-05-23 12:21:15 +02:00
parent 90b163b2aa
commit aaf425477f
Signed by: m
GPG Key ID: 606EEEF3C479A91F
3 changed files with 29 additions and 9 deletions

View File

@ -12,21 +12,36 @@
margin: 0; margin: 0;
visibility: hidden; visibility: hidden;
} }
}
.results { .results {
display: grid; display: grid;
grid-template-columns: 1fr; grid-template-columns: 1fr;
grid-gap: $spacer; grid-gap: $spacer;
max-width: calc(18rem + #{$spacer * 2});
margin: auto;
@media (min-width: $break-point--small) { @media (min-width: $break-point--small) {
grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr)); margin: 0;
} max-width: none;
grid-template-columns: repeat(2, 1fr);
}
@media (min-width: $break-point--medium) {
grid-template-columns: repeat(3, 1fr);
} }
} }
.title { .title {
font-size: $font-size-h3; font-size: $font-size-h3;
margin-top: $spacer * 2; margin-top: $spacer * 2;
text-align: center;
margin-bottom: $spacer;
@media (min-width: $break-point--small) {
text-align: left;
margin-bottom: $spacer / 2;
}
} }
.categories { .categories {

View File

@ -17,6 +17,10 @@
grid-gap: $spacer; grid-gap: $spacer;
@media (min-width: $break-point--small) { @media (min-width: $break-point--small) {
grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr)); grid-template-columns: repeat(2, 1fr);
}
@media (min-width: $break-point--medium) {
grid-template-columns: repeat(3, 1fr);
} }
} }

View File

@ -137,7 +137,8 @@ export default class Search extends PureComponent<SearchProps, SearchState> {
className={styles.resultsTitle} className={styles.resultsTitle}
dangerouslySetInnerHTML={{ dangerouslySetInnerHTML={{
__html: `${totalResults} results for <span>${decodeURIComponent( __html: `${totalResults} results for <span>${decodeURIComponent(
this.state.searchTerm this.state.searchTerm ||
this.state.searchCategories
)}</span>` )}</span>`
}} }}
/> />