larlet-fr-david-cache/cache/2024/41e9f48de9ccd2449bceca518fff8606/index.md

title: Time for a refresh! url: https://vanschklift.com/blog/post/2020/06/19/Time-for-a-refresh%21 hash_url: 41e9f48de9 archive_date: 2024-03-12 og_image: https://vanschklift.com/themes/wip/img/android-icon-192x192.png description: It has been a while since I last changed the theme of this blog! Seems that with all the time spent at home in the last three months, I had some new blog posts ideas, but blogging favicon: https://vanschklift.com/themes/wip/img/android-icon-192x192.png language: en_US

It has been a while since I last changed the theme of this blog! Seems that with all the time spent at home in the last three months, I had some new blog posts ideas, but blogging on the old boring theme was not so motivating. So I made a this one by combining some open source libs.

The main idea here is to mimic an annotated article done with LaTeX⁰. I reused several open source components:

• LaTeX.css: the main style of this theme
• Rough Notation: this library is providing all the annotations: underline, highlight, circle, etc.
• Littlefoot: A library to provide nice footnotes
• Scampi: I only used the skip-links module of this library.

Moreover, I wanted to have a more personal touch, so I created my own font based on my not so beautiful handwriting (I am a lefty, eh.) To do so, I used Calligraphr, combined with Procreate on an iPad with an Apple Pencil. The result is not 100% accurate, since the font is still missing lots of ligatures, but I find it good enough for the effort. What do you think?

I mapped some annotations provided by Rough Notation to html5 elements, for example:

• mark
• s (strikethrough)
• strong

• blockquote for long quotes with lost of stuff to say, not like here for example.

I wanted to be able to annotate articles with some side notes¹. These notes are okay on desktop when there is space in the side margins, but on mobile we don’t have this space. I discovered the bigfoot library², which creates “pop over” notes, but this library did not seem to be maintained since 4 years and it was still depending on jQuery. I thus found an alternative in the littlefoot library, which is still maintained and does not depend on jQuery. I may add at a later stage the side notes feature on desktop. I still have some stuff to fix here and there in this theme, but globally this is it!

1. I really like LaTeX, but I don’t have so many occasions to use it these days. ↩

2. The kind of stuff that happens regularly when you annotate a document. ↩

3. and the corresponding plugin for dotclear by Franck ↩