lekss361/gendesign
1
0
Fork 0
Code Issues 57 Pull requests Projects Releases Packages Wiki Activity Actions

fix(tradein): фото аналога в Сводке больше не скрыто плейсхолдером

Browse source 
В .hero-photo псевдоэлементы ::before/::after рисуют декоративный
скелет-плейсхолдер «фасада дома». Они position:absolute, а <img> с
фото аналога — position:static, поэтому абсолютные псевдоэлементы
рисовались ПОВЕРХ картинки: реальное фото загружалось (naturalWidth
есть), но визуально всегда был серый плейсхолдер.

Фото (z-index 1) и подпись .photo-meta (z-index 2) теперь над
скелетом. Скелет остаётся виден, когда фото нет или оно не
загрузилось (onError → display:none).
This commit is contained in:
Light1YT 2026-05-22 15:35:01 +05:00
parent 07903b1c36
commit 6041ac8464
1 changed files with 8 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
tradein-mvp/frontend/src/components/trade-in/trade-in.css
View file

@ -537,8 +537,16 @@
background: linear-gradient(135deg, oklch(85% 0.02 250), oklch(78% 0.025 240));
overflow: hidden;
}
/* Реальное фото аналога должно перекрывать плейсхолдер-скелет (::before /
::after) — иначе абсолютные псевдоэлементы рисуются поверх <img>.
Если фото нет или оно не загрузилось — скелет остаётся виден. */
.hero-photo img {
position: relative;
z-index: 1;
}
.hero-photo .photo-meta {
position: absolute;
z-index: 2;
bottom: 10px; left: 12px;
display: inline-flex; gap: 6px;
padding: 4px 8px;