Initial Commit
This commit is contained in:
commit
3da46b8e0e
16 changed files with 279 additions and 0 deletions
5
.gitignore
vendored
Normal file
5
.gitignore
vendored
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
.idea/
|
||||
_site/
|
||||
node_modules/
|
||||
|
||||
package-lock.json
|
||||
21
LICENSE
Normal file
21
LICENSE
Normal file
|
|
@ -0,0 +1,21 @@
|
|||
MIT License
|
||||
|
||||
Copyright (c) 2024 Mr Horseman
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
||||
12
eleventy.config.js
Normal file
12
eleventy.config.js
Normal file
|
|
@ -0,0 +1,12 @@
|
|||
export default function (eleventyConfig) {
|
||||
eleventyConfig.addPassthroughCopy("src/static/");
|
||||
eleventyConfig.addWatchTarget("src/styles/");
|
||||
|
||||
return {
|
||||
dir: {
|
||||
input: 'src',
|
||||
output: '_site'
|
||||
}
|
||||
};
|
||||
|
||||
}
|
||||
21
package.json
Normal file
21
package.json
Normal file
|
|
@ -0,0 +1,21 @@
|
|||
{
|
||||
"name": "portfolio",
|
||||
"version": "0.0.0",
|
||||
"author": "KoenDR06",
|
||||
"license": "MIT",
|
||||
"type": "module",
|
||||
"dependencies": {
|
||||
"@11ty/eleventy": "^3.0.0",
|
||||
"@11ty/eleventy-plugin-handlebars": "^1.0.0",
|
||||
"handlebars": "^4.7.8",
|
||||
"markdown-it": "^14.1.0",
|
||||
"sass": "^1.86.3"
|
||||
},
|
||||
"scripts": {
|
||||
"dev": "npx @11ty/eleventy --input src --serve",
|
||||
"dev:sass": "npx sass src/styles:_site/styles --watch",
|
||||
|
||||
"build": "npx @11ty/eleventy --input src",
|
||||
"build:sass": "npx sass src/styles:_site/styles"
|
||||
}
|
||||
}
|
||||
16
src/_data/nav.json
Normal file
16
src/_data/nav.json
Normal file
|
|
@ -0,0 +1,16 @@
|
|||
{
|
||||
"items": [
|
||||
{
|
||||
"url": "/",
|
||||
"name": "Home"
|
||||
},
|
||||
{
|
||||
"url": "/about/",
|
||||
"name": "About"
|
||||
},
|
||||
{
|
||||
"url": "/blog/",
|
||||
"name": "Blog"
|
||||
}
|
||||
]
|
||||
}
|
||||
4
src/_data/site.json
Normal file
4
src/_data/site.json
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
{
|
||||
"name": "Koen de Ruiter",
|
||||
"description": "An Eleventy demo site."
|
||||
}
|
||||
40
src/_includes/base.liquid
Normal file
40
src/_includes/base.liquid
Normal file
|
|
@ -0,0 +1,40 @@
|
|||
<!DOCTYPE html>
|
||||
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>{{ title }}</title>
|
||||
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,100;1,100&display=swap" rel="stylesheet">
|
||||
|
||||
<link rel="stylesheet" href="/styles/index.css">
|
||||
<link rel="stylesheet" href="/styles/waterdrops.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div>
|
||||
<div class="background">
|
||||
<div class="fixtures">
|
||||
<img class="fixture-photo" src="/static/fixture.png" alt="Ayrton Diablo S">
|
||||
<img class="fixture-photo flip" src="/static/fixture.png" alt="Ayrton Diablo S">
|
||||
</div>
|
||||
</div>
|
||||
<div class="front-page">
|
||||
<div class="title-card">
|
||||
<h1>Koen de Ruiter</h1>
|
||||
<h2>Developer, Lighting Designer</h2>
|
||||
|
||||
<div class="title-card__links">
|
||||
<a class="title-card__link" href="https://github.com/KoenDR06" target="_blank"><img class="title-card__image" src="/static/github.svg" alt="GitHub"></a>
|
||||
<a class="title-card__link" href="https://www.linkedin.com/in/koen-de-ruiter-20a9a2343/" target="_blank"><img class="title-card__image" src="/static/linkedin.svg" alt="LinkedIn"></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<main>
|
||||
{{ content }}
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
17
src/pages/home.html
Normal file
17
src/pages/home.html
Normal file
|
|
@ -0,0 +1,17 @@
|
|||
---
|
||||
permalink: /
|
||||
title: Koen de Ruiter
|
||||
---
|
||||
|
||||
<div class="project">
|
||||
<img src="https://media.discordapp.net/attachments/1278669058987790386/1288879720116523100/image.png?ex=67fbd347&is=67fa81c7&hm=d7c2275e311fe803f663366e18b239ce054dba1d562c37dc2039c44f3bb83a71&=&format=webp&quality=lossless">
|
||||
<div>
|
||||
<h2>WebTech</h2>
|
||||
<p>This is a university project I made with a group of three for a web technologies course.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--<div class="project">-->
|
||||
<!-- <h2>Mandelbrot</h2>-->
|
||||
<!-- <p>This is a mandelbrot renderer I wrote in C++.</p>-->
|
||||
<!--</div>-->
|
||||
4
src/pages/pages.json
Normal file
4
src/pages/pages.json
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
{
|
||||
"layout": "base",
|
||||
"permalink": "/{{ title | slug }}/"
|
||||
}
|
||||
BIN
src/static/fixture.png
Normal file
BIN
src/static/fixture.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 368 KiB |
4
src/static/github.svg
Normal file
4
src/static/github.svg
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
<!DOCTYPE svg>
|
||||
<svg width="800px" height="800px" viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#000000">
|
||||
<g> <g stroke-width="1" fill="none" fill-rule="evenodd"> <g id="Dribbble-Light-Preview" transform="translate(-140.000000, -7559.000000)" fill="#bf616a"> <g id="icons" transform="translate(56.000000, 160.000000)"> <path d="M94,7399 C99.523,7399 104,7403.59 104,7409.253 C104,7413.782 101.138,7417.624 97.167,7418.981 C96.66,7419.082 96.48,7418.762 96.48,7418.489 C96.48,7418.151 96.492,7417.047 96.492,7415.675 C96.492,7414.719 96.172,7414.095 95.813,7413.777 C98.04,7413.523 100.38,7412.656 100.38,7408.718 C100.38,7407.598 99.992,7406.684 99.35,7405.966 C99.454,7405.707 99.797,7404.664 99.252,7403.252 C99.252,7403.252 98.414,7402.977 96.505,7404.303 C95.706,7404.076 94.85,7403.962 94,7403.958 C93.15,7403.962 92.295,7404.076 91.497,7404.303 C89.586,7402.977 88.746,7403.252 88.746,7403.252 C88.203,7404.664 88.546,7405.707 88.649,7405.966 C88.01,7406.684 87.619,7407.598 87.619,7408.718 C87.619,7412.646 89.954,7413.526 92.175,7413.785 C91.889,7414.041 91.63,7414.493 91.54,7415.156 C90.97,7415.418 89.522,7415.871 88.63,7414.304 C88.63,7414.304 88.101,7413.319 87.097,7413.247 C87.097,7413.247 86.122,7413.234 87.029,7413.87 C87.029,7413.87 87.684,7414.185 88.139,7415.37 C88.139,7415.37 88.726,7417.2 91.508,7416.58 C91.513,7417.437 91.522,7418.245 91.522,7418.489 C91.522,7418.76 91.338,7419.077 90.839,7418.982 C86.865,7417.627 84,7413.783 84,7409.253 C84,7403.59 88.478,7399 94,7399" id="github-[#142]"> </path> </g> </g> </g> </g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.6 KiB |
11
src/static/linkedin.svg
Normal file
11
src/static/linkedin.svg
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Transformed by: SVG Repo Mixer Tools -->
|
||||
<svg fill="#bf616a" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="-271 283.9 256 235.1" xml:space="preserve" width="800px" height="800px" stroke="#bf616a">
|
||||
|
||||
<g id="SVGRepo_bgCarrier" stroke-width="0"/>
|
||||
|
||||
<g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
|
||||
<g id="SVGRepo_iconCarrier"> <g> <rect x="-264.4" y="359.3" width="49.9" height="159.7"/> <path d="M-240.5,283.9c-18.4,0-30.5,11.9-30.5,27.7c0,15.5,11.7,27.7,29.8,27.7h0.4c18.8,0,30.5-12.3,30.4-27.7 C-210.8,295.8-222.1,283.9-240.5,283.9z"/> <path d="M-78.2,357.8c-28.6,0-46.5,15.6-49.8,26.6v-25.1h-56.1c0.7,13.3,0,159.7,0,159.7h56.1v-86.3c0-4.9-0.2-9.7,1.2-13.1 c3.8-9.6,12.1-19.6,27-19.6c19.5,0,28.3,14.8,28.3,36.4V519h56.6v-88.8C-14.9,380.8-42.7,357.8-78.2,357.8z"/> </g> </g>
|
||||
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1,022 B |
17
src/styles/index.scss
Normal file
17
src/styles/index.scss
Normal file
|
|
@ -0,0 +1,17 @@
|
|||
@use "sass:meta";
|
||||
@use "vars";
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: "JetBrains Mono", serif;
|
||||
background-color: vars.$bg-color;
|
||||
color: vars.$primary;
|
||||
}
|
||||
|
||||
.flip {
|
||||
transform: scaleX(-1);
|
||||
}
|
||||
|
||||
|
||||
@include meta.load-css("title-card");
|
||||
@include meta.load-css("projects");
|
||||
14
src/styles/projects.scss
Normal file
14
src/styles/projects.scss
Normal file
|
|
@ -0,0 +1,14 @@
|
|||
@use "vars";
|
||||
|
||||
.project {
|
||||
display: flex;
|
||||
justify-content: space-evenly;
|
||||
}
|
||||
|
||||
.project h2 {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
font-size: 2em;
|
||||
|
||||
color: vars.$accent-1;
|
||||
}
|
||||
89
src/styles/title-card.scss
Normal file
89
src/styles/title-card.scss
Normal file
|
|
@ -0,0 +1,89 @@
|
|||
@use "vars";
|
||||
|
||||
.front-page {
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
position: relative;
|
||||
|
||||
animation: flyIn ease 2s;
|
||||
}
|
||||
|
||||
.title-card {
|
||||
height: fit-content;
|
||||
|
||||
color: vars.$primary;
|
||||
border: 8px solid vars.$secondary;
|
||||
border-radius: 15px;
|
||||
background-color: vars.$bg-color;
|
||||
|
||||
padding: 20px;
|
||||
text-align: center;
|
||||
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
.title-card h1 {
|
||||
margin-bottom: 0;
|
||||
margin-top: 0;
|
||||
|
||||
font-size: 2.5em;
|
||||
}
|
||||
|
||||
.title-card h2 {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
font-size: 1em;
|
||||
|
||||
color: vars.$accent-1;
|
||||
}
|
||||
|
||||
.title-card__links {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.title-card__link {
|
||||
margin-left: 15px;
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
.title-card__image {
|
||||
width: 50px;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.background {
|
||||
position: absolute;
|
||||
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
|
||||
animation: flyIn ease 2s;
|
||||
}
|
||||
|
||||
.fixtures {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.fixtures > img {
|
||||
height: 600px;
|
||||
}
|
||||
|
||||
@keyframes flyIn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
top: 50px;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
4
src/styles/vars.scss
Normal file
4
src/styles/vars.scss
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
$bg-color: #1e222a;
|
||||
$primary: #80a0c0;
|
||||
$secondary: #4f6175;
|
||||
$accent-1: #b48ead;
|
||||
Loading…
Add table
Add a link
Reference in a new issue