diff --git a/.gitignore b/.gitignore index 706ec48..7f8a044 100644 --- a/.gitignore +++ b/.gitignore @@ -1,5 +1,6 @@ .idea/ _site/ node_modules/ +src/static/gallery/ package-lock.json \ No newline at end of file diff --git a/src/_data/photos.json b/src/_data/photos.json new file mode 100644 index 0000000..32303ef --- /dev/null +++ b/src/_data/photos.json @@ -0,0 +1,13 @@ +{ + "photos": [ + "001.jpg", + "002.jpg", + "003.jpg", + "004.jpg", + "005.jpg", + "006.jpg", + "007.jpg", + "008.jpg", + "009.jpg" + ] +} \ No newline at end of file diff --git a/src/_data/projects.json b/src/_data/projects.json index ec7eec8..21fa798 100644 --- a/src/_data/projects.json +++ b/src/_data/projects.json @@ -19,7 +19,7 @@ "link": "https://github.com/KoenDR06/nix-config" }, { - "name": "nix-config", + "name": "NixOS Config", "text": "The configurations for my NixOS machines. It includes configuration for all my apps, window managers, network, timezones, and more. It's also modularized so that adding a new machine with unique property is a breeze.", "photo": "/static/nixos.svg", "link": "https://github.com/KoenDR06/nix-config" diff --git a/src/_includes/base.liquid b/src/_includes/base.liquid index 995d54f..b3158cc 100644 --- a/src/_includes/base.liquid +++ b/src/_includes/base.liquid @@ -9,8 +9,6 @@ - - @@ -31,6 +29,7 @@
GitHub LinkedIn + LinkedIn
diff --git a/src/_includes/empty.liquid b/src/_includes/empty.liquid new file mode 100644 index 0000000..e36fd9d --- /dev/null +++ b/src/_includes/empty.liquid @@ -0,0 +1,19 @@ + + + + + {{ title }} + + + + + + + + + +
+ {{ content }} +
+ + diff --git a/src/pages/gallery.liquid b/src/pages/gallery.liquid new file mode 100644 index 0000000..d429f71 --- /dev/null +++ b/src/pages/gallery.liquid @@ -0,0 +1,47 @@ +--- +permalink: /gallery.html +title: Gallery +layout: empty +--- + +
+
+ Photo +
+
+ + +
+
+ + \ No newline at end of file diff --git a/src/pages/home.liquid b/src/pages/home.liquid index b29477f..058e3d9 100644 --- a/src/pages/home.liquid +++ b/src/pages/home.liquid @@ -3,6 +3,7 @@ permalink: / title: Koen de Ruiter --- + {% for p in projects.projects %}
Project sample photo diff --git a/src/static/floater.js b/src/static/floater.js index baa232a..0e0ae86 100644 --- a/src/static/floater.js +++ b/src/static/floater.js @@ -1,6 +1,5 @@ function clamp(value, min, max) { return Math.max( min, Math.min(value, max) ); } -const body = document.querySelector('body'); const beams = document.querySelector(".beams"); window.addEventListener("scroll", function(){ diff --git a/src/static/gallery.svg b/src/static/gallery.svg new file mode 100644 index 0000000..7a0b201 --- /dev/null +++ b/src/static/gallery.svg @@ -0,0 +1,9 @@ + + + + + + + + + \ No newline at end of file diff --git a/src/static/next.svg b/src/static/next.svg new file mode 100644 index 0000000..23ee212 --- /dev/null +++ b/src/static/next.svg @@ -0,0 +1,46 @@ + + + + + + + + + + + + diff --git a/src/static/prev.svg b/src/static/prev.svg new file mode 100644 index 0000000..1f259db --- /dev/null +++ b/src/static/prev.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/src/styles/photos.scss b/src/styles/photos.scss new file mode 100644 index 0000000..89a6843 --- /dev/null +++ b/src/styles/photos.scss @@ -0,0 +1,60 @@ +@use "vars"; + +body { + margin: 0; + font-family: "JetBrains Mono", serif; + background-color: vars.$bg-color; + color: vars.$primary; + overflow-x: hidden; +} + +main { + width: 100vw; + height: 100vh; + + display: flex; + justify-content: center; + align-items: center; + flex-direction: column; + + position: relative; + + animation: flyIn ease-out vars.$load-speed; +} + +.slideshow { + border: 5px solid vars.$secondary; + border-radius: 15px; +} + +img { + height: 80vh; + width: auto; + max-width: 80vw; + + + object-fit: contain; +} + +.hidden { + display: none; +} + +// --- CONTROLS --- +.control { + height: 40px; +} + +button { + background: inherit; + border: 0; +} + +.controls { + margin-top: 10px; + border: 5px solid vars.$secondary; + border-radius: 15px; + + display: flex; + justify-content: center; +} \ No newline at end of file diff --git a/src/styles/projects.scss b/src/styles/projects.scss index cb5db4f..2c8ce4b 100644 --- a/src/styles/projects.scss +++ b/src/styles/projects.scss @@ -2,6 +2,7 @@ .project { display: flex; + position: relative; margin-bottom: 100px; }