fix(android): no disc behind an entry icon

The translucent circle exists to back the initials of an entry without an
icon. A favicon brings its own transparency, so the circle showed through and
around it - a saucer under the drawing, plainly visible on the Gitea cup.

The circle is dropped as soon as the row carries an image, through a class on
the avatar rather than :has() so it does not depend on how new the engine is.
object-fit also goes from cover to contain: an icon is not a photograph and
has no business being cropped.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
r-zakarya
2026-08-17 15:28:48 +01:00
parent 930f74147f
commit aa87580443
+8 -2
View File
@@ -118,7 +118,13 @@
display: flex; align-items: center; justify-content: center;
font-weight: 600; font-size: 16px; overflow: hidden;
}
.av img { width: 100%; height: 100%; object-fit: cover; }
/* PAS DE PASTILLE SOUS UNE ICONE. Le rond translucide sert de fond aux
initiales ; une favicon a son propre fond transparent, et le rond se
voyait donc au travers et autour d'elle - une soucoupe sous le dessin.
`contain` plutot que `cover` : une icone n'est pas une photo, on ne la
recadre pas. */
.av.has-img { background: none; }
.av img { width: 100%; height: 100%; object-fit: contain; }
.txt { flex: 1; min-width: 0; }
.txt b { display: block; font-weight: 500; overflow: hidden;
text-overflow: ellipsis; white-space: nowrap; }
@@ -371,7 +377,7 @@ function renderRows() {
if (!matches(e)) continue;
shown++;
html += '<div class="row" data-i="' + e.i + '">'
+ '<div class="av">'
+ '<div class="av' + (e.icon ? ' has-img' : '') + '">'
+ (e.icon ? '<img src="' + esc(e.icon) + '">' : esc(e.initial))
+ '</div>'
+ '<div class="txt"><b>' + esc(e.name) + '</b>'