Add privacy toggle to blur media on generate and gallery pages
All checks were successful
Build and Push Frontend Docker Image / build (push) Successful in 30s

- Add "Hide Media" / "Show Media" button to both sections
- Blur images and videos when privacy mode is active
- Persist privacy preference in localStorage per section

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Debian
2026-01-08 00:36:28 +00:00
parent ff54cf7363
commit 55af3da1ae
3 changed files with 56 additions and 0 deletions

View File

@@ -666,3 +666,29 @@ body {
text-align: center;
}
}
/* Privacy Mode */
.privacy-toggle.active {
background: var(--primary);
color: white;
}
.privacy-mode .preview-image,
.privacy-mode .output-video,
.privacy-mode .gallery-item-media video,
.privacy-mode .gallery-item-media img {
filter: blur(20px);
transition: filter 0.3s ease;
}
.privacy-mode .gallery-item-media::after {
content: 'Hidden';
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: white;
font-weight: 500;
text-shadow: 0 1px 3px rgba(0,0,0,0.5);
pointer-events: none;
}