Repository navigation
fix(ui): soften the sign-in screens on Web and Android - #58
Open
Eleanor1018 wants to merge 2 commits into
Open
Eleanor1018 wants to merge 2 commits into
Eleanor1018 wants to merge 2 commits into
Conversation
The desktop dialog drops its 3px plum frame for elevation and dims the map behind it, so notices no longer show through or overlap. The submit becomes the single filled plum control at full width; Send code is now outlined. Fields are white with a 3:1 outline and a plum focus ring that replaces the 1.6:1 blush one. The heading uses a CJK-capable font, labels shrink from 20px to 15px, and the 12px switch links grow to 14px with 44px targets. The mobile sheet is opaque. The Apple and Google buttons and their divider are removed until those providers exist; they only reported "not available yet". The admin sign-in gate shares the form and follows the same styles. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
The theme's primary colour was Material's default purple, and outlines used its default dark grey, so sign-in fields read as black boxes. The primary is now the brand plum already defined as LycorisColors.Plum, and outlines use a softer tone that keeps 3:1 contrast on panel surfaces. This changes buttons, links, focused fields and selection app-wide. Account pages now open at full height, so the sign-in button is no longer below the fold of the half-height panel. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Deploying lycoris-map with
|
| Latest commit: |
521a7c7
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://74567cb0.lycoris-map.pages.dev |
| Branch Preview URL: | https://fix-login-visual-refresh.lycoris-map.pages.dev |
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
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.
Soften the sign-in screens on Web and Android, which read as a heavy black frame.
Web. The desktop dialog replaces its 3px plum border with elevation and dims the map behind it, so the map notices no longer show through or overlap it. The submit button becomes the only filled control: full width, plum with white text (9.9:1). Send code is outlined. Fields are white with a
#8E7A93outline (3:1 on the field and the dialog) and a 2px plum focus ring, replacing the blush ring at 1.6:1. The heading uses the CJK-capable heading font instead of Fredoka; labels go from 20px to 15px; the 12px Register / Forgot password links become 14px, underlined, with 44px targets. The mobile sheet is now opaque. A forced-colors border keeps the dialog edge in high-contrast mode.The Apple and Google buttons, their
--OR--divider and strings are removed until those providers exist; they only reported that sign-in was unavailable. The SVGs stay in the repo. The admin sign-in gate uses the same form and styles.Android. The theme primary changes from Material's default purple to the brand plum (
LycorisColors.Plum), andoutlineuses the same softer tone, so fields no longer render dark grey boxes. This is app-wide: buttons, links, focused fields, switches and progress indicators become plum. Account pages now open at full height so the sign-in button is not below the half-height panel's fold.No backend or iOS change, and no behavior change beyond removing the two placeholder buttons.
Validation: Web typecheck, Prettier and 543 unit tests; screenshots of desktop sign-in, registration, keyboard focus and mobile captured with headless Chrome against a local signed-out fixture. Android 161 QA unit tests,
lintQa(no errors), QA app and instrumentation builds. The Android emulator images were missing locally, so instrumentation and visual checks rely on this PR's Android workflow and a device review — particularly how plum reads on non-account screens.🤖 Generated with Claude Code