rixty/SillyTavern
1
0
Fork 0
mirror of https://github.com/SillyTavern/SillyTavern.git synced 2025-06-05 21:59:27 +02:00
Code Issues Packages Projects Releases Wiki Activity

Add style on hover over focused popup button

Browse Source 
- Add CSS styling rule to still highlight a button on hover when it is being focused already (Otherwise you won't get any effect on hovering and clicking on the default button if a popup has just opened)
- Dynamic styles extended to ignore rules where both hover and focus is used
This commit is contained in:
Wolfsblvt
2024-06-16 23:33:07 +02:00
parent 316df6ed17
commit fca626d246
2 changed files with 22 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
public/scripts/dynamic-styles.js
View File

@ -55,10 +55,14 @@ function applyDynamicFocusStyles(styleSheet, { fromExtension = false } = {}) {
// We collect all hover and focus rules to be able to later decide which hover rules don't have a matching focus rule
selectors.forEach(selector => {
if (selector.includes(':hover')) {
const isHover = selector.includes(':hover'), isFocus = selector.includes(':focus');
if (isHover && isFocus) {
// We currently do nothing here. Rules containing both hover and focus are very specific and should never be automatically touched
}
else if (isHover) {
const baseSelector = selector.replace(':hover', PLACEHOLDER).trim();
hoverRules.push({ baseSelector, rule });
} else if (selector.includes(':focus')) {
} else if (isFocus) {
// We need to make sure that we both remember existing :focus and :focus-within rules
const baseSelector = selector.replace(':focus-within', PLACEHOLDER).replace(':focus-visible', PLACEHOLDER).replace(':focus', PLACEHOLDER).trim();
focusRules.add(baseSelector);