diff --git a/copyparty/web/browser.js b/copyparty/web/browser.js
index 581a6dd0..519c5f0c 100644
--- a/copyparty/web/browser.js
+++ b/copyparty/web/browser.js
@@ -5696,10 +5696,7 @@ var thegrid = (function () {
swrite('gridln', r.ln);
setTimeout(r.tippen, 20);
}
- try {
- document.documentElement.style.setProperty('--grid-ln', r.ln);
- }
- catch (ex) { }
+ setcvar('--grid-ln', r.ln);
}
setln();
@@ -5709,10 +5706,7 @@ var thegrid = (function () {
swrite('gridsz', r.sz);
setTimeout(r.tippen, 20);
}
- try {
- document.documentElement.style.setProperty('--grid-sz', r.sz + 'em');
- }
- catch (ex) { }
+ setcvar('--grid-sz', r.sz + 'em');
aligngriditems();
}
setsz();
@@ -6775,10 +6769,7 @@ var filecolwidth = (function () {
return;
lastwidth = w;
- try {
- document.documentElement.style.setProperty('--file-td-w', w + 'em');
- }
- catch (ex) { }
+ setcvar('--file-td-w', w + 'em');
}
})();
onresize100.add(filecolwidth, true);
@@ -7022,10 +7013,7 @@ var treectl = (function () {
w = iw + 'em',
w2 = (iw + 2) + 'em';
- try {
- document.documentElement.style.setProperty('--nav-sz', w);
- }
- catch (ex) { }
+ setcvar('--nav-sz', w);
ebi('tree').style.width = w;
ebi('wrap').style.marginLeft = w2;
onscroll();
diff --git a/copyparty/web/ui.css b/copyparty/web/ui.css
index e1e77fcd..a2b521ed 100644
--- a/copyparty/web/ui.css
+++ b/copyparty/web/ui.css
@@ -69,6 +69,19 @@ html {
top: 2em;
bottom: unset;
}
+#toastt {
+ position: absolute;
+ height: 1px;
+ top: 1px;
+ right: 1%;
+ width: 99%;
+ background: var(--fg-max);
+ animation: toastt var(--tmtime) steps(var(--tmstep)) forwards;
+ transform-origin: right;
+}
+@keyframes toastt {
+ to {transform: scaleX(0)}
+}
#toast a {
color: inherit;
text-shadow: inherit;
diff --git a/copyparty/web/util.js b/copyparty/web/util.js
index ede0dfd1..e3449b48 100644
--- a/copyparty/web/util.js
+++ b/copyparty/web/util.js
@@ -535,6 +535,14 @@ function clgot(el, cls) {
}
+function setcvar(k, v) {
+ try {
+ document.documentElement.style.setProperty(k, v);
+ }
+ catch (e) { }
+}
+
+
var ANIM = true;
try {
var mq = window.matchMedia('(prefers-reduced-motion: reduce)');
@@ -1525,7 +1533,10 @@ var toast = (function () {
if (txt.indexOf('') + 1)
txt = txt.slice(0, txt.indexOf('<')) + ' [...]';
- obj.innerHTML = 'x' + lf2br(txt) + '
';
+ setcvar('--tmtime', sec + 's');
+ setcvar('--tmstep', sec * 15);
+
+ obj.innerHTML = 'x' + lf2br(txt) + '
';
obj.className = cl;
sec += obj.offsetWidth;
obj.className += ' vis';