fix column-hiding ux on phones:

table header click-handler didn't cover the entire cell so it was
easy to sort the table by accident; also do not exit hiding mode
automatically since you usually want to hide several columns
(so also adjust css to make it obvious you're in hiding mode)
This commit is contained in:
ed 2023-09-28 09:28:26 +02:00
parent 01a851da28
commit 8620ae5bb7
2 changed files with 21 additions and 15 deletions

View file

@ -728,6 +728,11 @@ a:hover {
html.y #files thead th {
box-shadow: 0 1px 0 rgba(0,0,0,0.12);
}
html #files.hhpick thead th {
color: #f7d;
background: #000;
box-shadow: .1em .2em 0 #f6c inset, -.1em -.1em 0 #f6c inset;
}
#files td {
margin: 0;
padding: .3em .5em;
@ -2112,12 +2117,12 @@ html.y #bbox-overlay figcaption a {
}
.bbox-btn,
#bbox-btns {
opacity: 1;
opacity: 1;
animation: opacity .2s infinite ease-in-out;
}
.bbox-btn.off,
#bbox-btns.off {
opacity: 0;
opacity: 0;
}
#bbox-overlay button {
cursor: pointer;
@ -2387,7 +2392,7 @@ html.y #bbox-overlay figcaption a {
display: block;
}
#u2bm sup {
font-weight: bold;
font-weight: bold;
}
#u2notbtn {
display: none;
@ -2991,13 +2996,13 @@ html.b .btn {
top: -.1em;
}
html.b #op_up2k.srch sup {
color: #fc0;
color: #fc0;
}
html.by #u2btn sup {
color: #06b;
color: #06b;
}
html.by #op_up2k.srch sup {
color: #b70;
color: #b70;
}
html.bz #u2cards a.act {
box-shadow: 0 -.1em .2em var(--bg-d2);

View file

@ -187,7 +187,7 @@ var Ls = {
"cl_hiddenc": "hidden columns",
"cl_hidec": "hide",
"cl_reset": "reset",
"cl_hpick": "click one column header to hide in the table below",
"cl_hpick": "tap on column headers to hide in the table below",
"cl_hcancel": "column hiding aborted",
"ct_thumb": "in grid-view, toggle icons or thumbnails$NHotkey: T",
@ -656,7 +656,7 @@ var Ls = {
"cl_hiddenc": "skjulte kolonner",
"cl_hidec": "skjul",
"cl_reset": "nullstill",
"cl_hpick": "klikk overskriften til kolonnen du ønsker å skjule i tabellen nedenfor",
"cl_hpick": "klikk overskriften til kolonnene du ønsker å skjule i tabellen nedenfor",
"cl_hcancel": "kolonne-skjuling avbrutt",
"ct_thumb": "vis miniatyrbilder istedenfor ikoner$NSnarvei: T",
@ -6445,9 +6445,9 @@ var filecols = (function () {
ebi('hcolsh').onclick = function (e) {
ev(e);
if (r.picking)
return r.unpick(false);
return r.unpick();
var lbs = QSA('#files>thead th>span');
var lbs = QSA('#files>thead th');
for (var a = 0; a < lbs.length; a++) {
lbs[a].onclick = function (e) {
ev(e);
@ -6455,19 +6455,20 @@ var filecols = (function () {
toast.hide();
r.hide(e.target.textContent);
r.unpick(true);
};
};
r.picking = true;
clmod(ebi('files'), 'hhpick', 1);
toast.inf(0, L.cl_hpick, 'pickhide');
};
r.unpick = function (picked) {
r.unpick = function () {
r.picking = false;
if (!picked)
toast.inf(5, L.cl_hcancel);
toast.inf(5, L.cl_hcancel);
var lbs = QSA('#files>thead th>span');
clmod(ebi('files'), 'hhpick');
var lbs = QSA('#files>thead th');
for (var a = 0; a < lbs.length; a++)
lbs[a].onclick = null;
};