improve color picker

This commit is contained in:
Adrien MALINGREY 2023-10-23 17:25:21 +02:00
parent 24806a289f
commit beebb14464
3 changed files with 7 additions and 4 deletions

View File

@ -141,6 +141,7 @@ table input:enabled {
#colorPicker{ #colorPicker{
width: 2.5rem; width: 2.5rem;
height: auto;
} }
@media (prefers-color-scheme:dark) { @media (prefers-color-scheme:dark) {

View File

@ -11,6 +11,7 @@ let history = []
let accessKeyModifiers = "AccessKey+" let accessKeyModifiers = "AccessKey+"
let easyBoxes = [] let easyBoxes = []
let insertRadios = [] let insertRadios = []
let defautColor = ""
function shuffle(iterable) { function shuffle(iterable) {
array = Array.from(iterable) array = Array.from(iterable)
@ -81,7 +82,8 @@ window.onload = function() {
loadSavedGame() loadSavedGame()
colorPicker.value = getComputedStyle(document.body).getPropertyValue("--bs-body-color") defautColor = getComputedStyle(grid).getPropertyValue("--bs-body-color")
colorPicker.value = defautColor
if ("serviceWorker" in navigator) { if ("serviceWorker" in navigator) {
navigator.serviceWorker.register(`service-worker.php?location=${location.pathname}`) navigator.serviceWorker.register(`service-worker.php?location=${location.pathname}`)
@ -174,7 +176,7 @@ function oninput() {
this.previousPlaceholder = this.placeholder this.previousPlaceholder = this.placeholder
refreshBox(this) refreshBox(this)
} }
if (colorPicker.value) { if (colorPicker.value && colorPicker.value != defautColor) {
this.style.setProperty("color", colorPicker.value) this.style.setProperty("color", colorPicker.value)
} }
} }

View File

@ -24,7 +24,7 @@
<i class="ri-eraser-fill"></i> <i class="ri-eraser-fill"></i>
</label> </label>
</div> </div>
<input type="color" class="btn btn-primary form-control form-control-sm form-control-color" id="colorPicker" title="Couleur"/> <input type="color" class="btn btn-primary form-control form-control-sm form-control-color" id="colorPicker" title="Changer la couleur"/>
<div class='btn-group'> <div class='btn-group'>
<input type='checkbox' id='sightCheckbox' class='btn-check' onclick='highlighterCheckbox.checked = false; refreshUI()' /> <input type='checkbox' id='sightCheckbox' class='btn-check' onclick='highlighterCheckbox.checked = false; refreshUI()' />
<label for='sightCheckbox' class='btn btn-info' title='Surligner la ligne, la colonne et la région de la case survolée'> <label for='sightCheckbox' class='btn btn-info' title='Surligner la ligne, la colonne et la région de la case survolée'>