diff options
| author | Paul Buetow <paul@buetow.org> | 2026-04-10 09:32:07 +0300 |
|---|---|---|
| committer | Paul Buetow <paul@buetow.org> | 2026-04-10 09:32:07 +0300 |
| commit | 762589bd807c4888f4d7dcac32606b157216a049 (patch) | |
| tree | c57505973bc31ec9007f5876610412248064b6f1 /internal/generator/shared.go | |
| parent | f3155cbc866a1b261a0aafe61683da1e3c25b1ef (diff) | |
enhance WebGL scenes, modal transparency, new cosmos theme, UX polish
Themes:
- glass → cosmos: ringed planet with asteroid belt, nebula clouds, 2500 stars
- ocean: sea rock spires, bioluminescent jellyfish, rising bubbles, whale
- volcano: glowing lava floor with vertex animation, molten boulders,
smoke plume particles, underground furnace glow sphere
UX / shared:
- Modal background changed to rgba(0,0,0,0.55) so WebGL stays visible
behind expanded post view (all themes)
- Max-width 1200px applied to all themes via shared navmodal CSS
- Default theme changed from "neon" to "random"
Sample content:
- 120 example entries processed into dist/ for pagination testing
(4 pages of 42 posts each)
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Diffstat (limited to 'internal/generator/shared.go')
| -rw-r--r-- | internal/generator/shared.go | 8 |
1 files changed, 6 insertions, 2 deletions
diff --git a/internal/generator/shared.go b/internal/generator/shared.go index 12a91f4..a34c5a5 100644 --- a/internal/generator/shared.go +++ b/internal/generator/shared.go @@ -21,10 +21,14 @@ const navDefs = ` {{define "navmodal"}} <style> -/* Thumbnail sizing in list view; modal overrides to full width so images - appear larger when a post is expanded with Enter. */ +/* Thumbnail sizing in list view; modal overrides to full width. */ .post-image { max-height:220px; max-width:100%; object-fit:cover; cursor:pointer; } #post-modal .post-image { max-height:none; width:100%; max-width:100%; object-fit:contain; cursor:default; } +/* Semi-transparent modal backdrop so the WebGL scene stays visible behind + the expanded post. Theme-specific modal-inner keeps its own background. */ +.post-modal { background:rgba(0,0,0,0.55) !important; backdrop-filter:blur(6px) !important; } +/* Content area max-width across all themes */ +.overlay { max-width:1200px; margin-left:auto; margin-right:auto; } </style> <div class="post-modal" id="post-modal"> <div class="modal-inner"> |