fix(brand): call the app WordyMe everywhere it names itself - #101
Merged
Conversation
📝 WalkthroughWalkthroughThe PR renames application metadata from Wordy to WordyMe across web, PWA, and API documentation surfaces. It also adds an ChangesBranding and responsive header
Estimated code review effort: 2 (Simple) | ~10 minutes Possibly related PRs
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Comment |
The app called itself "Wordy" while the project, the published images, the
documentation and the trademark are all WordyMe. apps/backend/src/app.ts
disagreed with itself inside four lines — "WordyMe API" on 82, "Wordy API
Documentation" on 85.
Five strings: the browser title, the header wordmark and its alt text, the
PWA name and short_name, and the API docs page title.
The header carries the longer name at a fixed position. That block starts
at the viewport edge, so its padding and width place the logo, wordmark,
toggle and divider absolutely — anything breakpoint-dependent slides them
sideways as a window resizes, which is what the old px-4 with an sm: step
did. They now hold still from xs (400px) up.
Below that they cannot: the fixed block is 256px and the right-hand
controls need 143px, so 399px is the floor. Under it the parent is
overflow-hidden and the avatar is what gets clipped — the only route to
Settings and Log out. So a new xs breakpoint at 25rem drops the wordmark
and lets the block shrink to its contents, taking the row from 256px to
97px and leaving 135px spare at 375px. The mark alone still identifies the
app, and no control is ever cut off.
Tailwind's smallest default is sm at 40rem, which puts every phone in one
bucket; 25rem splits it where the layout actually breaks.
Deliberately untouched: persist({ name: 'Wordy' }) in the web store is the
localStorage key, not a label. Renaming it orphans every existing user's
saved tabs and UI preferences, because zustand would not find the old data
— `version` migrates a key's contents, not the key itself. The internal
WordySlice and createWordySlice identifiers are left alone for the same
reason: renaming them would bury five meaningful edits in cosmetic noise.
The logo is a symbol with no lettering, so no artwork changed.
Verified: format, type-check 9/9, lint 9/9, build 2/2, licence clean. The
breakpoint compiles to `@media (width>=25rem)` ahead of sm's 40rem, and the
row needs 240px below it against 399px above.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
AdminTeamCoderz
force-pushed
the
fix/app-name-wordyme
branch
from
August 10, 2026 11:09
ecdec41 to
1996ba7
Compare
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.
Summary
Updates the app name from "Wordy" to "WordyMe" everywhere the product names itself — browser tab, header wordmark, PWA manifest, and backend page title — and reworks the header's small-screen behavior so the logo and wordmark stay pinned to the left edge at every width, with the wordmark dropping out below a new
xs(25rem) breakpoint instead of ever clipping the avatar. App internally reflets the repo name.Related Issues
None — branding follow-up for the WordyMe naming update
Fixes # — n/a
Type of Change
Branding fix + responsive UI adjustment.
Changes
apps/web/index.html— browser tab title is now WordyMe.apps/web/vite.config.ts— PWA manifestnameandshort_nameare now WordyMe (what users see when installing the app).apps/backend/src/app.ts— backend-rendered page title is now WordyMe.apps/web/src/components/Layout/app-header.tsx— wordmark text and logo alt-text read WordyMe; the logo/wordmark block is pinned to the viewport's left edge (pl-2) at all widths; logo-to-wordmark spacing set togap-1.5; below the newxsbreakpoint the wordmark hides (hidden xs:block) and the block shrinks (w-auto xs:w-(--sidebar-width)) so the header never clips.packages/ui/src/styles/globals.css— adds the customxsbreakpoint at 25rem to the Tailwind theme.persist({ name: 'Wordy' })localStorage key — renaming it would silently reset existing users' UI state for zero user-visible benefit.How to Test
pnpm dev, open the web app — the browser tab reads WordyMe, and the header shows the logo + WordyMe wordmark at the left edge.Expected result: the product says "WordyMe" in every self-naming surface; the header logo position is stable at every viewport width; no clipping at any width; existing users keep their persisted UI state.
Screenshots
Visual change verified locally at multiple viewport widths; screenshots omitted.
Summary by CodeRabbit
Branding
User Interface