feat(dailies): 4:3 photo strip, lightbox, and dot sync
- Aspect ratio 3:2 → 4:3 (less aggressive crop; closer to phone native) - Slides become <button> elements with data-full pointing to original image - Tap/click any photo in the feed opens a full-screen lightbox showing the uncropped original; prev/next browses all feed photos; Esc/arrows/backdrop click close - Dot indicator now syncs with scroll via IntersectionObserver Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Vgmzx8VTTTmCskSpQtsLTr
This commit is contained in:
@@ -216,8 +216,13 @@ body::after {
|
||||
.journal-photo-slide {
|
||||
flex: 0 0 100%;
|
||||
scroll-snap-align: start;
|
||||
aspect-ratio: 3 / 2;
|
||||
aspect-ratio: 4 / 3;
|
||||
overflow: hidden;
|
||||
cursor: zoom-in;
|
||||
background: none;
|
||||
border: none;
|
||||
padding: 0;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.journal-photo-slide img {
|
||||
@@ -225,8 +230,11 @@ body::after {
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
display: block;
|
||||
transition: opacity 0.15s;
|
||||
}
|
||||
|
||||
.journal-photo-slide:hover img { opacity: 0.9; }
|
||||
|
||||
.journal-photo-dots {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
Reference in New Issue
Block a user