diff --git a/copyparty/web/browser.css b/copyparty/web/browser.css
index b94226db..9925f798 100644
--- a/copyparty/web/browser.css
+++ b/copyparty/web/browser.css
@@ -964,6 +964,11 @@ tr.play td:nth-child(1) a {
display: block;
width: 100%;
height: 100%;
+ height: calc(100% - 8px);
+ border-radius: calc(var(--radius) / 3 * 2);
+}
+#ggrid>a.play svg {
+ background: var(--bg-u2);
}
#ggrid>a img {
z-index: 1;
@@ -976,9 +981,12 @@ tr.play td:nth-child(1) a {
margin: 0 auto;
display: block;
width: 100%;
- height: 100%;
+ height: calc(var(--grid-sz) - 2.5em);
object-fit: cover;
}
+#ggrid>a.dir img {
+ max-height: calc(var(--grid-sz)/1.25 - 10px);
+}
#ggrid.noupscale>a img {
width: auto;
height: auto;
@@ -994,6 +1002,7 @@ tr.play td:nth-child(1) a {
max-height: 20em;
max-height: calc(var(--grid-sz)*2);
object-fit: contain;
+ height: 100%;
}
.imgcontainer {
@@ -1005,6 +1014,7 @@ tr.play td:nth-child(1) a {
box-sizing: border-box;
margin: -3px -2px;
padding: 4px 3px;
+ justify-content: center;
}
.th_ext {
position: absolute;
@@ -3972,7 +3982,7 @@ html.e #wrap.thin {
gap: 1em;
}
#ggrid.gallery {
- gap: 1px 2px;
+ gap: 2px 3px;
margin: -.2em -.5em;
a::before {
padding: .1em 0;
@@ -3983,6 +3993,10 @@ html.e #wrap.thin {
span:not(.th_ext) {
display: none;
}
+ img {
+ max-height: none;
+ height: calc(var(--grid-sz) - 8px);
+ }
}
}
#ggrid.gallery.nocrop {
@@ -3995,18 +4009,21 @@ html.e #wrap.thin {
}
a {
margin-bottom: .2em;
+ img {
+ height: calc(var(--grid-sz) - 1.5em);
+ }
}
- a.img, a.dir {
+ a.img {
min-width: calc(var(--grid-sz) / 2);
width: auto;
img {
max-width: 100%;
- height: calc(var(--grid-sz) - 1em);
-
+ height: var(--grid-sz);
}
}
a.dir {
img {
+ height: calc(var(--grid-sz) - 1.5em - 10px);
margin-left: 10px;
margin-right: 10px;
}
diff --git a/copyparty/web/browser.js b/copyparty/web/browser.js
index f16a5e5c..3bc367e4 100644
--- a/copyparty/web/browser.js
+++ b/copyparty/web/browser.js
@@ -6468,8 +6468,7 @@ var thegrid = (function () {
(isdir || ext == 'unk' || ext.startsWith('/') ? '' :
'' + ext + '') +
- '
' + ao.innerHTML + '');
}
ggrid.innerHTML = html.join('\n');