|
All checks were successful
ci / build (push) Successful in 25s
'backdrop-filter 에 SVG 를 얹으면 Chrome 이 선언 전체를 버린다' 고 적어두고 페이지 프리플라이트 로그에까지 실었다. 사실이 아니었다. Chrome 151 에서 재측정 computed 값이 none 이 아니라 url(#id) 로 유지된다 대비 높은 배경 위에서 실제로 굴절된다(줄무늬가 가장자리에서 압축됨) 진짜 원인은 feImage 의 width/height 를 요소 크기와 맞추지 않은 것이었다. backdrop-filter 는 필터 이미지를 자동으로 조정하지 않는다. 검색도 다시 했다. feTurbulence grain 에 갇혀 2019년 글만 보고 있었다. liquid glass 계열 최신 자료를 보니 변위 지도는 노이즈가 아니라 물리 기반 사전계산 이미지였다 — R=X변위, G=Y변위, 128 이 중립, 감쇠는 Squircle 곡선. 캔버스로 즉석 생성하면 240x160 이 2.7KB 다. 스킬 svg-filters.md 에 '리퀴드 글래스' 절을 넣었다. 구조 · 변위 지도 만드는 법 · 함정 넷 · @supports 폴백. 오판 정정도 문서 첫 줄에 남겼다. 한 번 실패한 것을 '안 되는 것' 으로 적으면 그 문장이 다음 사람의 상한선이 된다. 페이지 로그 항목도 그 내용으로 바꿨다. |
||
|---|---|---|
| .. | ||
| src | ||
| astro.config.mjs | ||
| design.md | ||
| package.json | ||
| tsconfig.json | ||