From c7d9df9e75aeeaa87e08890158169d522b5b42f1 Mon Sep 17 00:00:00 2001 From: Tom Date: Wed, 1 Nov 2023 17:31:44 +0000 Subject: [PATCH] Embed icons and hopefully fix social media tags --- README.md | 2 + _includes/default_head_tags.html | 21 ++++-- _includes/header.html | 6 +- {assets => _includes}/icons/arduino.svg | 0 {assets => _includes}/icons/arxiv.svg | 0 {assets => _includes}/icons/github.svg | 0 {assets => _includes}/icons/linkedin.svg | 0 {assets => _includes}/icons/linux.svg | 0 {assets => _includes}/icons/mastodon.svg | 0 {assets => _includes}/icons/orcid.svg | 0 {assets => _includes}/icons/python.svg | 0 {assets => _includes}/icons/raspberrypi.svg | 0 {assets => _includes}/icons/rss.svg | 0 {assets => _includes}/icons/twitter.svg | 0 _includes/klipse_scripts.html | 15 ---- _layouts/post.html | 4 - .../2023-07-25-interactive-code-snippets.md | 14 +++- _posts/2023-10-30-maps-3.md | 17 ++++- _sass/header.scss | 73 +++++++++---------- cv.html | 3 + index.md | 3 + 21 files changed, 91 insertions(+), 67 deletions(-) rename {assets => _includes}/icons/arduino.svg (100%) rename {assets => _includes}/icons/arxiv.svg (100%) rename {assets => _includes}/icons/github.svg (100%) rename {assets => _includes}/icons/linkedin.svg (100%) rename {assets => _includes}/icons/linux.svg (100%) rename {assets => _includes}/icons/mastodon.svg (100%) rename {assets => _includes}/icons/orcid.svg (100%) rename {assets => _includes}/icons/python.svg (100%) rename {assets => _includes}/icons/raspberrypi.svg (100%) rename {assets => _includes}/icons/rss.svg (100%) rename {assets => _includes}/icons/twitter.svg (100%) delete mode 100644 _includes/klipse_scripts.html diff --git a/README.md b/README.md index 939f738..99fde78 100644 --- a/README.md +++ b/README.md @@ -8,6 +8,8 @@ You probably want to run ruby from a version manager like `chruby`, see [here](h - fix the OG tags so that https://cards-dev.twitter.com/validator works - consider switching to using pandoc as a markdown renderer - setup webmentions https://aarongustafson.github.io/jekyll-webmention_io/ + - add a theme toggle button: https://whitep4nth3r.com/blog/best-light-dark-mode-theme-toggle-javascript/ + - make sure the above works with the thesis section, will probably require stripping the html tag. ## Validators - [blacklight](https://themarkup.org/blacklight) diff --git a/_includes/default_head_tags.html b/_includes/default_head_tags.html index dbdb0b9..6d8757f 100644 --- a/_includes/default_head_tags.html +++ b/_includes/default_head_tags.html @@ -23,20 +23,31 @@ {% assign image = page.social_image %} {% elsif page.image %} {% assign image = page.image %} +{% elsif page.img %} +{% assign image = page.img.src %} +{% elsif page.thumbnail %} +{% assign image = page.thumbnail %} {% else image = false %} {% endif %} +{% if page.img %} +{% assign alt = page.img.alt %} +{% elsif page.alt %} +{% assign alt = page.alt %} +{% else alt = False %} +{% endif %} + {% if image %} - - -{% if page.alt %} - - + + +{% if alt %} + + {% endif %} {% endif %} diff --git a/_includes/header.html b/_includes/header.html index d5c008e..40820c6 100644 --- a/_includes/header.html +++ b/_includes/header.html @@ -6,9 +6,9 @@

Physicist, Programmer, Maker and Baker

- GitHub - Mastodon - RSS + GitHub {% include icons/github.svg %} + Mastodon {% include icons/mastodon.svg %} + RSS {% include icons/RSS.svg %}

{% include sidebar.html%} diff --git a/assets/icons/arduino.svg b/_includes/icons/arduino.svg similarity index 100% rename from assets/icons/arduino.svg rename to _includes/icons/arduino.svg diff --git a/assets/icons/arxiv.svg b/_includes/icons/arxiv.svg similarity index 100% rename from assets/icons/arxiv.svg rename to _includes/icons/arxiv.svg diff --git a/assets/icons/github.svg b/_includes/icons/github.svg similarity index 100% rename from assets/icons/github.svg rename to _includes/icons/github.svg diff --git a/assets/icons/linkedin.svg b/_includes/icons/linkedin.svg similarity index 100% rename from assets/icons/linkedin.svg rename to _includes/icons/linkedin.svg diff --git a/assets/icons/linux.svg b/_includes/icons/linux.svg similarity index 100% rename from assets/icons/linux.svg rename to _includes/icons/linux.svg diff --git a/assets/icons/mastodon.svg b/_includes/icons/mastodon.svg similarity index 100% rename from assets/icons/mastodon.svg rename to _includes/icons/mastodon.svg diff --git a/assets/icons/orcid.svg b/_includes/icons/orcid.svg similarity index 100% rename from assets/icons/orcid.svg rename to _includes/icons/orcid.svg diff --git a/assets/icons/python.svg b/_includes/icons/python.svg similarity index 100% rename from assets/icons/python.svg rename to _includes/icons/python.svg diff --git a/assets/icons/raspberrypi.svg b/_includes/icons/raspberrypi.svg similarity index 100% rename from assets/icons/raspberrypi.svg rename to _includes/icons/raspberrypi.svg diff --git a/assets/icons/rss.svg b/_includes/icons/rss.svg similarity index 100% rename from assets/icons/rss.svg rename to _includes/icons/rss.svg diff --git a/assets/icons/twitter.svg b/_includes/icons/twitter.svg similarity index 100% rename from assets/icons/twitter.svg rename to _includes/icons/twitter.svg diff --git a/_includes/klipse_scripts.html b/_includes/klipse_scripts.html deleted file mode 100644 index 891a914..0000000 --- a/_includes/klipse_scripts.html +++ /dev/null @@ -1,15 +0,0 @@ - - - - - - - - \ No newline at end of file diff --git a/_layouts/post.html b/_layouts/post.html index 4525e26..726d46d 100644 --- a/_layouts/post.html +++ b/_layouts/post.html @@ -3,10 +3,6 @@ {% include default_head_tags.html%} - {% if page.klipse %} - {% include klipse_scripts.html %} - {% endif %} - {% if page.commentid %} diff --git a/_posts/2023-07-25-interactive-code-snippets.md b/_posts/2023-07-25-interactive-code-snippets.md index 2e8e51d..f46360e 100644 --- a/_posts/2023-07-25-interactive-code-snippets.md +++ b/_posts/2023-07-25-interactive-code-snippets.md @@ -7,7 +7,19 @@ image: /assets/blog/REPL/repl.png thumbnail: /assets/blog/REPL/thumbnail.png image_class: invertable alt: A screenshot of a small javascript widget that lets you evaluate python code. It's showing some numpy code and its evaluated output. -klipse: True +head: | + + + + + --- On this excellent [personal site](http://lambdafunk.com/) I saw [Klipse](https://github.com/viebel/klipse), a little js library that lets you modify and execute code snippets in blogs. How cute! diff --git a/_posts/2023-10-30-maps-3.md b/_posts/2023-10-30-maps-3.md index f5a4d9a..51e98d7 100644 --- a/_posts/2023-10-30-maps-3.md +++ b/_posts/2023-10-30-maps-3.md @@ -6,6 +6,7 @@ excerpt: | image: thumbnail: /assets/blog/pmtiles/thumbnail.png +alt: A small map. head: | @@ -14,18 +15,29 @@ head: | --- PMTiles is a new project that lets you serve vector map data from static files through the magic of HTTP range requests. -By following this [blog post][blog] and throwing in a bit of code from [the official examples][official_examples] I've put together this little map below. The vector data is entirely served from a static file on this server. Most interactive web maps work by constantly requesting little map images from an external server at different zoom levels. This approach uses much less data and doesn't require an external server to host all the map data. + The vector data is entirely served from a static file on this server. Most interactive web maps work by constantly requesting little map images from an external server at different zoom levels. This approach uses much less data and doesn't require an external server to host all the map data. + +Getting this to work was a little tricky, I mostly followed the steps from Simon Willison's post but I didn't want to use npm. As I write this I realise that this site is generated with jekyll which uses npm anyway but somehow I would like the individual posts to Just Work™ without worrying about updating libraries and npm. + +So I grabbed `maplibre-gl.css`, `maplibre-gl.js` and `pmtiles.js`, plonked them into this site and started hacking around. I ended up mashing up the code from [Simon Willison's post][blog] and [the official examples][official_examples] to get something that worked. + +I figured out from [this github issue][github_issue] how to grab a module version of `protomaps-themes-base` without npm. However I don't really like the styles in produces. Instead I played around a bit with the generated json styles to make something that looks a bit more like the Stamen Toner theme. + +Looking at the source code for `protomaps-themes-base` I realise I could probably make custom themes much more easily by just swapping out the theme variables in the package. Todo: - Figure out how to use [maputnik][maputnik] to generate styles for PMTiles. +[github_issue]: https://github.com/preactjs/preact/issues/1961#issuecomment-537255092 [blog]: https://til.simonwillison.net/gis/pmtiles [official_examples]: https://github.com/protomaps/PMTiles/blob/main/js/examples/maplibre.html [maputnik]: maputnik.github.io/editor/
-