initial commit heavily inspired by staacks.de

This commit is contained in:
Wouter Groeneveld 2023-11-15 10:19:25 +01:00
commit a1c048920b
5 changed files with 169 additions and 0 deletions

1
.gitignore vendored Normal file
View File

@ -0,0 +1 @@
*.sublime-workspace

47
index.html Normal file
View File

@ -0,0 +1,47 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>Wouter Groeneveld</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" type="text/css" href="woutergr.css" />
</head>
<body>
<div id="header">
<div id="image"></div>
<h1><span class="decrease">dr. </span>Wouter Groeneveld</h1>
<div id="profession">Brain Baker</div>
<p id="keywords">Baker, Software Engineer, Computing Education Researcher, Writer, Teacher.</p>
<div id="scrollhint">&darr;</div>
</div>
<h2>Contact and links</h2>
<dl>
<dt>Blog</dt>
<dd><a href="https://brainbaking.com">brainbaking.com</a></dd>
<dt>Affiliation</dt>
<dd><a href="https://iiw.kuleuven.be/onderzoek/ether">KU Leuven, Engineering Technology Education Research</a></dd>
<dt>Google Scholar</dt>
<dd><a href="https://scholar.google.com/citations?user=bvEeAtoAAAAJ&hl=en">scholar.google.com</a></dd>
<dt>Email</dt>
<dd><a href="mailto:wouter@brainbaking.com">wouter@brainbaking.com</a></dd>
</dl>
<section class="refs">
<h2>Curriculum vitae</h2>
<ul class="cv">
<li>
<span class="date">since 2018</span>
<span class="title">KU Leuven</span><br />
PhD researcher
</li>
<li>
<span class="date">1985</span>
<span class="title">Birth.</span>
</li>
</ul>
</section>
</body>
</html>

BIN
profile.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 180 KiB

113
woutergr.css Normal file
View File

@ -0,0 +1,113 @@
html {
font-family: Palatino, serif;
font-size: 100%;
color: white;
width: 100%;
margin: 0;
background: black;
text-size-adjust: none;
}
body {
max-width: 60em;
margin: 0 auto;
padding: 0 1em 1em 1em;
}
a {
color: #80b0ff;
}
body section.refs ul li.expanded .date {
color: #80b0ff;
}
#image {
background-image: url("profile.png");
background-repeat: no-repeat;
background-position: right bottom;
background-size: contain;
height: 25vh;
}
@media (prefers-color-scheme: light) {
html {
color: black;
background: white;
}
a {
color: #6080a0;
}
body section.refs ul li.expanded .date {
color: #6080a0;
}
}
#header {
font-size: 125%;
width: 100%;
height: 70vh;
padding-top: 30vh;
}
.decrease {
font-size: 66%;
}
dl {
display: grid;
grid-template-columns: 8em auto;
}
@media only screen and (max-width: 40rem) {
dl {
display: block;
}
}
h1 {
text-align: right;
margin: 0.1em 0;
}
#profession {
text-align: right;
font-size: 125%;
font-style: italic;
}
h2 {
margin-top: 3em;
}
#keywords {
text-align: center;
font-style: italic;
margin-top: 5em;
}
#scrollhint {
font-size: 200%;
text-align: center;
}
section.refs ul li.expanded .date {
color: #80b0ff;
}
@media (prefers-color-scheme: light) {
section.refs ul li.expanded .date {
color: #6080a0;
}
section.refs > ul > li.invited::after {
border: 1px solid black;
}
section.refs > ul > li > ul > li::after {
border: 1px solid black !important;
}
}

8
woutergr.sublime-project Normal file
View File

@ -0,0 +1,8 @@
{
"folders":
[
{
"path": "."
}
]
}