diff options
author | Kjetil Orbekk <kjetil.orbekk@gmail.com> | 2020-02-27 06:45:55 -0500 |
---|---|---|
committer | Kjetil Orbekk <kjetil.orbekk@gmail.com> | 2020-02-27 06:45:55 -0500 |
commit | 079e2067f30c099202fd51751ff966c527741b7a (patch) | |
tree | 8e07ec2a87f0f5308364c6393c093f48732af5d9 | |
parent | fb888030b7872f22dd363370cf9a6f2d6394905b (diff) |
-rw-r--r-- | static/default.css | 33 |
1 files changed, 23 insertions, 10 deletions
diff --git a/static/default.css b/static/default.css index b3003ab..d8e4345 100644 --- a/static/default.css +++ b/static/default.css @@ -1,31 +1,44 @@ /* Placement */ +@media screen and (max-width: 800px) { + body { + grid-template: + "header" auto + "nav" auto + "main" 1fr + "footer" auto / 1fr; + } +} + +@media screen and (min-width: 800px) { + body { + grid-template: + "header header" auto + "nav main " 1fr + "footer footer" auto / 200px minmax(600px, auto); + } +} + body { display: grid; margin: auto; max-width: 1224px; - grid-template-columns: 200px minmax(600px, auto); - grid-template-rows: fit-content 1fr auto; grid-gap: 0; } header { - grid-column: 2; - grid-row: 1; + grid-area: header; } nav { - grid-column: 1; - grid-row: 2 / 4; + grid-area: nav; } main { - grid-column: 2; - grid-row: 2; + grid-area: main; } footer { - grid-column: 1 / 3; - grid-row: 3; + grid-area: footer; } /* Style */ |