This commit is contained in:
Joost van der Schee 2022-12-08 22:47:08 +01:00
parent 3565f3cce7
commit 62ae87da5b
3 changed files with 7 additions and 1 deletions

BIN
assets/images/mountains.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 MiB

View File

@ -1,6 +1,6 @@
*,*::after, *::before {margin: 0; padding: 0; box-sizing: border-box;} *,*::after, *::before {margin: 0; padding: 0; box-sizing: border-box;}
html {font-size: 20px;} html {font-size: 20px;}
body {background: #fff; background-image: url("assets/images/bedge-grunge.png"); border: 1rem solid #fff; border-top: 0; border-bottom: 0; min-height: 100vh; font-size: 0.85rem; font-family: 'Spectral'; line-height: 1.5; letter-spacing: -0.02em; overflow: auto;} body {background: #fff; background: url('assets/images/mountains.png') calc(50% - 30rem) calc(100% - 3rem) / 40rem auto no-repeat, url('assets/images/mountains2.png') calc(50% + 32rem) bottom / 50rem auto no-repeat, url("assets/images/bedge-grunge.png"); background-blend-mode: multiply; border: 1rem solid #fff; border-top: 0; border-bottom: 0; min-height: 100vh; font-size: 0.85rem; font-family: 'Spectral'; line-height: 1.5; letter-spacing: -0.02em; overflow: auto;}
body, a {color: #3a3731; text-decoration: none;} body, a {color: #3a3731; text-decoration: none;}
img {max-width: 100%;} img {max-width: 100%;}
h1,h2,h3 {line-height: 1.1; margin-bottom: 0.75em; font-size: 1.6rem;} h1,h2,h3 {line-height: 1.1; margin-bottom: 0.75em; font-size: 1.6rem;}
@ -36,9 +36,15 @@ div.examples > div a:first-child {display: block; margin-bottom: 0.2rem;}
div.examples > div a:first-child img {max-width: 10rem; display: block; border: 1px solid #3a3731;} div.examples > div a:first-child img {max-width: 10rem; display: block; border: 1px solid #3a3731;}
div.examples > div a:first-child:hover img {transform: scale(1.05);} div.examples > div a:first-child:hover img {transform: scale(1.05);}
@media only screen and (max-width: 75rem) {
body {background: #fff url("assets/images/bedge-grunge.png");}
}
@media only screen and (max-width: 25rem) { @media only screen and (max-width: 25rem) {
body {border-width: 0.5rem;} body {border-width: 0.5rem;}
section {min-height: calc(100vh - 0.5rem); padding-left: 1.25rem; padding-right: 1.25rem; padding-top: 13.5rem;} section {min-height: calc(100vh - 0.5rem); padding-left: 1.25rem; padding-right: 1.25rem; padding-top: 13.5rem;}
main::after, main::before {height: 0.5rem;} main::after, main::before {height: 0.5rem;}
footer {padding-bottom: 2rem;} footer {padding-bottom: 2rem;}
}
@media only screen and (min-width: 125rem) {
body {background: url('assets/images/mountains.png') left calc(100% - 3rem) / 40rem auto no-repeat, url('assets/images/mountains2.png') calc(100% + 7rem) bottom / 50rem auto no-repeat, url("assets/images/bedge-grunge.png");}
} }