mirrors/copyparty
1
0
Fork 0
mirror of https://github.com/9001/copyparty.git synced 2026-06-22 05:53:29 -06:00
Code Issues Actions Packages Projects Releases Wiki Activity

more layout fixes

Browse source
This commit is contained in:
Til Schmitter 2026-05-08 23:21:23 +02:00
parent 87f377cc72
commit 7c56989cf0
2 changed files with 64 additions and 75 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

33
copyparty/web/browser.css
View file

@ -955,37 +955,30 @@ tr.play td:nth-child(1) a {
border-color: var(--g-f-b1);
box-shadow: 0 .1em .3em var(--g-sh);
}
#ggrid>a svg {
position: absolute;
max-width: 10em;
max-width: calc(var(--grid-sz) - 4px);
max-height: 8em;
max-height: calc(var(--grid-sz)/1.25);
display: block;
width: 100%;
height: 100%;
height: calc(100% - 8px);
border-radius: calc(var(--radius) / 3 * 2);
}
#ggrid>a.play svg {
#ggrid>a.play .thumb {
background: var(--bg-u2);
}
#ggrid>a .thumb,
#ggrid>a img {
z-index: 1;
border-radius: 5px;
border-radius: calc(var(--radius) / 3 * 2);
max-width: 10em;
max-width: calc(var(--grid-sz) - 4px);
max-height: 8em;
max-height: calc(var(--grid-sz)/1.25);
margin: 0 auto;
display: block;
width: 100%;
height: calc(var(--grid-sz) - 2.5em);
object-fit: cover;
}
#ggrid>a img {
position: absolute;
opacity: 0;
}
#ggrid>a.dir .thumb,
#ggrid>a.dir img {
max-height: calc(var(--grid-sz)/1.25 - 10px);
max-width: calc(var(--grid-sz) - 20px);
margin: 10px auto 0 auto;
}
#ggrid.noupscale>a img {
width: auto;
@ -994,10 +987,6 @@ tr.play td:nth-child(1) a {
#ggrid.noupscale.gallery.nocrop>a img {
object-fit: scale-down;
}
#ggrid>a.dir img {
max-width: calc(var(--grid-sz) - 20px);
margin: 10px auto 0 auto;
}
#ggrid.nocrop>a img {
max-height: 20em;
max-height: calc(var(--grid-sz)*2);
@ -3993,6 +3982,7 @@ html.e #wrap.thin {
span:not(.th_ext) {
display: none;
}
.thumb,
img {
max-height: none;
height: calc(var(--grid-sz) - 8px);
@ -4009,6 +3999,7 @@ html.e #wrap.thin {
}
a {
margin-bottom: .2em;
.thumb,
img {
height: calc(var(--grid-sz) - 1.5em);
}
@ -4016,12 +4007,14 @@ html.e #wrap.thin {
a.img {
min-width: calc(var(--grid-sz) / 2);
width: auto;
.thumb,
img {
max-width: 100%;
height: var(--grid-sz);
}
}
a.dir {
.thumb,
img {
height: calc(var(--grid-sz) - 1.5em - 10px);
margin-left: 10px;

8
copyparty/web/browser.js
View file

@ -6468,7 +6468,7 @@ var thegrid = (function () {
(isdir || ext == 'unk' || ext.startsWith('/') ? '' :
'<span class="th_ext" style="font-size: ' + (r.sz / 5) +'em; font-size:calc(var(--grid-sz) / 5 * ' +
(ext.length > 3 ? 1 / (3 + ext.length * .4) * 3 : 1) + ')">' + ext + '</span>') +
'<img loading="lazy" onload="th_onload(this)" onerror="th_onerror(this)" src="' +
'<img loading="lazy" onload="th_onload(this)" src="' +
ihref + '" /></div><span class="' + ac + '">' + ao.innerHTML + '</span></a>');
}
ggrid.innerHTML = html.join('\n');
@ -6668,6 +6668,7 @@ var thegrid = (function () {
function th_onload(el) {
el.style.position = 'static'
el.style.opacity = '1'
el.style.height = '';
el.previousSibling.style.display =
@ -6675,11 +6676,6 @@ function th_onload(el) {
'none'
}
function th_onerror(el) {
el.style.opacity = '0'
el.style.pointerEvents = 'none'
}
function tree_scrollto(e) {
ev(e);