From ebaaaa19631c30412748e963255887577ae3e541 Mon Sep 17 00:00:00 2001 From: Yarmo Mackenbach Date: Sat, 13 Jun 2020 22:34:57 +0200 Subject: [PATCH] Fix many random layout issues, making blog default view --- index.php | 18 +++- static/style.css | 15 +-- views/about.pug | 160 ++++++++++++++++++++++++++++++++ views/about0.pug | 180 ++++++++++++++++++++++++++++++++++++ views/aotw.pug | 13 ++- views/blog_post.pug | 8 +- views/contact.pug | 3 +- views/foss.pug | 3 +- views/index.pug | 185 +++++-------------------------------- views/music.pug | 90 +++++++++--------- views/notes.pug | 36 ++++---- views/notes_post.pug | 8 +- views/pgp.pug | 5 +- views/projects.pug | 19 ++-- views/projects_details.pug | 8 +- views/vinyl.pug | 19 ++-- 16 files changed, 506 insertions(+), 264 deletions(-) create mode 100644 views/about.pug create mode 100644 views/about0.pug diff --git a/index.php b/index.php index 86b6382..c81cd43 100644 --- a/index.php +++ b/index.php @@ -9,6 +9,7 @@ $router = new AltoRouter(); // Router mapping $router->map('GET', '/', function() {}, 'home'); +$router->map('GET', '/about', function() {}, 'about'); $router->map('GET', '/rss', function() {}, 'rss'); $router->map('GET', '/rss.xml', function() {}, 'rss-xml'); $router->map('GET', '/rss/all', function() {}, 'rss-all'); @@ -51,7 +52,12 @@ $variables = [ // If we are dealing with the home page if ($match['name'] == 'home') { - $variables['icons'] = getIcons(); + $variables['posts'] = getBlogPosts($variables['params']); + // $variables['icons'] = getIcons(); +} + +// If we are dealing with the about page +if ($match['name'] == 'about') { } // If we are dealing with the rss feed @@ -170,6 +176,12 @@ if ($environment === 'production') { // Phug::displayFile('index', $variables, $options); break; + case 'about': + // Phug optimizer + \Phug\Optimizer::call('displayFile', ['about', $variables], $options); + // Phug::displayFile('index', $variables, $options); + break; + case 'rss': case 'rss-xml': case 'rss-all': @@ -246,6 +258,10 @@ if(is_array($match) && is_callable($match['target'])) { Phug::displayFile('index', $variables, $options); break; + case 'about': + Phug::displayFile('about', $variables, $options); + break; + case 'rss': case 'rss-xml': case 'rss-all': diff --git a/static/style.css b/static/style.css index 82c48ca..a84ee11 100644 --- a/static/style.css +++ b/static/style.css @@ -148,7 +148,7 @@ header.h-card { .h-card .header-image { flex: 1; flex-basis: auto; - margin: 8px 0; + margin: 8px 32px 8px 0; text-align: center; } .h-card .header-description { @@ -156,7 +156,7 @@ header.h-card { flex-basis: auto; /* min-width: 360px; */ margin: 8px 0; - text-align: center; + /* text-align: center; */ } .h-card .profile-picture { max-width: 160px; @@ -251,11 +251,14 @@ table.music th:nth-child(3) { margin: 2em 0 0; } .longform_list__item { - margin: 1em 0 0; + margin: 2em 0 0; + font-family: 'Lora', Georgia, Times, serif; +} +.longform_list__item a { + display: inline-block; + margin: 4px 0; + font-size: 1.3em; } -/* .longform_list__item a { - font-size: 1.4em; -} */ .longform__header { font-size: 0.9em; diff --git a/views/about.pug b/views/about.pug new file mode 100644 index 0000000..0fb0064 --- /dev/null +++ b/views/about.pug @@ -0,0 +1,160 @@ +extends layout + +block content + header + p + | Back to: + a(href="/") blog + h1 + | About Me + + main + p + | Go to: + a(href="/") blog + | | + a(href="/notes") notes + | | + a(href="/foss") FOSS + | | + a(href="/projects") projects + | | + a(href="/music") music + | | + a(href="/pgp") PGP + | | + a(href="/contact") contact + + h2 >> About me + + h3 Principles + ul + li The internet needs to be decentralized + li + a(href="https://publiccode.eu/") Public money? Public code! + li Open science benefits society + li Code documentation is essential + li + | Remove + a(href="https://en.wikipedia.org/wiki/Big_Four_tech_companies") GAFAM + | from once's life + + h3 Interests + ul + li Advancing and democratizing science + li Building and maintaining a homelab + li Statistics, machine learning + li Writing decent code + li Making music + li Halo universe + li Podcasts + + h3 Languages (spoken, written, read) + ul + li Dutch (native) + li English (+++) + li French (+++) + li Portuguese (+) + + h2 >> Science + p I have finished a PhD project in the field of Neurosciences. My research focused on the neuronal basis of directional hearing. + + h3 Skills + ul + li + i In vivo + | electrophysiology + li Histology + li Behavioral techniques + li Programming & data analysis + li Database management (SQL & NoSQL) + + h3 Work experience + .wrapper-table + table.work-experience + thead + tr + th Years + th Name + th Location + tbody + tr + td 2015-2019 + td PhD in Neurosciences + td Erasmus MC, Rotterdam, The Netherlands + + h3 Academic record + .wrapper-table + table.academic-record + thead + tr + th Years + th Name + th Location + tbody + tr + td 2010-2013 + td Bachelor Biology + td Université Victor Segalen, Bordeaux, France + tr + td 2013-2015 + td Master Neurosciences & Neuropsychopharmacology + td Université Victor Segalen, Bordeaux, France + tr + td 2013-2015 + td Master Cellular & Molecular Biology + td Universidade de Coimbra, Portugal + tr + td 2015-2019 + td PhD in Neurosciences + td Erasmus MC, Rotterdam, The Netherlands + + h3 Publications + .wrapper-table + table.publications + thead + tr + th Years + th Authors + th Title + tbody + tr + td 2017 + td Arnau Busquets-Garcia, [...], Giovanni Marsicano + td + a(href="https://www.nature.com/articles/mp20174") Pregnenolone blocks cannabinoid-induced acute psychotic-like states in mice + + h2 >> Programming + + h3 Languages used + ul + li Matlab / Octave + li Python + li R + li HTML / JS / (S)CSS + li PHP / NodeJS + li SQL / NoSQL (cypher) + + h3 Experience (science) + ul + li Data visualisation + li Fourier / signal processing + li Circular statistics + li Machine learning + + h3 Experience (hobbies) + ul + li Homelab / self-hosting + li Web design + li Raspberry Pi / Arduino + li Home automation + + h3 Open source contributions + p + | Go to: + a(href="/foss") FOSS + + h2 >> Music + p + | Go to: + a(href="/music") music diff --git a/views/about0.pug b/views/about0.pug new file mode 100644 index 0000000..47049f5 --- /dev/null +++ b/views/about0.pug @@ -0,0 +1,180 @@ +extends layout + +block content + header.h-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 + + main + p + | Go to: + a(href="/") blog + | | + a(href="/notes") notes + | | + a(href="/foss") FOSS + | | + a(href="/projects") projects + | | + a(href="/music") music + | | + a(href="/pgp") PGP + | | + a(href="/contact") contact + + h2 >> About me + + h3 Principles + ul + li The internet needs to be decentralized + li + a(href="https://publiccode.eu/") Public money? Public code! + li Open science benefits society + li Code documentation is essential + li + | Remove + a(href="https://en.wikipedia.org/wiki/Big_Four_tech_companies") GAFAM + | from once's life + + h3 Interests + ul + li Advancing and democratizing science + li Building and maintaining a homelab + li Statistics, machine learning + li Writing decent code + li Making music + li Halo universe + li Podcasts + + h3 Languages (spoken, written, read) + ul + li Dutch (native) + li English (+++) + li French (+++) + li Portuguese (+) + + h2 >> Science + p I have finished a PhD project in the field of Neurosciences. My research focused on the neuronal basis of directional hearing. + + h3 Skills + ul + li + i In vivo + | electrophysiology + li Histology + li Behavioral techniques + li Programming & data analysis + li Database management (SQL & NoSQL) + + h3 Work experience + .wrapper-table + table.work-experience + thead + tr + th Years + th Name + th Location + tbody + tr + td 2015-2019 + td PhD in Neurosciences + td Erasmus MC, Rotterdam, The Netherlands + + h3 Academic record + .wrapper-table + table.academic-record + thead + tr + th Years + th Name + th Location + tbody + tr + td 2010-2013 + td Bachelor Biology + td Université Victor Segalen, Bordeaux, France + tr + td 2013-2015 + td Master Neurosciences & Neuropsychopharmacology + td Université Victor Segalen, Bordeaux, France + tr + td 2013-2015 + td Master Cellular & Molecular Biology + td Universidade de Coimbra, Portugal + tr + td 2015-2019 + td PhD in Neurosciences + td Erasmus MC, Rotterdam, The Netherlands + + h3 Publications + .wrapper-table + table.publications + thead + tr + th Years + th Authors + th Title + tbody + tr + td 2017 + td Arnau Busquets-Garcia, [...], Giovanni Marsicano + td + a(href="https://www.nature.com/articles/mp20174") Pregnenolone blocks cannabinoid-induced acute psychotic-like states in mice + + h2 >> Programming + + h3 Languages used + ul + li Matlab / Octave + li Python + li R + li HTML / JS / (S)CSS + li PHP / NodeJS + li SQL / NoSQL (cypher) + + h3 Experience (science) + ul + li Data visualisation + li Fourier / signal processing + li Circular statistics + li Machine learning + + h3 Experience (hobbies) + ul + li Homelab / self-hosting + li Web design + li Raspberry Pi / Arduino + li Home automation + + h3 Open source contributions + p + | Go to: + a(href="/foss") FOSS + + h2 >> Music + p + | Go to: + a(href="/music") music diff --git a/views/aotw.pug b/views/aotw.pug index 70a60a4..5125209 100644 --- a/views/aotw.pug +++ b/views/aotw.pug @@ -5,10 +5,15 @@ mixin entry($item) p !{$item['week']} >> !{$item['artist']} - !{$item['title']} (!{$item['year']}) block content - p - | Back to: - a(href="/") yarmo.eu - h1 Yarmo's Album Of The Week + header + p + | Back to: + a(href="/about") about me + | > + a(href="/music") music + h1 Yarmo's Album Of The Week + + main .list each $item in $albums +entry($item) diff --git a/views/blog_post.pug b/views/blog_post.pug index 8a074cd..1c34822 100644 --- a/views/blog_post.pug +++ b/views/blog_post.pug @@ -1,12 +1,12 @@ extends layout block content - .longform + header p | Back to: - a(href="/") yarmo.eu - | > - a(href="/blog") blog + a(href="/") blog + + article.longform h1 !{$post['title']} p.longform__header Posted on !{$post['date_formatted']} by !{$post['author']} .longform__content diff --git a/views/contact.pug b/views/contact.pug index 7874989..43364b5 100644 --- a/views/contact.pug +++ b/views/contact.pug @@ -4,10 +4,11 @@ block content header p | Back to: - a(href="/") yarmo.eu + a(href="/about") about me h1 | Contact me + main h2 >> Online presence .wrapper-table diff --git a/views/foss.pug b/views/foss.pug index 6d96f00..bfe7884 100644 --- a/views/foss.pug +++ b/views/foss.pug @@ -12,10 +12,11 @@ block content header p | Back to: - a(href="/") yarmo.eu + a(href="/about") about me h1 | FOSS + main h2 >> VCS accounts .wrapper-table diff --git a/views/index.pug b/views/index.pug index f1a5398..f3f1ac9 100644 --- a/views/index.pug +++ b/views/index.pug @@ -1,5 +1,12 @@ extends layout +mixin entry($item) + .longform_list__item + p + a(href="{$item['urlrel']}") !{$item['title']} + br + | !{$item['date_formatted']} + block content header.h-card .header-image @@ -17,172 +24,22 @@ block content | 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 main p | Go to: - a(href="/blog") blog - | | - a(href="/notes") notes - | | - a(href="/foss") FOSS - | | - a(href="/projects") projects - | | - a(href="/music") music - | | - a(href="/pgp") PGP - | | - a(href="/contact") contact + a(href="/about") about me - h2 >> Quick links - 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="https://gitlab.com/yarmo", rel="me", title="GitLab").u-url GitLab - | // - a(href="https://github.com/YarmoM", rel="me", title="Github").u-url Github - | // - a(href="/9F0048AC0B23301E1F77E994909F6BD6F80F485D.asc", download="/9F0048AC0B23301E1F77E994909F6BD6F80F485D.asc", rel="pgpkey publickey authn", type="text/plain", title="PGP public key") PGP - | // - a(href="/rss/all", title="RSS") RSS - - h2 >> About me - - h3 Principles - ul - li The internet needs to be decentralized - li - a(href="https://publiccode.eu/") Public money? Public code! - li Open science benefits society - li Code documentation is essential - li - | Remove - a(href="https://en.wikipedia.org/wiki/Big_Four_tech_companies") GAFAM - | from once's life - - h3 Interests - ul - li Advancing and democratizing science - li Building and maintaining a homelab - li Statistics, machine learning - li Writing decent code - li Making music - li Halo universe - li Podcasts - - h3 Languages (spoken, written, read) - ul - li Dutch (native) - li English (+++) - li French (+++) - li Portuguese (+) - - h2 >> Science - p I have finished a PhD project in the field of Neurosciences. My research focused on the neuronal basis of directional hearing. - - h3 Skills - ul - li - i In vivo - | electrophysiology - li Histology - li Behavioral techniques - li Programming & data analysis - li Database management (SQL & NoSQL) - - h3 Work experience - .wrapper-table - table.work-experience - thead - tr - th Years - th Name - th Location - tbody - tr - td 2015-2019 - td PhD in Neurosciences - td Erasmus MC, Rotterdam, The Netherlands - - h3 Academic record - .wrapper-table - table.academic-record - thead - tr - th Years - th Name - th Location - tbody - tr - td 2010-2013 - td Bachelor Biology - td Université Victor Segalen, Bordeaux, France - tr - td 2013-2015 - td Master Neurosciences & Neuropsychopharmacology - td Université Victor Segalen, Bordeaux, France - tr - td 2013-2015 - td Master Cellular & Molecular Biology - td Universidade de Coimbra, Portugal - tr - td 2015-2019 - td PhD in Neurosciences - td Erasmus MC, Rotterdam, The Netherlands - - h3 Publications - .wrapper-table - table.publications - thead - tr - th Years - th Authors - th Title - tbody - tr - td 2017 - td Arnau Busquets-Garcia, [...], Giovanni Marsicano - td - a(href="https://www.nature.com/articles/mp20174") Pregnenolone blocks cannabinoid-induced acute psychotic-like states in mice - - h2 >> Programming - - h3 Languages used - ul - li Matlab / Octave - li Python - li R - li HTML / JS / (S)CSS - li PHP / NodeJS - li SQL / NoSQL (cypher) - - h3 Experience (science) - ul - li Data visualisation - li Fourier / signal processing - li Circular statistics - li Machine learning - - h3 Experience (hobbies) - ul - li Homelab / self-hosting - li Web design - li Raspberry Pi / Arduino - li Home automation - - h3 Open source contributions - p - | Go to: - a(href="/foss") FOSS - - h2 >> Music - p - | Go to: - a(href="/music") music + .longform_list + each $item in $posts + +entry($item) diff --git a/views/music.pug b/views/music.pug index 402ab5c..9df2c31 100644 --- a/views/music.pug +++ b/views/music.pug @@ -1,48 +1,50 @@ extends layout block content - p - | Back to: - a(href="/") yarmo.eu - h1 Yarmo's music - p - | Go to: - a(href="/vinyl") vinyl - | | - a(href="/aotw") Album Of The Week + header + p + | Back to: + a(href="/about") about me + h1 Yarmo's music + p + | Go to: + a(href="/vinyl") vinyl + | | + a(href="/aotw") Album Of The Week - h3 Instruments - ul - li Piano / keyboards - li Organs - li Synths - - h3 Releases - .wrapper-table - table.music - thead - tr - th Years - th Band - th Title - tbody - tr - td 2013 - td Sir Jupiter - td - a(href="https://song.link/album/nl/i/979132997") Sir Jupiter - tr - td 2015 - td Sir Jupiter - td - a(href="https://song.link/album/nl/i/1041392608") EP Roots - tr - td 2016 - td Sir Jupiter - td - a(href="https://song.link/album/nl/i/1151887625") EP Wings - tr - td 2018 - td Sir Jupiter - td - a(href="https://song.link/album/nl/i/1454734101") EP Covered In Snow + main + h3 Instruments + ul + li Piano / keyboards + li Organs + li Synths + + h3 Releases + .wrapper-table + table.music + thead + tr + th Years + th Band + th Title + tbody + tr + td 2013 + td Sir Jupiter + td + a(href="https://song.link/album/nl/i/979132997") Sir Jupiter + tr + td 2015 + td Sir Jupiter + td + a(href="https://song.link/album/nl/i/1041392608") EP Roots + tr + td 2016 + td Sir Jupiter + td + a(href="https://song.link/album/nl/i/1151887625") EP Wings + tr + td 2018 + td Sir Jupiter + td + a(href="https://song.link/album/nl/i/1454734101") EP Covered In Snow diff --git a/views/notes.pug b/views/notes.pug index 16e7507..89261c0 100644 --- a/views/notes.pug +++ b/views/notes.pug @@ -3,22 +3,26 @@ extends layout mixin entry($item) .longform_list__item p - | !{$item['date_formatted']} >> + | !{$item['date_formatted']} + br a(href="{$item['urlrel']}") !{$item['title']} block content - p - | Back to: - a(href="/") yarmo.eu - h1 Yarmo's notes - p - | RSS feeds: - a(href="/rss/all") blog and notes - | | - a(href="/rss/blog") blog - | | - a(href="/rss/notes") notes - - .longform_list - each $item in $posts - +entry($item) + header + p + | Back to: + a(href="/about") about me + h1 Yarmo's notes + + main + p + | RSS feeds: + a(href="/rss/all") blog and notes + | | + a(href="/rss/blog") blog + | | + a(href="/rss/notes") notes + + .longform_list + each $item in $posts + +entry($item) diff --git a/views/notes_post.pug b/views/notes_post.pug index 5e0f519..b712d14 100644 --- a/views/notes_post.pug +++ b/views/notes_post.pug @@ -1,12 +1,14 @@ extends layout block content - .longform + header p | Back to: - a(href="/") yarmo.eu - | > + a(href="/about") about me + | > a(href="/notes") notes + + article.longform h1 !{$post['title']} p.longform__header Posted on !{$post['date_formatted']} by !{$post['author']} .longform__content diff --git a/views/pgp.pug b/views/pgp.pug index 722a573..b0a9d1c 100644 --- a/views/pgp.pug +++ b/views/pgp.pug @@ -4,10 +4,11 @@ block content header p | Back to: - a(href="/") yarmo.eu + a(href="/about") about me h1 | PGP public key - + + main h3#pgp-signature Signature p 9F0048AC0B23301E1F77E994909F6BD6F80F485D diff --git a/views/projects.pug b/views/projects.pug index 22378d8..3d3b5d6 100644 --- a/views/projects.pug +++ b/views/projects.pug @@ -4,14 +4,17 @@ mixin entry($item) .longform_list__item p a(href="{$item['urlrel']}") !{$item['title']} - | (!{$item['status']}) + br + | Status: !{$item['status']} block content - p - | Back to: - a(href="/") yarmo.eu - h1 Yarmo's projects + header + p + | Back to: + a(href="/about") about me + h1 Yarmo's projects - .longform_list - each $item in $projects - +entry($item) + main + .longform_list + each $item in $projects + +entry($item) diff --git a/views/projects_details.pug b/views/projects_details.pug index 5fa6af8..a0d002c 100644 --- a/views/projects_details.pug +++ b/views/projects_details.pug @@ -1,13 +1,15 @@ extends layout block content - .longform + header p | Back to: - a(href="/") yarmo.eu - | > + a(href="/about") about me + | > a(href="/projects") projects h1 !{$project['title']} + + article.longform p | Got an idea or a comment? a(href="/contact") Feel free to contact me! diff --git a/views/vinyl.pug b/views/vinyl.pug index a3f5d3b..9f10a95 100644 --- a/views/vinyl.pug +++ b/views/vinyl.pug @@ -5,10 +5,15 @@ mixin entry($item) p !{$item['artist']} - !{$item['title']} (!{$item['year']}) block content - p - | Back to: - a(href="/") yarmo.eu - h1 Yarmo's vinyl collection - .list - each $item in $albums - +entry($item) + header + p + | Back to: + a(href="/about") about me + | > + a(href="/music") music + h1 Yarmo's vinyl collection + + main + .list + each $item in $albums + +entry($item)