diff --git a/android-client/web/app.html b/android-client/web/app.html index 1e7e320..c271005 100644 --- a/android-client/web/app.html +++ b/android-client/web/app.html @@ -186,8 +186,15 @@ font: inherit; outline: none; } .field-in::placeholder { color: var(--muted); } - .in-label { color: var(--muted); font-size: 12px; margin: 10px 0 -2px 4px; } - .in-label span { opacity: .7; } + .in-wrap { position: relative; } + /* Le champ laisse la place a la croix, sinon le texte passe dessous. */ + .in-wrap .field-in { padding-right: 44px; } + .in-x { + position: absolute; right: 0; top: 8px; width: 44px; height: 46px; + display: flex; align-items: center; justify-content: center; + color: var(--muted); font-size: 22px; + } + .in-x:active { opacity: .5; } #log { margin: 10px 0 0; padding: 10px 12px; max-height: 34vh; overflow: auto; background: rgba(0,0,0,.20); border-radius: var(--radius-s); @@ -221,26 +228,35 @@ depot, jamais dans le coffre. --> - + @@ -347,6 +363,18 @@ document.getElementById('btnSync').addEventListener('click', function () { pushConfig(); // ce qui est tape mais pas encore quitte compte aussi send('sync'); }); +// Un seul ecouteur pour les trois croix : elles ne different que par leur cible. +document.getElementById('cfg').addEventListener('click', function (ev) { + var id = ev.target.getAttribute('data-clear'); + if (!id) return; + var el = document.getElementById(id); + el.value = ''; + el.focus(); + // Delphi doit l'apprendre tout de suite : le champ ne perdra pas le focus, + // donc l'evenement qui remonte d'habitude la configuration n'aura pas lieu. + pushConfig(); +}); + document.getElementById('btnCfg').addEventListener('click', function () { var c = document.getElementById('cfg'); c.hidden = !c.hidden;