Customize website color palette

[cbrnr]

As mentioned in #12565 and #12558, I think the current secondary (highlight) color in both light and dark themes do not really go very well with the MNE logo (and the overall website color theme). I'm all for a11y, but maybe we can find a color that works a bit better with our branding.

[drammock]

One fairly expedient approach would be to use theme-defined colors, but switch around what they're used for. For example, we could take the orange color from "important" admonitions and use that as the new link hover color. Normally I'd say this isn't a great idea --- the admonition colors (esp red/orange/green) are usually considered "semantic" --- but since the orange would only appear on interaction with links rather than on the static page, I think it's OK / we don't really risk folks thinking "oh no, this link I'm hovering on is dangerous".

Another change I've pondered is switching the primary (teal) color to be the color for generic admonitions / info boxes, and use the blue color as the "primary" on the MNE site (i.e., for links, but also download buttons like here, highlighting of selected pages/sections/tabs, etc)

[cbrnr]

These are good suggestions. However, I am also totally fine if we stick to the default colors (I'd rather be a11y compliant at the expense of being a bit ugly – very subjective of course too). But if do that, let's make sure that we really do not customize any color (there are a couple of color definitions, but they seem to be mostly for the social icons, which we don't use anyway). Less customization means less maintenance work for us!

[hoechenberger]

@cbrnr By "highlight" color, do you mean the color of links on hover?

[cbrnr]

Yes!

[hoechenberger]

My understanding of the Web Content Accessibility Guidelines (WCAG) was always that a link must be visually distinct on hover; if you already add an underline, you don't need to change the color. I'm currently on mobile so cannot really read up on this again right now, but at least this is how I remember the guidelines. I believe looking at how Bootstrap is doing things is always an excellent first step