Gallery: photos open lightbox, add project button, watermark our photos

Gallery flow:
- Album covers now open the photo lightbox directly (full album set), while
  the title/"Read the story" link opens the article. Previously the whole card
  linked to the article and photos were only at the bottom of it.
- Each album carries its full photo set in a hidden js-lightbox grid; added
  main.js support for [data-lightbox-target] cover triggers.
- Added the missing main.js include on the gallery page (its lightbox, mobile
  menu and language switcher never ran before).
- Lightbox gained an optional "Read the story ->" button (data-project-url /
  data-project-label) shown only for gallery albums.

Watermark:
- Baked a subtle "(c) msosorg.com" watermark (bottom-right, sized per image)
  into 114 of our own event/community photos. Stock/partner/logo/icon images
  excluded. Clean originals backed up to images/_originals/ (git-ignored); the
  script always re-derives from them so re-runs never stack.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
popovskikandClaude Opus 4.8 committed 2026-08-08 01:55:34 +02:00
1 parent 91d29121c0
commit e8604a9665
121 files changed
+519 -139

No files matched your search

+13
View File
@@ -59,6 +59,19 @@
text-align: center; color: rgba(255, 255, 255, 0.85);
font-size: 14px; padding: 0 24px;
}
/* "Go to project" button (only shown for gallery-page albums) */
.lightbox-project {
position: absolute; bottom: 46px; left: 50%; transform: translateX(-50%);
display: inline-flex; align-items: center;
padding: 9px 18px; border-radius: 999px;
background: #E8833A; color: #FFFFFF;
font-size: 14px; font-weight: 600; text-decoration: none;
box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35);
transition: background 0.15s ease, transform 0.15s ease;
}
.lightbox-project::after { content: "\00a0\2192"; }
.lightbox-project:hover { background: #D9752E; transform: translateX(-50%) translateY(-1px); }
.lightbox-project[hidden] { display: none; }
@media (max-width: 700px) {
.event-gallery { margin: 36px 0 8px; }