--keycap-text-hover property not being used
Description
The --keycap-text-hover does not result in any changes to the keyboard styling, the problem seems to be that the resulting local variable --_keycap-text-hover is not being used anywhere inside css/virtual-keyboard.less
In screenshot, the following values are being used:
--keycap-background: #c8e5fe; // Light blue
--keycap-background-hover: #2d5a81; // Dark blue
--keycap-text: #2d5a81; // Dark blue
--keycap-text-hover: red;
As a related aside it would also be helpful to have a separate hover text colour variable for the keyboard-toolbar (currently there is only --keyboard-toolbar-text-active which controls both text of the currently selected toolbar tab and the hover state for the remaining tabs
In screenshot, the following values are being used:
--keyboard-background: #f4faff; // Lightest Blue
--keyboard-toolbar-text: #0058de; // Blue
--keyboard-toolbar-text-active: red;
--keyboard-toolbar-background-hover: #2d5a81; // Dark blue
Steps to Reproduce
- Create a project with mathlive
- Attempt to customise the keycap hover colour by setting the
--keycap-text-hovervariable (I did this inside the CSS for the element set aswindow.mathVirtualKeyboard.container)
Actual Behavior
The keycap hover colour is taken from the --keycap-text var rather than the --keycap-text-hover var
Expected Behavior
The --keycap-text-hover var should affect the color of the keycap when it is hovered over
Environment
MathLive version Using mathlive v0.101.0 via npm
Operating System Windows 11 Home, 10.0 Build 22631
Browser Tested on Chrome, Firefox and Edge