diff --git a/sass/_filters.scss b/sass/_filters.scss index ea1b1fb..4b8e56c 100644 --- a/sass/_filters.scss +++ b/sass/_filters.scss @@ -1,13 +1,16 @@ .filters { - display: flex; - align-items: center; - justify-content: center; - padding: .5em; - margin-bottom: 2em; + display: grid; + grid-template-columns: 1fr 1fr 1fr 1fr; + column-gap: .5em; + margin-bottom: 3em; input { - margin: 0 .5em; - padding: .5em; + padding: .6em 1em; font-size: 1em; + background: #fff; + border: 1px solid $border; + border-radius: $article-border-radius; } + + input:first-child { grid-column: 2 / span 2; } } diff --git a/sass/style.scss b/sass/style.scss index 0161158..94fefed 100644 --- a/sass/style.scss +++ b/sass/style.scss @@ -149,5 +149,7 @@ main { section.list { grid-template-columns: 1fr 1fr; } + + .filters input:first-child { grid-column: span 4; } } }