mirror of
https://github.com/bilawalsidhu/gods-eye-view.git
synced 2026-11-05 10:53:59 +00:00
fix(street-level): fit the whole photo on phones
At phone width the right rail is the band between mid-screen and the credit line, so a 16:10 viewer plus its bar and caption was cut off. Below 720 px the viewer's height is derived from that band (clamped 110-320 px); floating and expanded viewers reset to auto height. The QA harness checks the photo and caption fit at 390x844, and CURRENT-STATE documents the docking rules and phone sizing. Co-Authored-By: Claude Opus 5.5 <[email protected]>
This commit is contained in:
1 parent
6207e4144e
commit
e6c2c812f9
4 files changed
+91
-2
No files matched your search
@@ -122,6 +122,19 @@ test('labels say what the buttons do', () => {
|
||||
);
|
||||
});
|
||||
|
||||
test('on phones the viewer is sized from the rail band, not its aspect ratio', () => {
|
||||
assert.match(
|
||||
panelCss,
|
||||
/@media \(max-width: 720px\) \{\s*\.sl-viewer \{[^}]*height: clamp\(/,
|
||||
);
|
||||
// Floating and expanded viewers must not inherit the phone height.
|
||||
for (const selector of [
|
||||
".panel-floating\\[style\\*='height'\\] \\.sl-viewer",
|
||||
'\\.sl-viewer-wrap-expanded \\.sl-viewer',
|
||||
])
|
||||
assert.match(panelCss, new RegExp(`${selector} \\{[^}]*height: auto`));
|
||||
});
|
||||
|
||||
test('the viewer comes first and the panel is a portable, resizable window', () => {
|
||||
const controlsBlock = html.slice(html.indexOf('<fieldset id="sl-controls"'));
|
||||
assert.ok(
|
||||
|
||||
Reference in new issue
Block a user