to master#693
Merged
Merged
Conversation
- Set Cross-Origin-Opener-Policy: same-origin-allow-popups on every server response so Google Identity Services' window.closed polling stops emitting COOP violations during the OAuth popup flow. - Drop the deprecated Facebook Like Box iframe (source of the unload / ErrorUtils warnings); keep the existing "Like Us On Facebook" link. - Convert server.js (CommonJS) to server.mjs (ESM); gate app.listen so the module can be imported by tests without binding a port. Update Procfile, CircleCI config, and the eslint ignore list to match. - Replace superagent and axios with native fetch across src and tests; drop both from package.json. Tests now stub global fetch via vi.stubGlobal. - Add test/server.spec.ts (first server coverage) using native fetch against app.listen(0) — no supertest dep needed. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Replace the removed Like Box (likebox.php — retired by Meta) with the modern Page Plugin (page.php?tabs=timeline) so the homepage feed renders again. Page Plugin is Meta's supported successor and shows the page's posts, cover, and like button. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Resolves the CircleCI language-server "Job is unused" warning. Behavior is unchanged — CI was already running build via the implicit fallback. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
fix(#562): silence post-login console errors + modernize HTTP client
Bumps [fast-uri](https://github.com/fastify/fast-uri) from 3.1.0 to 3.1.2. - [Release notes](https://github.com/fastify/fast-uri/releases) - [Commits](fastify/fast-uri@v3.1.0...v3.1.2) --- updated-dependencies: - dependency-name: fast-uri dependency-version: 3.1.2 dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com>
…uri-3.1.2 Bump fast-uri from 3.1.0 to 3.1.2
Two small visual glitches reported in claude-opus-tasks.txt Task 3. 1. News page: the SignUpForEmails component rendered the useResizeDetector height value inside a <p style="color: white"> as visible text. The white-on-white was presumably intended to hide it but the value showed up as a floating number near the bottom of the news page. The element was diagnostic and serves no runtime purpose now — removed entirely. The height value is still passed in for the conditional Sign Up button logic; only the visible <p> tag is gone. 2. ELCA footer logo (shared component): the logo was rendering tiny on desktop (fixed width: 308px) and clipped on the left edge because the wrapper div had marginLeft: '-9px'. Replaced with width: '100%' + maxWidth: '500px' (responsive — scales down on mobile, larger on desktop) and removed the negative margin so it's not pushed offscreen. The empty marginLeft: '' artifact on the inner img style was also removed. Snapshot tests for every page that uses ELCALogo (Beliefs, Family, Music, Staff, Giving, News, and their index variants) updated to match the new style. No other tests affected; lint + typecheck clean. Visual verification: cannot test in a browser from CLI — confirm the logo size + alignment + the absence of the floating number on the deployed preview when this PR lands.
Follow-up to v1 (PR #692 first commit) — Josh tested locally and reported the logo edges still looked clipped. v1 removed the wrapper div's -9px left margin but the deeper issues were: - maxWidth: 500px was small for a horizontal logotype banner (image is 1500x197 native — at 500px it renders as a small ~66px tall strip). - The inline anchor wrapping the img didn't have its own width context, so the img's width: 100% was relative to whatever the anchor collapsed to, not always the full container. - The mobile-scoped !important rules in static/_mobile.scss still had negative left margins (margin: auto auto auto -12px) that would clip the left edge on narrow viewports — defensive cleanup even though desktop wasn't hitting them. Changes in this commit: - src/components/elcaLogo.tsx: * Wrapper div: added padding: '0 16px' to keep the logo off the page edges on narrow containers. * Anchor (a): added display: 'inline-block', maxWidth: '100%' so it forms a proper layout context for the img inside. * Img: display: 'block', maxWidth bumped 500px -> 700px, added height: 'auto', margin '0 auto' for centering. - static/_mobile.scss: rewrote all three #elcaLogo blocks that used 'margin: auto auto auto -<N>px !important' to 'margin: 0 auto !important' so the logo centers cleanly at every breakpoint instead of being pushed off the left edge. Snapshot tests for all 9 ELCALogo-consuming pages regenerated. Lint clean, typecheck clean.
…der compat) The earlier v1/v2 changes addressed responsive sizing and the negative-margin clipping, but Josh reported the logo still looked clipped on all four sides. Diagnosis: he uses the Dark Reader Chrome extension, which inverts the page background to dark but leaves images alone. Our ELCA logo PNG has a baked-in white background and the actual logo content extends to all four edges of the 1500x197 source image — so once the page goes dark, the visible white rectangle behind the logo ends exactly at the letters, making it look like the letters are clipped. The right long-term fix is sourcing a logo with proper internal margins (or an SVG). Short-term, we can solve the same problem in CSS by adding visible white padding *inside* the img element: - background: '#ffffff' on the img — the padding area shows white - padding: '20px 28px' — gives the logo letters breathing room - boxSizing: 'border-box' — so the padding fits within maxWidth: '700px' instead of expanding the rendered box In normal (light) mode, the white padding blends with the white page background — visually no change from v2. In Dark Reader mode, the white padded box stands out but the logo letters have breathing room from the edge of the visible white area. Also simplified back to v1 structure for the wrapper (no inline-block on the anchor, no horizontal padding on the wrapper div) since the white-box fix means we no longer need those layout workarounds. All 9 ELCALogo-consumer snapshots regenerated. Lint + typecheck clean.
v3 added a white background + padding to the img to give breathing room. But Dark Reader (Chrome extension Josh uses) inverts CSS-declared backgrounds, so the white padding area turned dark in Dark Reader mode and the fix didn't help. The root issue is the source PNG has a baked-in white background and the logo content extends to all four edges. Dark Reader can't invert images themselves (by default), so the white background stays white — but the letters touching the edges of the white rectangle look "clipped" against the dark page. This commit: - Generates a new ELCA logo PNG with the white pixels converted to transparent (alpha=0), preserving antialiased edges with a partial- transparency band. Source: same 1500x197 PNG processed via PIL with brightness threshold 240 (fully transparent) and soft threshold 200 (partial alpha for smooth edges). - Commits the transparent PNG to public/elca-logo.png so it's served locally by Vite at /elca-logo.png — no more dependency on the Dropbox URL that returned content-type: application/json with sandbox CSP. - Updates src/components/elcaLogo.tsx to use the local /elca-logo.png and removes the white-background + padding hack (no longer needed — transparent bg works in both light and dark modes). - Updates src/containers/Youth/YouthContent.tsx (inline copy of the logo) to use the same local PNG and matches the responsive sizing. Result: in normal (light) mode the logo looks the same as before (transparent pixels show the white page through). In Dark Reader mode the transparent pixels show the dark page through — no visible white rectangle, no "clipping" perception. 11 snapshot files regenerated. Lint + typecheck clean.
…tches fix(cl): remove News page height artifact + scale ELCA footer logo
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
No description provided.