diff --git a/css.css b/css.css index c8bae16..aabbde5 100644 --- a/css.css +++ b/css.css @@ -13,12 +13,11 @@ font-size: 4rem; white-space: nowrap; text-align: center; - height: 5rem; } .welcome { display: block; - margin: 2rem auto; - width: 50%; + margin: 2vh auto; + width: 80%; text-align: center; } .slideDown { @@ -45,15 +44,14 @@ width: 100%; box-shadow: 0 -1px 15px 5px hsla(0, 0%, 0%, 0.8); float: left; - height: 30vh; background-color: #33353d; } .infoBlockMe { + height: 30vh; padding: 1rem; display: flex; align-items: center; justify-content: center; - height: 100%; width: 33%; border-right: #454752 2px solid; } @@ -71,7 +69,6 @@ } /* About Website */ .aboutPages { - height: 30vh; float: left; background-color: #33353d; width: 100%; @@ -83,11 +80,12 @@ display: flex; align-items: center; justify-content: center; - height: 100%; + height: 30vh; float: left; } .infoTextPages { width: 70%; + font-size: 2.5rem; text-align: center; } /* Mobile support */ @@ -106,6 +104,23 @@ /* Support for mobile devices */ @media screen and (min-width:0px) and (max-width:1000px) { .name { - font-size: 3rem; + font-size: 9vw; + } + .welcome { + font-size: 8vw; + } + .infoBlockPages { + width: 100%; + border: 0; + border-bottom: #454752 2px solid; + } + .infoBlockMe { + height: 20vh; + border: 0; + border-bottom: #454752 2px solid; + width: 100%; + } + .about { + display: block; } } diff --git a/gallery/css.css b/gallery/css.css index 782f4c8..902ae75 100644 --- a/gallery/css.css +++ b/gallery/css.css @@ -4,9 +4,15 @@ body { background-color: #212126!important; } +button { + border: 0; + padding: 0; + margin-top: 8px!important; +} .gallery { margin-top: calc(3rem + 55px); text-align: center; + font-size: 2vw; } .rowImg { display: flex; @@ -20,6 +26,23 @@ body { padding: 0 4px; } .columnImg img { - margin-top: 8px; width: 100%; } +@media screen and (min-width:500px) and (max-width:1000px) { + .columnImg { + flex: 50%; + max-width: 50%; + } + .gallery { + font-size: 3vw; + } +} +@media screen and (min-width:0px) and (max-width:500px) { + .columnImg { + flex: 100%; + max-width: 100%; + } + .gallery { + font-size: 5vw; + } +} diff --git a/gallery/index.html b/gallery/index.html index 968d7f1..b36190f 100644 --- a/gallery/index.html +++ b/gallery/index.html @@ -15,25 +15,22 @@

- Dit is de gallerij voor alle foto's die op deze website gebruikt zijn.
+ Dit is de gallerij voor alle foto's die op deze website gebruikt zijn. (Ik heb ze niet zelf gemaakt)
Er staan ook nog wat extra foto's bij die ik misschien nog wil gaan gebruiken.

- - - + +
- - - + +
- - - + +
diff --git a/index.html b/index.html index 5d4a19b..05fc022 100644 --- a/index.html +++ b/index.html @@ -22,11 +22,11 @@

Guus van Meerveld

Welkom op deze website!

- +
-
+

Mijn naam is Guus van Meerveld

Ik ben 15 jaar oud en heb deze website gebouwd

Als je suggesties hebt, ga dan naar contact

@@ -41,7 +41,7 @@

Het idee van deze website is om al mijn hobbys op een plek samen te brengen.

-
+

Ik vind het vooral leuk om foto's te maken, maar ook om te programmeren.

diff --git a/resources/img/nightcity.jpg b/resources/img/nightcity.jpg deleted file mode 100644 index 71e7dd3..0000000 Binary files a/resources/img/nightcity.jpg and /dev/null differ diff --git a/resources/img/riverwoods.jpg b/resources/img/riverwoods.jpg new file mode 100644 index 0000000..8cea118 Binary files /dev/null and b/resources/img/riverwoods.jpg differ diff --git a/resources/js/navbar.json.js b/resources/js/navbar.json.js index a54d921..06e4495 100644 --- a/resources/js/navbar.json.js +++ b/resources/js/navbar.json.js @@ -26,16 +26,16 @@ Navbar = [ }, { name: "Tools", - desc: "Tools for programming", + desc: "Tools voor programmeren", dropdown: [ { name: "Playground", - desc: "Test your HTML live!", + desc: "Test je HTML live!", link: "/playground" }, { name: "Minifier", - desc: "Minify your HTML/CSS/JavaScript", + desc: "Minify je HTML/CSS/JavaScript", link: "/minify" } ]