diff --git a/static/style.css b/static/style.css
index e4afdfd..6578c52 100644
--- a/static/style.css
+++ b/static/style.css
@@ -63,6 +63,11 @@ body {
background-color: var(--clr-bg);
margin: 24px;
}
+header {
+ margin: 0 0 48px;
+ padding: 0 0 24px;
+ border-bottom: 3px dashed rgba(0,0,0,0.5);
+}
.container {
width: 100%;
max-width: 800px;
@@ -89,6 +94,7 @@ a:hover {
}
h1 {
line-height: 1.2em;
+ margin: 8px 0 12px 0;
}
h2 {
color: var(--clr-header);
@@ -137,40 +143,40 @@ blockquote strong em {
color: var(--clr-text-highlight);
}
-header.card {
- margin-bottom: 64px;
+.id-card {
+ margin: 0 0 64px 0;
}
-header.card {
+.id-card {
display: flex;
align-items: center;
flex-wrap: wrap;
}
-header.card .header-image {
+.id-card .header-image {
flex: 1;
flex-basis: auto;
margin: 8px 32px 8px 0;
text-align: center;
}
-header.card .header-description {
+.id-card .header-description {
flex: 100;
flex-basis: auto;
/* min-width: 360px; */
margin: 8px 0;
/* text-align: center; */
}
-header.card .profile-picture {
+.id-card .profile-picture {
max-width: 160px;
border-radius: 100%;
}
-header.card h1 {
+.id-card h1 {
font-size: 1.4em;
margin: 0 0 16px;
}
-header.card p {
+.id-card p {
font-size: 1.1em;
margin: 0 0 8px;
}
-header.card .social a {
+.id-card .social a {
display: inline-block;
width: 20px;
height: 20px;
diff --git a/views/about.pug b/views/about.pug
index 0fb0064..53ff25a 100644
--- a/views/about.pug
+++ b/views/about.pug
@@ -2,14 +2,11 @@ extends layout
block content
header
- p
- | Back to:
- a(href="/") blog
+ nav
+ | about me
h1
| About Me
-
- main
- p
+ nav
| Go to:
a(href="/") blog
| |
@@ -24,6 +21,10 @@ block content
a(href="/pgp") PGP
| |
a(href="/contact") contact
+
+ main
+
+ include id
h2 >> About me
diff --git a/views/aotw.pug b/views/aotw.pug
index 5125209..e12d466 100644
--- a/views/aotw.pug
+++ b/views/aotw.pug
@@ -6,11 +6,11 @@ mixin entry($item)
block content
header
- p
- | Back to:
+ nav
a(href="/about") about me
| >
a(href="/music") music
+ | > album of the week
h1 Yarmo's Album Of The Week
main
diff --git a/views/blog_post.pug b/views/blog_post.pug
index a696b00..336a8aa 100644
--- a/views/blog_post.pug
+++ b/views/blog_post.pug
@@ -2,17 +2,20 @@ extends layout
block content
header
- p
- | Back to:
+ nav
+ a(href="/about") about me
+ | >
a(href="/") blog
-
- article.longform.h-entry
- h1.p-name !{$post['title']}
- p.longform__header
- | Posted on
- a(href="{$post['url']}" datetime="{$post['date']}").u-url.dt-published !{$post['date_formatted']}
- | by
- a(href="/" rel="author").p-author.h-card !{$post['author']}
-
- .longform__content.e-content
- | !{$post['content']}
+ | > !{$post['slug']}
+
+ main
+ article.longform.h-entry
+ h1.p-name !{$post['title']}
+ p.longform__header
+ | Posted on
+ a(href="{$post['url']}" datetime="{$post['date']}").u-url.dt-published !{$post['date_formatted']}
+ | by
+ a(href="/" rel="author").p-author.h-card !{$post['author']}
+
+ .longform__content.e-content
+ | !{$post['content']}
diff --git a/views/contact.pug b/views/contact.pug
index 43364b5..fb1dcc7 100644
--- a/views/contact.pug
+++ b/views/contact.pug
@@ -2,9 +2,9 @@ extends layout
block content
header
- p
- | Back to:
+ nav
a(href="/about") about me
+ | > contact
h1
| Contact me
diff --git a/views/foss.pug b/views/foss.pug
index bfe7884..4dd38ea 100644
--- a/views/foss.pug
+++ b/views/foss.pug
@@ -10,9 +10,9 @@ mixin foss_contribution($item)
block content
header
- p
- | Back to:
+ nav
a(href="/about") about me
+ | > foss
h1
| FOSS
diff --git a/views/id.pug b/views/id.pug
new file mode 100644
index 0000000..5da61cb
--- /dev/null
+++ b/views/id.pug
@@ -0,0 +1,26 @@
+.id-card
+ .header-image
+ img(src="/static/img/profile.png", alt="Yarmo's profile picture").profile-picture.u-photo
+
+ .header-description
+ h1
+ | I'm
+ a(href="https://yarmo.eu", rel="me", title="yarmo.eu").u-url.u-uid
+ span.p-name Yarmo Mackenbach
+ | (
+ a(href="https://pronoun.is/he").u-pronoun he/him/his
+ | )
+ p.p-note
+ | Finished a PhD in Neurosciences.
+ | Enjoys programming and making music.
+ | Advocates for FOSS and online privacy.
+ p
+ a(href="mailto:yarmo@qivro.xyz", rel="me", title="Email").u-email Email
+ | —
+ a(href="xmpp:yarmo@qivro.xyz", rel="me", title="XMPP").u-xmpp XMPP
+ | —
+ a(href="https://fosstodon.org/@yarmo", rel="me", title="Fediverse").u-url Fediverse
+ | —
+ a(href="https://git.yarmo.eu/yarmo", rel="me", title="Gitea").u-url Gitea
+ | —
+ a(href="/9F0048AC0B23301E1F77E994909F6BD6F80F485D.asc", download="/9F0048AC0B23301E1F77E994909F6BD6F80F485D.asc", rel="pgpkey publickey authn", type="text/plain", title="PGP public key") PGP
diff --git a/views/index.pug b/views/index.pug
index ffd2d6d..9a0ac8b 100644
--- a/views/index.pug
+++ b/views/index.pug
@@ -10,37 +10,16 @@ mixin entry($item)
block content
.h-card
- header.card
- .header-image
- img(src="/static/img/profile.png", alt="Yarmo's profile picture").profile-picture.u-photo
-
- .header-description
- h1
- | I'm
- a(href="https://yarmo.eu", rel="me", title="yarmo.eu").u-url.u-uid
- span.p-name Yarmo Mackenbach
- | (
- a(href="https://pronoun.is/he").u-pronoun he/him/his
- | )
- p.p-note
- | Finished a PhD in Neurosciences.
- | Enjoys programming and making music.
- | Advocates for FOSS and online privacy.
- p
- a(href="mailto:yarmo@qivro.xyz", rel="me", title="Email").u-email Email
- | —
- a(href="xmpp:yarmo@qivro.xyz", rel="me", title="XMPP").u-xmpp XMPP
- | —
- a(href="https://fosstodon.org/@yarmo", rel="me", title="Fediverse").u-url Fediverse
- | —
- a(href="https://git.yarmo.eu/yarmo", rel="me", title="Gitea").u-url Gitea
- | —
- a(href="/9F0048AC0B23301E1F77E994909F6BD6F80F485D.asc", download="/9F0048AC0B23301E1F77E994909F6BD6F80F485D.asc", rel="pgpkey publickey authn", type="text/plain", title="PGP public key") PGP
+ header
+ nav
+ a(href="/about") about me
+ | > blog
+ h1
+ | Yarmo's blog
main
- p
- | Go to:
- a(href="/about") about me
+
+ include id
.longform_list.h-feed
each $item in $posts
diff --git a/views/music.pug b/views/music.pug
index 9df2c31..a9245a5 100644
--- a/views/music.pug
+++ b/views/music.pug
@@ -2,9 +2,9 @@ extends layout
block content
header
- p
- | Back to:
+ nav
a(href="/about") about me
+ | > music
h1 Yarmo's music
p
| Go to:
diff --git a/views/notes.pug b/views/notes.pug
index f7085ea..6d5f3a9 100644
--- a/views/notes.pug
+++ b/views/notes.pug
@@ -10,9 +10,9 @@ mixin entry($item)
block content
header
- p
- | Back to:
+ nav
a(href="/about") about me
+ | > notes
h1 Yarmo's notes
main
diff --git a/views/notes_post.pug b/views/notes_post.pug
index da3155d..51dada0 100644
--- a/views/notes_post.pug
+++ b/views/notes_post.pug
@@ -2,12 +2,13 @@ extends layout
block content
header
- p
- | Back to:
+ nav
a(href="/about") about me
| >
a(href="/notes") notes
-
+ | > !{$post['slug']}
+
+ main
article.longform.h-entry
h1.p-name !{$post['title']}
p.longform__header
diff --git a/views/pgp.pug b/views/pgp.pug
index b0a9d1c..3beac63 100644
--- a/views/pgp.pug
+++ b/views/pgp.pug
@@ -2,9 +2,9 @@ extends layout
block content
header
- p
- | Back to:
+ nav
a(href="/about") about me
+ | > pgp
h1
| PGP public key
diff --git a/views/projects.pug b/views/projects.pug
index 47f9480..a7d200c 100644
--- a/views/projects.pug
+++ b/views/projects.pug
@@ -9,9 +9,9 @@ mixin entry($item)
block content
header
- p
- | Back to:
+ nav
a(href="/about") about me
+ | > projects
h1 Yarmo's projects
main
diff --git a/views/projects_details.pug b/views/projects_details.pug
index a0d002c..4256176 100644
--- a/views/projects_details.pug
+++ b/views/projects_details.pug
@@ -2,17 +2,18 @@ extends layout
block content
header
- p
- | Back to:
+ nav
a(href="/about") about me
| >
a(href="/projects") projects
- h1 !{$project['title']}
+ | > !{$project['slug']}
- article.longform
- p
- | Got an idea or a comment?
- a(href="/contact") Feel free to contact me!
- p.longform__header
- .longform__content
- | !{$project['content']}
+ main
+ article.longform
+ h1 !{$project['title']}
+ p
+ | Got an idea or a comment?
+ a(href="/contact") Feel free to contact me!
+ p.longform__header
+ .longform__content
+ | !{$project['content']}
diff --git a/views/vinyl.pug b/views/vinyl.pug
index 9f10a95..c5904bb 100644
--- a/views/vinyl.pug
+++ b/views/vinyl.pug
@@ -6,11 +6,11 @@ mixin entry($item)
block content
header
- p
- | Back to:
+ nav
a(href="/about") about me
| >
a(href="/music") music
+ | > vinyl
h1 Yarmo's vinyl collection
main