Repository navigation
chore(storybook): cookie banner and signup strip layout test - #6890
Open
tsahimatsliah wants to merge 10 commits into
Open
tsahimatsliah wants to merge 10 commits into
tsahimatsliah wants to merge 10 commits into
Conversation
The iubenda cookie card is fixed to the bottom-right corner and lands on the signup strip's auth column on every window under ~1,750px, hiding "Continue with GitHub", the email link and "Log in". Adds a Storybook review of three strip layouts for an A/B test, each built from the real production components (OnboardingHeadline children, AuthOptions with inlineProviders) and compared against the real GeoPersonalizedBanner / AuthenticationBanner at eight laptop and desktop sizes plus tablet and phone. Copy and the laptop-only gate are unchanged; the strip keeps production's 284px height. README.md holds the plan for shipping it behind a flag. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
…ations-60a678' into claude/cookie-banner-layout-variations-60a678
…ight Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
- Reserve the cookie card's lane and cap the column in px, matching the px-sized card at any root font size. - Give the docked card an opaque fill once Show more grows it past the strip. - Keep negative widths out of the review frames and clear their polling interval on unmount. - One height publisher, owned by banner.tsx. - Respect reduced motion on the lane reflow. - README: derive dd-consent-open from the card's visibility (Customize hides it unanswered), and scope every rule that reads it to the strip. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
3 of 5 tasks
This branch was successfully deployed
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.
Why
On logged-out public pages the iubenda cookie card (fixed bottom-right, 340px) covers the signup strip's "Continue with GitHub", email link and "Log in" on every window under ~1,750px, which is every laptop.
What
Storybook only. Three strip layouts for an A/B test against production, each with production copy, the production
AuthOptions, and production's 284px height:The before is the real
GeoPersonalizedBanner/AuthenticationBanner; the cookie card uses the productioniubenda.css. Measured at 1024–2560 wide: every strip is 284px, and production has up to 3 sign-in controls under the card while the variants have none. Tablet and phone are unchanged: the strip stays laptop-only.stories/cookie-strip/README.mdis the plan for shipping this behind a flag.Review
Storybook → Cookie banner & Signup strip: 0. Read me · 1. Compare · 2. Before and after · 3. Implementation.
🤖 Generated with Claude Code
Preview domain
https://claude-cookie-banner-layout-vari.preview.app.daily.dev