diff --git a/copyparty/web/browser.css b/copyparty/web/browser.css index 004f9e67..b912318f 100644 --- a/copyparty/web/browser.css +++ b/copyparty/web/browser.css @@ -2560,27 +2560,20 @@ html.y #bbox-overlay figcaption a { inset: 0; } -/* up2k */ -#op_up2k { - display: block; - width: 100%; - overflow-y: auto; -} - /* settings */ -#s_hor { +.modalsplit { display: grid; grid-template-columns: auto auto auto; min-height: 0; } -#s_nav, #s_list{ +.splitsub { display: flex; flex-direction: column; overflow-y: auto; padding: .5em; padding-top: 0; } -#s_divider{ +.divider{ background: var(--a); width: 1px; margin: 1em 0; @@ -2763,7 +2756,6 @@ html.y #bbox-overlay figcaption a { font-size: 1.5em; margin: .5em auto; padding: .8em 0; - width: 16em; cursor: pointer; } #op_up2k.srch #u2btn { @@ -2802,7 +2794,6 @@ html.y #bbox-overlay figcaption a { #u2tabw { min-height: 0; transition: min-height .2s; - margin: 2em 0; } #u2tabw.na>table { display: none; @@ -2885,24 +2876,15 @@ html.y #bbox-overlay figcaption a { width: 21em; } #u2cards { - padding: 1em 1em 0 0; - margin: 0 auto; + padding: 1em 1em .4em .3em; white-space: nowrap; text-align: center; - overflow: hidden; - min-width: 24em; -} -#u2etaw.w { - width: 55em; - text-align: right; - margin: 2em auto -2em auto; - z-index: 1; - position: relative; - pointer-events: none; + overflow-y: hidden; + overflow-x: auto; } #u2cards a { padding: .2em 1em; - padding-bottom: 5px; + padding-bottom: .3em; background: var(--u2-tab-bg); border: 1px solid #999; border-color: var(--u2-tab-b1); @@ -2939,9 +2921,6 @@ html.y #bbox-overlay figcaption a { margin: 1em 1em; width: 30em; } -#u2conf.w { - width: 51em; -} #u2conf .c, #u2conf .c * { text-align: center; @@ -3123,6 +3102,27 @@ html.b #u2conf a.b:hover { font-size: 1.1em; line-height: 0; } +#up_list { + padding-bottom: 2em; +} +#up_list details { + border: var(--bg-u3) solid 1px; + border-radius: .3em; + margin: .3em; +} +#up_list summary { + cursor: pointer; + background: var(--bg-u1); + color: var(--a); + padding: .3em; + border-radius: .3em; +} +#up_list summary:hover { + background: var(--bg-u3); +} +#up_list .sub { + margin: .3em; +} @@ -3233,10 +3233,6 @@ html.a #u2etas { border-radius: .5em; border-width: .25em 0; } -html.c #u2cards, -html.a #u2cards { - margin: 0 auto -1em auto; -} html.c #u2foot:empty, html.a #u2foot:empty { margin-bottom: -1em; @@ -3457,11 +3453,14 @@ html.d #treepar { #ghead { margin: .5em; } - #s_hor { + .modalsplit { display: block; overflow-y: auto; } - #s_divider { + .splitsub { + overflow-y: hidden; + } + .divider { display: none; } #pctl { diff --git a/copyparty/web/browser.html b/copyparty/web/browser.html index 7bcfd815..92f8def8 100644 --- a/copyparty/web/browser.html +++ b/copyparty/web/browser.html @@ -179,10 +179,10 @@
diff --git a/copyparty/web/browser.js b/copyparty/web/browser.js index ccd07f1f..e69d5a7d 100644 --- a/copyparty/web/browser.js +++ b/copyparty/web/browser.js @@ -944,18 +944,20 @@ ebi('op_up2k').innerHTML = ( L.ul_send + ': (' + L.ul_idle1 + ')' + L.ul_flagblk + '
\n' + '' + '' diff --git a/copyparty/web/up2k.js b/copyparty/web/up2k.js index 369b00be..1c7ad51e 100644 --- a/copyparty/web/up2k.js +++ b/copyparty/web/up2k.js @@ -597,6 +597,7 @@ function U2pvis(act, btns, uc, st) { r.addrow = function (nfile) { var tr = r.genrow(nfile); ebi('u2tab').tBodies[0].appendChild(tr); + ebi('up_loading').appendChild(tr) }; btns = QSA(btns + '>a[act]'); @@ -3036,40 +3037,6 @@ function up2k_init(subtle) { /// config ui // - function onresize(e) { - // 10x faster than matchMedia('(min-width - var bar = ebi('ops'), - wpx = window.innerWidth, - fpx = parseInt(getComputedStyle(bar)['font-size']), - wem = wpx * 1.0 / fpx, - wide = wem > 57 ? 'w' : '', - parent = ebi(wide ? 'u2btn_cw' : 'u2btn_ct'), - btn = ebi('u2btn'); - - if (btn.parentNode !== parent) { - parent.appendChild(btn); - ebi('u2conf').className = ebi('u2cards').className = ebi('u2etaw').className = wide; - } - - parent = ebi('u2c3t'); - var its = [ebi('u2etaw'), ebi('u2cards')]; - if (its[0].parentNode !== parent) { - ebi('u2conf').className = wide; - for (var a = 0; a < 2; a++) { - parent.appendChild(its[a]); - its[a].className = wide; - } - } - } - onresize100.add(onresize, true); - - if (MOBILE) { - // android-chrome wobbles for a bit; firefox / iOS-safari are OK - setTimeout(onresize, 20); - setTimeout(onresize, 100); - setTimeout(onresize, 500); - } - var o = QSA('#u2conf .c *[tt]'); for (var a = o.length - 1; a >= 0; a--) { o[a].parentNode.getElementsByTagName('input')[0].setAttribute('tt', o[a].getAttribute('tt')); @@ -3324,7 +3291,6 @@ function up2k_init(subtle) { draw_turbo(); draw_life(); - onresize(); } function apply_flag_cfg() {