Refactor custom prompts layout for improved readability and maintainability. see #347

This commit is contained in:
Mic 2025-04-15 23:56:00 +02:00
parent f5a0685596
commit 7da77e6a48
4 changed files with 11 additions and 9 deletions

View file

@ -135,6 +135,10 @@
"message": "Enable the diff viewer", "message": "Enable the diff viewer",
"description": "" "description": ""
}, },
"customPrompts_form_label_use_diff_viewer_title": {
"message": "The diff viewer can be selected when the action is set to \"Substitute text\".",
"description": ""
},
"customPrompts_form_required_fields": { "customPrompts_form_required_fields": {
"message": "Required fields", "message": "Required fields",
"description": "" "description": ""

View file

@ -39,10 +39,6 @@ thead {
float: right; float: right;
} }
#checkboxUseDiffViewerNew_span{
display: none;
}
#btnSaveAll{ #btnSaveAll{
float: left; float: left;
} }

View file

@ -58,7 +58,7 @@
<br> <br>
<input type="checkbox" id="checkboxDefineResponseLangNew" name="define_response_lang" value="1" tabindex="8"> <label for="checkboxDefineResponseLangNew">__MSG_customPrompts_form_label_define_response_lang__</label> <input type="checkbox" id="checkboxDefineResponseLangNew" name="define_response_lang" value="1" tabindex="8"> <label for="checkboxDefineResponseLangNew">__MSG_customPrompts_form_label_define_response_lang__</label>
<br> <br>
<span id="checkboxUseDiffViewerNew_span"><input type="checkbox" id="checkboxUseDiffViewerNew" name="use_diff_viewer" value="1" tabindex="9"> <label for="checkboxUseDiffViewerNew">__MSG_customPrompts_form_label_use_diff_viewer__</label></span> <input type="checkbox" id="checkboxUseDiffViewerNew" name="use_diff_viewer" value="1" tabindex="9" title="__MSG_customPrompts_form_label_use_diff_viewer_title__"> <label for="checkboxUseDiffViewerNew" title="__MSG_customPrompts_form_label_use_diff_viewer_title__">__MSG_customPrompts_form_label_use_diff_viewer__</label>
</td> </td>
</tr> </tr>
<tr> <tr>

View file

@ -62,6 +62,9 @@ document.addEventListener('DOMContentLoaded', async () => {
e.preventDefault(); e.preventDefault();
e.target.disabled = true; e.target.disabled = true;
document.getElementById('formNew').style.display = 'block'; document.getElementById('formNew').style.display = 'block';
let _checkboxUseDiffViewerNew = document.getElementById('checkboxUseDiffViewerNew');
_checkboxUseDiffViewerNew.checked = false;
_checkboxUseDiffViewerNew.disabled = true;
window.scrollTo({ window.scrollTo({
top: 0, top: 0,
behavior: 'smooth' behavior: 'smooth'
@ -122,14 +125,13 @@ document.addEventListener('DOMContentLoaded', async () => {
var checkboxNeedCustomTextNew = document.getElementById('checkboxNeedCustomTextNew'); var checkboxNeedCustomTextNew = document.getElementById('checkboxNeedCustomTextNew');
var checkboxDefineResponseLangNew = document.getElementById('checkboxDefineResponseLangNew'); var checkboxDefineResponseLangNew = document.getElementById('checkboxDefineResponseLangNew');
var checkboxUseDiffViewerNew = document.getElementById('checkboxUseDiffViewerNew'); var checkboxUseDiffViewerNew = document.getElementById('checkboxUseDiffViewerNew');
var checkboxUseDiffViewerNew_span = document.getElementById('checkboxUseDiffViewerNew_span');
selectActionNew.addEventListener('change', (e) => { selectActionNew.addEventListener('change', (e) => {
if (e.target.value === "2") { if (e.target.value === "2") {
checkboxUseDiffViewerNew_span.style.display = 'inline'; checkboxUseDiffViewerNew.disabled = false;
} else { } else {
checkboxUseDiffViewerNew.checked = false; checkboxUseDiffViewerNew.checked = false;
checkboxUseDiffViewerNew_span.style.display = 'none'; checkboxUseDiffViewerNew.disabled = true;
} }
}); });
@ -474,7 +476,7 @@ function loadPromptsList(values){
<br> <br>
<input type="checkbox" class="define_response_lang" disabled> __MSG_customPrompts_form_label_define_response_lang__ <input type="checkbox" class="define_response_lang" disabled> __MSG_customPrompts_form_label_define_response_lang__
<br> <br>
<input type="checkbox" class="use_diff_viewer" disabled> __MSG_customPrompts_form_label_use_diff_viewer__ <label title="__MSG_customPrompts_form_label_use_diff_viewer_title__"><input type="checkbox" class="use_diff_viewer" disabled> __MSG_customPrompts_form_label_use_diff_viewer__</label>
<br> <br>
<input type="checkbox" class="enabled input_mod"> __MSG_customPrompts_form_label_enabled__ <input type="checkbox" class="enabled input_mod"> __MSG_customPrompts_form_label_enabled__
<span class="is_default hiddendata"></span> <span class="is_default hiddendata"></span>