PSA: Vimium UI CSS class names will change in 2.3

[philc]

Hey folks,

I recently changed the HTML and CSS structure of the help dialog (#4666, #4667) and saw many opportunities for CSS simplification, and I ended up changing or eliminating class names for several other pages and UI components along the way, with more to come. I plan to transition most CSS class names to hyphen case instead of camel case, as is today's style convention for CSS.

This will have the effect that it will break themes that have been written for Vimium which deeply customize its internal UI.

I'll leave the existing class names in place for Vimium's hint markers (e.g. .vimiumHintMarker), because we expose that CSS in the options page itself, so naturally we should avoid breaking it.

I mention this as a heads up and in case anyone has comments.

It's kind of a shame that the internals of Vimium's HTML and CSS are user-affecting, such that we need to be considerate when updating the structure of the UI. Is it reasonable for just the link hint class names to be guaranteed to be stable, since only those CSS class names are exposed by default in the options?

CCing a few Vimium theme authors @gjazali, @kavinvalli, @BachoSeven

[philg-dev]

TL;DR: just a few thoughts to help with a smooth migration of link hint CSS class names, in case you would really want to change them. It's probably not really worth the effort, but I wanted to state the ideas, to see what people think nonetheless.

---

For the link hint CSS class names, I was briefly thinking about possibly implementing a migration script... But on further thought, it feels like a can of worms that we probably don't really want to open.

Under the assumption that 99% of people who use custom CSS configuration for Vimium are probably quite tech savvy, a fairly minimal solution would be to have Vimium show a notification popup (or page) "somehow" after updating with a link to a PR / issue / wiki with instructions for a manual migration.

Some things I was thinking about in that regard:

• local storage variable to track Vimium version since last run of "trigger once on add-on version update"
• "notification" should only be shown to people who use custom CSS configuration
  • depending on the changes, maybe even check if custom configuration contains affected CSS class names
• notification might be implemented as a separate page, similar to change log pages from some other add-ons, e.g. Tampermonkey
  • such a page might be useful for the future too, maybe to highlight some major changes or bug fixes per release

Feel free to use 👍 (feasible) / 👎 (overkill or unsuitable approach) reactions so we get a general feeling on what people think of the basic idea. Obviously it would need some polishing, if the idea doesn't get scrapped. My impression is, that it's probably overkill and we're probably better off leaving the link hint CSS classes live on as they are.

[philc]

Each time Vimium's major version is updated, a notification popup is shown with a link to the changelog. I've updated the changelog to reference this discussion to help notify people.

It seems overkill to me to have a notification targeted to users who have custom CSS.

[philc]

I've pushed the CSS changes in d0e9d00...af924c5.

Probably most relevant is commit f97e139 which touches the link hints CSS and documents which of those classes are changing and which aren't.

[gdh1995]

Is it possible to auto replace old class names (listed in a allowlist) with new ones?