StarCitizenTools / mediawiki-skins-Citizen

A beautiful, usable, responsive MediaWiki skin with in-depth extension support. Originally developed for the Star Citizen Wiki.
https://www.mediawiki.org/wiki/Skin:Citizen
GNU General Public License v3.0
222 stars 54 forks source link

--hover variants of color surface 3 and 4 #951

Open TarkusLee opened 3 weeks ago

TarkusLee commented 3 weeks ago

--color-surface-2 has a hover variant, --color-surface-2--hover. It would be nice to have these variants for each surface color.

alistair3149 commented 2 weeks ago

Putting this on hold for now because I am hesitated to introduce new colors since they are due to a rework after MW 1.43 drops, which is around the end of the year.

In the meantime, you can add these to your MediaWiki:Citizen.css:


:root {
    /* Add extra hover and active state colors */
    --color-surface-3--hover: hsl( var( --color-primary__h ), var( --color-surface-3__s ), calc( var( --color-surface-3__l ) + var( --delta-lightness-hover-state ) ) );
    --color-surface-3--active: hsl( var( --color-primary__h ), var( --color-surface-3__s ), calc( var( --color-surface-3__l ) - var( --delta-lightness-hover-state ) ) );
    --color-surface-4--hover: hsl( var( --color-primary__h ), var( --color-surface-4__s ), calc( var( --color-surface-4__l ) + var( --delta-lightness-hover-state ) ) );
    --color-surface-4--active: hsl( var( --color-primary__h ), var( --color-surface-4__s ), calc( var( --color-surface-4__l ) - var( --delta-lightness-hover-state ) ) );
}