Restyle regex script toggles
This commit is contained in:
parent
5e88edf22d
commit
4af6955588
|
@ -77,12 +77,15 @@ async function loadRegexScripts() {
|
|||
scriptHtml.attr('id', uuidv4());
|
||||
scriptHtml.find('.regex_script_name').text(script.scriptName);
|
||||
scriptHtml.find('.disable_regex').prop("checked", script.disabled ?? false)
|
||||
.each(function() {
|
||||
$(this).closest('.checkbox').find('span').toggle(this.checked);
|
||||
})
|
||||
.on('click', function() {
|
||||
script.disabled = !script.disabled;
|
||||
$(this).closest('.checkbox').find('span').toggle(this.checked);
|
||||
.on('input', function () {
|
||||
script.disabled = !!$(this).prop("checked");
|
||||
saveSettingsDebounced();
|
||||
});
|
||||
scriptHtml.find('.regex-toggle-on').on('click', function () {
|
||||
scriptHtml.find('.disable_regex').prop("checked", true).trigger('input');
|
||||
});
|
||||
scriptHtml.find('.regex-toggle-off').on('click', function () {
|
||||
scriptHtml.find('.disable_regex').prop("checked", false).trigger('input');
|
||||
});
|
||||
scriptHtml.find('.edit_existing_regex').on('click', async function () {
|
||||
await onRegexEditorOpenClick(scriptHtml.attr("id"));
|
||||
|
|
|
@ -2,9 +2,10 @@
|
|||
<span class="drag-handle menu-handle">☰</span>
|
||||
<div class="regex_script_name flexGrow overflow-hidden"></div>
|
||||
<div class="flex-container flexnowrap">
|
||||
<label class="checkbox flex-container">
|
||||
<span data-i18n="Disabled">Disabled</span>
|
||||
<input id="disabled" type="checkbox" name="disabled" class="disable_regex" />
|
||||
<label class="checkbox flex-container" for="regex_disable">
|
||||
<input type="checkbox" name="regex_disable" class="disable_regex" />
|
||||
<span class="regex-toggle-on fa-solid fa-toggle-on" title="Disable script"></span>
|
||||
<span class="regex-toggle-off fa-solid fa-toggle-off" title="Enable script"></span>
|
||||
</label>
|
||||
<div class="edit_existing_regex menu_button">
|
||||
<i class="fa-solid fa-pencil"></i>
|
||||
|
|
|
@ -22,3 +22,33 @@
|
|||
margin-top: 1px;
|
||||
margin-bottom: 1px;
|
||||
}
|
||||
|
||||
input.disable_regex {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.regex-toggle-off {
|
||||
cursor: pointer;
|
||||
opacity: 0.5;
|
||||
filter: grayscale(0.5);
|
||||
}
|
||||
|
||||
.regex-toggle-on {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.disable_regex:checked ~ .regex-toggle-off {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.disable_regex:checked ~ .regex-toggle-on {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.disable_regex:not(:checked) ~ .regex-toggle-off {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.disable_regex:not(:checked) ~ .regex-toggle-on {
|
||||
display: block;
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue