Restyle chat width slider

This commit is contained in:
Cohee
2023-09-22 16:56:01 +03:00
parent 52cf684444
commit 3d1312c13a
3 changed files with 13 additions and 11 deletions

View File

@ -2698,8 +2698,8 @@
</select> </select>
</div> </div>
</div> </div>
<div id="UI-language-block" class="flex-container"> <div id="UI-language-block" class="flex-container alignitemscenter">
<span data-i18n="UI Language">Language</span> <span data-i18n="UI Language">Language:</span>
<select id="ui_language_select" class="widthNatural flex1 margin0"> <select id="ui_language_select" class="widthNatural flex1 margin0">
<option value="" data-i18n="Default">Default</option> <option value="" data-i18n="Default">Default</option>
<option value="en">en</option> <option value="en">en</option>
@ -2792,11 +2792,11 @@
</div> </div>
<div class="range-block-range-and-counter"> <div class="range-block-range-and-counter">
<div class="range-block-range"> <div class="range-block-range">
<input id="chat_width_slider" class="wide100p" type="range" min="25" max="75" step="1" value="50"> <input id="chat_width_slider" class="wide100p" type="range" min="25" max="100" step="1" value="50">
<div class="slider_hint"> </div>
<span>25%</span> <div class="range-block-counter">
<span>50%</span> <div contenteditable="true" data-for="chat_width_slider" id="chat_width_slider_counter">
<span>75%</span> select
</div> </div>
</div> </div>
</div> </div>
@ -4547,4 +4547,4 @@
</script> </script>
</body> </body>
</html> </html>

View File

@ -8745,7 +8745,7 @@ jQuery(async function () {
} }
console.debug('Label value OK, setting to the master input control', myText); console.debug('Label value OK, setting to the master input control', myText);
$(masterElement).val(myValue).trigger('input'); $(masterElement).val(myValue).trigger('input').trigger('mouseup');
restoreCaretPosition($(this).get(0), caretPosition); restoreCaretPosition($(this).get(0), caretPosition);
}); });

View File

@ -382,8 +382,8 @@ function switchMesIDDisplay() {
let before = power_user.mesIDDisplay_enabled; let before = power_user.mesIDDisplay_enabled;
power_user.mesIDDisplay_enabled = value === null ? true : value == "true"; power_user.mesIDDisplay_enabled = value === null ? true : value == "true";
/* console.log(` /* console.log(`
localstorage value:${value}, localstorage value:${value},
poweruser before:${before}, poweruser before:${before},
poweruser after:${power_user.mesIDDisplay_enabled}`) */ poweruser after:${power_user.mesIDDisplay_enabled}`) */
$("body").toggleClass("no-mesIDDisplay", !power_user.mesIDDisplay_enabled); $("body").toggleClass("no-mesIDDisplay", !power_user.mesIDDisplay_enabled);
$("#mesIDDisplayEnabled").prop("checked", power_user.mesIDDisplay_enabled); $("#mesIDDisplayEnabled").prop("checked", power_user.mesIDDisplay_enabled);
@ -520,6 +520,8 @@ function applyChatWidth(type) {
document.documentElement.style.setProperty('--sheldWidth', `${power_user.chat_width}vw`); document.documentElement.style.setProperty('--sheldWidth', `${power_user.chat_width}vw`);
}) })
} }
$('#chat_width_slider_counter').text(power_user.chat_width);
} }
async function applyThemeColor(type) { async function applyThemeColor(type) {