fix: Thumb-Größe begrenzt + console.warn wenn photo.php kein Bild liefert
All checks were successful
Deploy baustelle-pwa / deploy (push) Successful in 1s
All checks were successful
Deploy baustelle-pwa / deploy (push) Successful in 1s
- photo-grid: max-width 600px, thumb max 160px (vorher riesig auf Desktop) - auto-fill Grid statt fixes repeat(3) - api.getPhotoBlobUrl loggt Content-Type + Body bei Fehler, um API-Probleme in der Konsole sichtbar zu machen Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> [deploy]
This commit is contained in:
parent
a234de58c5
commit
720cdc446d
2 changed files with 15 additions and 2 deletions
5
app.css
5
app.css
|
|
@ -187,16 +187,19 @@ body {
|
||||||
|
|
||||||
.photo-grid {
|
.photo-grid {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: repeat(3, 1fr);
|
grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
|
||||||
gap: 6px;
|
gap: 6px;
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
|
max-width: 600px;
|
||||||
}
|
}
|
||||||
.photo-grid .thumb {
|
.photo-grid .thumb {
|
||||||
aspect-ratio: 1;
|
aspect-ratio: 1;
|
||||||
|
max-width: 160px;
|
||||||
background: #2a2a30;
|
background: #2a2a30;
|
||||||
border-radius: 6px;
|
border-radius: 6px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
.photo-grid .thumb img {
|
.photo-grid .thumb img {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
|
||||||
12
lib/api.js
12
lib/api.js
|
|
@ -101,7 +101,17 @@
|
||||||
const r = await fetch(API_BASE + '/photo.php?' + params.toString(), {
|
const r = await fetch(API_BASE + '/photo.php?' + params.toString(), {
|
||||||
headers: { Authorization: 'Bearer ' + t },
|
headers: { Authorization: 'Bearer ' + t },
|
||||||
});
|
});
|
||||||
if (!r.ok) return null;
|
if (!r.ok) {
|
||||||
|
const body = await r.text().catch(() => '');
|
||||||
|
console.warn('photo.php failed', r.status, relpath, body);
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
const ct = r.headers.get('Content-Type') || '';
|
||||||
|
if (!ct.startsWith('image/')) {
|
||||||
|
const body = await r.text().catch(() => '');
|
||||||
|
console.warn('photo.php not an image', ct, body);
|
||||||
|
return null;
|
||||||
|
}
|
||||||
const blob = await r.blob();
|
const blob = await r.blob();
|
||||||
const url = URL.createObjectURL(blob);
|
const url = URL.createObjectURL(blob);
|
||||||
blobUrlCache.set(key, url);
|
blobUrlCache.set(key, url);
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue