diff options
author | Jesús <heckyel@hyperbola.info> | 2021-12-01 22:45:05 -0500 |
---|---|---|
committer | Jesús <heckyel@hyperbola.info> | 2021-12-01 22:45:05 -0500 |
commit | 0ef5a8fe632e568c1b80572ae23e46c61f2da185 (patch) | |
tree | 352d7273796b975227eca82f34857be71abf9052 /src/scss/styles/licenses/_main.scss | |
download | countries-0ef5a8fe632e568c1b80572ae23e46c61f2da185.tar.lz countries-0ef5a8fe632e568c1b80572ae23e46c61f2da185.tar.xz countries-0ef5a8fe632e568c1b80572ae23e46c61f2da185.zip |
initial public
Diffstat (limited to 'src/scss/styles/licenses/_main.scss')
-rw-r--r-- | src/scss/styles/licenses/_main.scss | 89 |
1 files changed, 89 insertions, 0 deletions
diff --git a/src/scss/styles/licenses/_main.scss b/src/scss/styles/licenses/_main.scss new file mode 100644 index 0000000..76e041d --- /dev/null +++ b/src/scss/styles/licenses/_main.scss @@ -0,0 +1,89 @@ +body { + display: grid; + grid-gap: 20px; + grid-template-areas: + "header" + "main" + "footer"; + /* Fix height */ + height: 100vh; + grid-template-rows: auto 1fr auto; + /* fix top and bottom */ + margin-left: 1rem; + margin-right: 1rem; +} + +.home-link { + font-size: 1.5rem; +} + +a:link { + color: var(--link); +} + +a:visited { + color: var(--link-visited); +} + +header { + display: grid; + grid-gap: 1px; + grid-template-areas: + "home"; + grid-area: header; +} + +.home { + grid-area: home; + margin-left: auto; + margin-right: auto; + margin-bottom: 1rem; + margin-top: 1rem; +} + +.main { + grid-area: main; + margin: 0 auto; + max-width: 80ch; +} + +.code-error { + background: var(--s-background); + padding: 1rem; +} + +.footer { + grid-area: footer; + display: grid; + grid-template-columns: auto; + align-items: center; + justify-content: center; + margin: auto; + text-align: center; +} + +.footer > p { + text-align: center; +} + +@media (min-width: 780px) { + body { + display: grid; + grid-template-columns: 0.3fr 2fr 1fr 0.3fr; + grid-template-rows: auto 1fr auto; + grid-template-areas: + "header header header header" + "main main main main" + "footer footer footer footer"; + } + .footer { + display: grid; + grid-template-columns: repeat(3, 1fr); + grid-column-gap: 2rem; + align-items: center; + justify-content: center; + text-align: center; + margin-top: 1rem; + margin-bottom: 1rem; + } +} |