updated

2023-04-26

This Website

Release notes, TODO list and ideas and for further development of this site.

Small changes and additions

☐ Links mouse-in and mouse-out animation

☐ Add global languages to `rehypeHighlight`

Currently the used languages should be specified per-page. If global languages are not possible in rehypeHighlight, then create a single module that exports all used languages.

☐ Ensure that dates in Blog and Notes do not wrap on small screens

☐ Hash links for page MDX headings

These are also known as hash anchors.

More involved changes and improvements

☐ Make src path relative to the containing mdx file dir

For example, if mdx file dir is blog/how-i-ended-up-here, then currently its src is /static/blog/how-i-ended-up-here/front-end-doom.jpg.

Instead, src should be ./static/front-end-doom.jpg and a custom rehype plug-in (rehypeImgSize -> rehypeImg?) should update it to /static/blog/how-i-ended-up-here/front-end-doom.jpg

☐ SEO

https://github.com/garmeeh/next-seo

☐ Modal images on click

It should be possible to click on images and open then in full size modal window and original format - i.e. without using Next.js Image component.

☐ Add site about page

Should be something similar to nextra about

Longer and complex investigations

☐ Prevent single line wrap around float

This is mostly for my photos on the about page.

https://stackoverflow.com/questions/14883495/prevent-single-word-from-wrapping-around-float-in-css-html
https://stackoverflow.com/questions/14811049/awkward-line-wrap-around-image

☐ Image float left/right and bottom

This is mostly for my photo in the bottom of the about page.

https://css-tricks.com/float-an-element-to-the-bottom-corner/

☑ Replace Styled Components with Linaria CSS and Tailwind CSS

☐ Add Site-Wide Search

https://github.com/nextapps-de/flexsearch
https://www.algolia.com/developers/

Further Research

☐ Adobe React Aria based mobile menu

https://react-spectrum.adobe.com/react-aria/useDialog.html

☐ URL validator

Find how to automatically check that all site-refferenced resources are alive and valid.

☐ Investigate other language highlighting engines

Possible options are:

Rehype Pretty Code (based on Shiki)
remark-prism (based on Prism)