Background

We've partly inherited/partly caused a mess in CSS class names for the same feature:
Compare for example reading-list__errorbox vs readinglists-container.
This confusion has also already lead to an error in code by team members: a.reading-list-bookmark.

Goal

For better developer experience, inclusion and internationalization let's settle on one way to name the same cause.
Proposal: reading-lists*
Our own guidelines are verbose on making code readable for the biggest audience, ensuring that non-native speakers immediately now what words are meant, assistive technology can emphasize them correctly and developers can rely on not having to know two ways to name the same thing.
Additionally plural seems most sensitive for a) future plans of developing the feature and b) the name already used in the extension.

Acceptance criteria for done

• Rename all CSS classes to the chosen unified name
• Update the Jest tests accordingly