Waited wayy too long for Firefox to support :has

This commit is contained in:
Lim Chee Aun 2023-10-24 09:58:41 +08:00
parent 61756fac1d
commit 7555bda8e9
2 changed files with 22 additions and 20 deletions

View file

@ -85,7 +85,7 @@
transform: scale(0.975); transform: scale(0.975);
transition: all 0.2s ease-out; transition: all 0.2s ease-out;
} }
#shortcuts-settings-container .shortcuts-view-mode label:has(input:checked) { #shortcuts-settings-container .shortcuts-view-mode label.checked {
box-shadow: inset 0 0 0 3px var(--link-color); box-shadow: inset 0 0 0 3px var(--link-color);
} }
#shortcuts-settings-container #shortcuts-settings-container

View file

@ -271,25 +271,27 @@ function ShortcutsSettings({ onClose }) {
label: 'Multi-column', label: 'Multi-column',
imgURL: multiColumnUrl, imgURL: multiColumnUrl,
}, },
].map(({ value, label, imgURL }) => ( ].map(({ value, label, imgURL }) => {
<label> const checked =
<input snapStates.settings.shortcutsViewMode === value ||
type="radio" (value === 'float-button' &&
name="shortcuts-view-mode" !snapStates.settings.shortcutsViewMode);
value={value} return (
checked={ <label key={value} class={checked ? 'checked' : ''}>
snapStates.settings.shortcutsViewMode === value || <input
(value === 'float-button' && type="radio"
!snapStates.settings.shortcutsViewMode) name="shortcuts-view-mode"
} value={value}
onChange={(e) => { checked={checked}
states.settings.shortcutsViewMode = e.target.value; onChange={(e) => {
}} states.settings.shortcutsViewMode = e.target.value;
/>{' '} }}
<img src={imgURL} alt="" width="80" height="58" />{' '} />{' '}
<span>{label}</span> <img src={imgURL} alt="" width="80" height="58" />{' '}
</label> <span>{label}</span>
))} </label>
);
})}
</div> </div>
{/* <select {/* <select
value={snapStates.settings.shortcutsViewMode || 'float-button'} value={snapStates.settings.shortcutsViewMode || 'float-button'}