Improved navigation system
All checks were successful
continuous-integration/drone/push Build is passing
All checks were successful
continuous-integration/drone/push Build is passing
This commit is contained in:
parent
5368d2fff3
commit
f1506013c9
@ -63,6 +63,11 @@ body {
|
|||||||
background-color: var(--clr-bg);
|
background-color: var(--clr-bg);
|
||||||
margin: 24px;
|
margin: 24px;
|
||||||
}
|
}
|
||||||
|
header {
|
||||||
|
margin: 0 0 48px;
|
||||||
|
padding: 0 0 24px;
|
||||||
|
border-bottom: 3px dashed rgba(0,0,0,0.5);
|
||||||
|
}
|
||||||
.container {
|
.container {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
max-width: 800px;
|
max-width: 800px;
|
||||||
@ -89,6 +94,7 @@ a:hover {
|
|||||||
}
|
}
|
||||||
h1 {
|
h1 {
|
||||||
line-height: 1.2em;
|
line-height: 1.2em;
|
||||||
|
margin: 8px 0 12px 0;
|
||||||
}
|
}
|
||||||
h2 {
|
h2 {
|
||||||
color: var(--clr-header);
|
color: var(--clr-header);
|
||||||
@ -137,40 +143,40 @@ blockquote strong em {
|
|||||||
color: var(--clr-text-highlight);
|
color: var(--clr-text-highlight);
|
||||||
}
|
}
|
||||||
|
|
||||||
header.card {
|
.id-card {
|
||||||
margin-bottom: 64px;
|
margin: 0 0 64px 0;
|
||||||
}
|
}
|
||||||
header.card {
|
.id-card {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
}
|
}
|
||||||
header.card .header-image {
|
.id-card .header-image {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
flex-basis: auto;
|
flex-basis: auto;
|
||||||
margin: 8px 32px 8px 0;
|
margin: 8px 32px 8px 0;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
header.card .header-description {
|
.id-card .header-description {
|
||||||
flex: 100;
|
flex: 100;
|
||||||
flex-basis: auto;
|
flex-basis: auto;
|
||||||
/* min-width: 360px; */
|
/* min-width: 360px; */
|
||||||
margin: 8px 0;
|
margin: 8px 0;
|
||||||
/* text-align: center; */
|
/* text-align: center; */
|
||||||
}
|
}
|
||||||
header.card .profile-picture {
|
.id-card .profile-picture {
|
||||||
max-width: 160px;
|
max-width: 160px;
|
||||||
border-radius: 100%;
|
border-radius: 100%;
|
||||||
}
|
}
|
||||||
header.card h1 {
|
.id-card h1 {
|
||||||
font-size: 1.4em;
|
font-size: 1.4em;
|
||||||
margin: 0 0 16px;
|
margin: 0 0 16px;
|
||||||
}
|
}
|
||||||
header.card p {
|
.id-card p {
|
||||||
font-size: 1.1em;
|
font-size: 1.1em;
|
||||||
margin: 0 0 8px;
|
margin: 0 0 8px;
|
||||||
}
|
}
|
||||||
header.card .social a {
|
.id-card .social a {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
width: 20px;
|
width: 20px;
|
||||||
height: 20px;
|
height: 20px;
|
||||||
|
|||||||
@ -2,14 +2,11 @@ extends layout
|
|||||||
|
|
||||||
block content
|
block content
|
||||||
header
|
header
|
||||||
p
|
nav
|
||||||
| Back to:
|
| about me
|
||||||
a(href="/") blog
|
|
||||||
h1
|
h1
|
||||||
| About Me
|
| About Me
|
||||||
|
nav
|
||||||
main
|
|
||||||
p
|
|
||||||
| Go to:
|
| Go to:
|
||||||
a(href="/") blog
|
a(href="/") blog
|
||||||
| |
|
| |
|
||||||
@ -24,6 +21,10 @@ block content
|
|||||||
a(href="/pgp") PGP
|
a(href="/pgp") PGP
|
||||||
| |
|
| |
|
||||||
a(href="/contact") contact
|
a(href="/contact") contact
|
||||||
|
|
||||||
|
main
|
||||||
|
|
||||||
|
include id
|
||||||
|
|
||||||
h2 >> About me
|
h2 >> About me
|
||||||
|
|
||||||
|
|||||||
@ -6,11 +6,11 @@ mixin entry($item)
|
|||||||
|
|
||||||
block content
|
block content
|
||||||
header
|
header
|
||||||
p
|
nav
|
||||||
| Back to:
|
|
||||||
a(href="/about") about me
|
a(href="/about") about me
|
||||||
| >
|
| >
|
||||||
a(href="/music") music
|
a(href="/music") music
|
||||||
|
| > album of the week
|
||||||
h1 Yarmo's Album Of The Week
|
h1 Yarmo's Album Of The Week
|
||||||
|
|
||||||
main
|
main
|
||||||
|
|||||||
@ -2,17 +2,20 @@ extends layout
|
|||||||
|
|
||||||
block content
|
block content
|
||||||
header
|
header
|
||||||
p
|
nav
|
||||||
| Back to:
|
a(href="/about") about me
|
||||||
|
| >
|
||||||
a(href="/") blog
|
a(href="/") blog
|
||||||
|
| > !{$post['slug']}
|
||||||
article.longform.h-entry
|
|
||||||
h1.p-name !{$post['title']}
|
main
|
||||||
p.longform__header
|
article.longform.h-entry
|
||||||
| Posted on
|
h1.p-name !{$post['title']}
|
||||||
a(href="{$post['url']}" datetime="{$post['date']}").u-url.dt-published !{$post['date_formatted']}
|
p.longform__header
|
||||||
| by
|
| Posted on
|
||||||
a(href="/" rel="author").p-author.h-card !{$post['author']}
|
a(href="{$post['url']}" datetime="{$post['date']}").u-url.dt-published !{$post['date_formatted']}
|
||||||
|
| by
|
||||||
.longform__content.e-content
|
a(href="/" rel="author").p-author.h-card !{$post['author']}
|
||||||
| !{$post['content']}
|
|
||||||
|
.longform__content.e-content
|
||||||
|
| !{$post['content']}
|
||||||
|
|||||||
@ -2,9 +2,9 @@ extends layout
|
|||||||
|
|
||||||
block content
|
block content
|
||||||
header
|
header
|
||||||
p
|
nav
|
||||||
| Back to:
|
|
||||||
a(href="/about") about me
|
a(href="/about") about me
|
||||||
|
| > contact
|
||||||
h1
|
h1
|
||||||
| Contact me
|
| Contact me
|
||||||
|
|
||||||
|
|||||||
@ -10,9 +10,9 @@ mixin foss_contribution($item)
|
|||||||
|
|
||||||
block content
|
block content
|
||||||
header
|
header
|
||||||
p
|
nav
|
||||||
| Back to:
|
|
||||||
a(href="/about") about me
|
a(href="/about") about me
|
||||||
|
| > foss
|
||||||
h1
|
h1
|
||||||
| FOSS
|
| FOSS
|
||||||
|
|
||||||
|
|||||||
26
views/id.pug
Normal file
26
views/id.pug
Normal file
@ -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 <span class="p-category">Neurosciences</span>.<br>
|
||||||
|
| Enjoys <span class="p-category">programming</span> and <span class="p-category">making music</span>.<br>
|
||||||
|
| Advocates for <span class="p-category">FOSS</span> and <span class="p-category">online privacy</span>.
|
||||||
|
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
|
||||||
@ -10,37 +10,16 @@ mixin entry($item)
|
|||||||
|
|
||||||
block content
|
block content
|
||||||
.h-card
|
.h-card
|
||||||
header.card
|
header
|
||||||
.header-image
|
nav
|
||||||
img(src="/static/img/profile.png", alt="Yarmo's profile picture").profile-picture.u-photo
|
a(href="/about") about me
|
||||||
|
| > blog
|
||||||
.header-description
|
h1
|
||||||
h1
|
| Yarmo's blog
|
||||||
| 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 <span class="p-category">Neurosciences</span>.<br>
|
|
||||||
| Enjoys <span class="p-category">programming</span> and <span class="p-category">making music</span>.<br>
|
|
||||||
| Advocates for <span class="p-category">FOSS</span> and <span class="p-category">online privacy</span>.
|
|
||||||
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
|
|
||||||
|
|
||||||
main
|
main
|
||||||
p
|
|
||||||
| Go to:
|
include id
|
||||||
a(href="/about") about me
|
|
||||||
|
|
||||||
.longform_list.h-feed
|
.longform_list.h-feed
|
||||||
each $item in $posts
|
each $item in $posts
|
||||||
|
|||||||
@ -2,9 +2,9 @@ extends layout
|
|||||||
|
|
||||||
block content
|
block content
|
||||||
header
|
header
|
||||||
p
|
nav
|
||||||
| Back to:
|
|
||||||
a(href="/about") about me
|
a(href="/about") about me
|
||||||
|
| > music
|
||||||
h1 Yarmo's music
|
h1 Yarmo's music
|
||||||
p
|
p
|
||||||
| Go to:
|
| Go to:
|
||||||
|
|||||||
@ -10,9 +10,9 @@ mixin entry($item)
|
|||||||
|
|
||||||
block content
|
block content
|
||||||
header
|
header
|
||||||
p
|
nav
|
||||||
| Back to:
|
|
||||||
a(href="/about") about me
|
a(href="/about") about me
|
||||||
|
| > notes
|
||||||
h1 Yarmo's notes
|
h1 Yarmo's notes
|
||||||
|
|
||||||
main
|
main
|
||||||
|
|||||||
@ -2,12 +2,13 @@ extends layout
|
|||||||
|
|
||||||
block content
|
block content
|
||||||
header
|
header
|
||||||
p
|
nav
|
||||||
| Back to:
|
|
||||||
a(href="/about") about me
|
a(href="/about") about me
|
||||||
| >
|
| >
|
||||||
a(href="/notes") notes
|
a(href="/notes") notes
|
||||||
|
| > !{$post['slug']}
|
||||||
|
|
||||||
|
main
|
||||||
article.longform.h-entry
|
article.longform.h-entry
|
||||||
h1.p-name !{$post['title']}
|
h1.p-name !{$post['title']}
|
||||||
p.longform__header
|
p.longform__header
|
||||||
|
|||||||
@ -2,9 +2,9 @@ extends layout
|
|||||||
|
|
||||||
block content
|
block content
|
||||||
header
|
header
|
||||||
p
|
nav
|
||||||
| Back to:
|
|
||||||
a(href="/about") about me
|
a(href="/about") about me
|
||||||
|
| > pgp
|
||||||
h1
|
h1
|
||||||
| PGP public key
|
| PGP public key
|
||||||
|
|
||||||
|
|||||||
@ -9,9 +9,9 @@ mixin entry($item)
|
|||||||
|
|
||||||
block content
|
block content
|
||||||
header
|
header
|
||||||
p
|
nav
|
||||||
| Back to:
|
|
||||||
a(href="/about") about me
|
a(href="/about") about me
|
||||||
|
| > projects
|
||||||
h1 Yarmo's projects
|
h1 Yarmo's projects
|
||||||
|
|
||||||
main
|
main
|
||||||
|
|||||||
@ -2,17 +2,18 @@ extends layout
|
|||||||
|
|
||||||
block content
|
block content
|
||||||
header
|
header
|
||||||
p
|
nav
|
||||||
| Back to:
|
|
||||||
a(href="/about") about me
|
a(href="/about") about me
|
||||||
| >
|
| >
|
||||||
a(href="/projects") projects
|
a(href="/projects") projects
|
||||||
h1 !{$project['title']}
|
| > !{$project['slug']}
|
||||||
|
|
||||||
article.longform
|
main
|
||||||
p
|
article.longform
|
||||||
| Got an idea or a comment?
|
h1 !{$project['title']}
|
||||||
a(href="/contact") Feel free to contact me!
|
p
|
||||||
p.longform__header
|
| Got an idea or a comment?
|
||||||
.longform__content
|
a(href="/contact") Feel free to contact me!
|
||||||
| !{$project['content']}
|
p.longform__header
|
||||||
|
.longform__content
|
||||||
|
| !{$project['content']}
|
||||||
|
|||||||
@ -6,11 +6,11 @@ mixin entry($item)
|
|||||||
|
|
||||||
block content
|
block content
|
||||||
header
|
header
|
||||||
p
|
nav
|
||||||
| Back to:
|
|
||||||
a(href="/about") about me
|
a(href="/about") about me
|
||||||
| >
|
| >
|
||||||
a(href="/music") music
|
a(href="/music") music
|
||||||
|
| > vinyl
|
||||||
h1 Yarmo's vinyl collection
|
h1 Yarmo's vinyl collection
|
||||||
|
|
||||||
main
|
main
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user