This commit is contained in:
Joost van der Schee 2022-12-08 16:31:09 +01:00
parent 3cba342e32
commit 567f2add6d
3 changed files with 6 additions and 3 deletions

BIN
assets/images/unalome.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

View File

@ -43,7 +43,8 @@
<section id="examples"> <section id="examples">
<h2>Examples</h2> <h2>Examples</h2>
<p>Below you will find some examples of websites with just two files.</p> <p>Below you will find some examples of websites with just two files. Want to submit your own website? Great!
Just build your website and send a link to <a href="mailto:joost@vdschee.nl">joost@vdschee.nl</a> and/or submit a <a href="https://github.com/jhvanderschee/zengardenwebsites">pull request</a>.</p>
<div class="examples"> <div class="examples">
<div> <div>
<a href="https://john-doe.neocities.org"><img src="assets/images/johndoe.png" alt="John Doe" /></a>by <a href="https://github.com/cadars/john-doe">cadars</a> <a href="https://john-doe.neocities.org"><img src="assets/images/johndoe.png" alt="John Doe" /></a>by <a href="https://github.com/cadars/john-doe">cadars</a>
@ -72,6 +73,7 @@
</main> </main>
<footer> <footer>
<img src="assets/images/unalome.png" alt="Unalome" />
<span>&copy; 2022 - zen garden websites</span> <span>&copy; 2022 - zen garden websites</span>
</footer> </footer>

View File

@ -6,7 +6,7 @@ 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;}
h2::before {content: ""; display: block; width: 2rem; height: 1.5rem; background: url('assets/images/lotus.png') center center / contain no-repeat; margin: 0 auto 0.4rem; opacity: 0.8;} h2::before {content: ""; display: block; width: 2rem; height: 1.5rem; background: url('assets/images/lotus.png') center center / contain no-repeat; margin: 0 auto 0.4rem; opacity: 0.8;}
p {margin-bottom: 1.5em;} p {margin-bottom: 1.5em;}
section {min-height: 30rem; padding: 12rem 2rem 12rem; display: none; align-items: center; flex-direction: column; justify-content: flex-start; margin: auto 0; min-height: calc(100vh - 1rem);} section {min-height: 30rem; padding: 12rem 2rem 15rem; display: none; align-items: center; flex-direction: column; justify-content: flex-start; margin: auto 0; min-height: calc(100vh - 1rem);}
section:target {display: flex;} section:target {display: flex;}
section a {text-decoration: underline;} section a {text-decoration: underline;}
section a:hover {text-decoration: none; color: rgb(155, 18, 18);} section a:hover {text-decoration: none; color: rgb(155, 18, 18);}
@ -23,6 +23,7 @@ header nav a {border-bottom: 1px solid transparent;}
header nav a.active, header nav a.active,
header nav a:hover {border-color: #3a3731;} header nav a:hover {border-color: #3a3731;}
footer {padding: 0 3rem 3.5rem; transform: translate(-50%, -100%); font-style: italic; font-size: 0.8rem;} footer {padding: 0 3rem 3.5rem; transform: translate(-50%, -100%); font-style: italic; font-size: 0.8rem;}
footer img {height: 7rem; opacity: 0.8; display: inline-block; margin: 0 0 0.75rem;}
main {margin: 0 auto;} main {margin: 0 auto;}
section#home img {width: 25rem; opacity: 0.8; margin: 1rem 0 0;} section#home img {width: 25rem; opacity: 0.8; margin: 1rem 0 0;}
div.examples {display: flex; gap: 2rem; flex-wrap: wrap; justify-content: center; margin: 1.5rem 0; text-align: center; font-style: italic;} div.examples {display: flex; gap: 2rem; flex-wrap: wrap; justify-content: center; margin: 1.5rem 0; text-align: center; font-style: italic;}
@ -32,7 +33,7 @@ div.examples > div a:first-child:hover img {transform: scale(1.05);}
@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: 11rem 1.25rem 12rem;} section {min-height: calc(100vh - 0.5rem); padding: 11rem 1.25rem 15rem;}
header {height: 12rem;} header {height: 12rem;}
footer {padding-bottom: 3rem;} footer {padding-bottom: 3rem;}
main::after, main::before {height: 0.5rem;} main::after, main::before {height: 0.5rem;}