fix(mobile): Korean word-break, label tracking, careers responsive#10
Open
Xixn2 wants to merge 3 commits into
Open
fix(mobile): Korean word-break, label tracking, careers responsive#10Xixn2 wants to merge 3 commits into
Xixn2 wants to merge 3 commits into
Conversation
- CustomCursor: lazy-load via dynamic import (ssr: false) through ClientCursor wrapper — removes heavy animation component from initial bundle - Header: backdropFilter always applied (no toggle) — eliminates style recalc on scroll; memoize NavLink with memo() - Hero: reduce particles 65 → 40; add willChange: 'transform, opacity' to orbs - GameCard: add willChange: 'transform' to 3D tilt container - AnimateIn: instant exit (duration: 0) when element leaves viewport — no reverse animation on scroll-up - RevealText: same instant-exit pattern
- html[lang='ko']: word-break: keep-all + overflow-wrap: break-word prevents syllable-level line breaks across all Korean headings/body text - Reduce letter-spacing on .eyebrow (0.1em) and .uppercase (0.08em) in Korean context — 0.18-0.22em tracking is designed for Latin caps, causes excessive character spacing on Korean syllables - Careers IdealTraitsSection: add overflow-hidden to trait container so animating items don't bleed outside the 288px bounds - Careers decorative number: 96px → 72px on mobile, preserving sm/lg sizes, so content centers better in the sticky viewport on small screens
Careers IdealTraitsSection: - Redesign TraitItem/DotIndicator with useMotionValueEvent + useMotionValue so scroll direction controls animation behavior - Scroll DOWN: smooth opacity + y-slide (function-based useTransform avoids keyframe array WAAPI conflicts that caused visible trait overlap) - Scroll UP: instant snap to active state, no reverse animation at all Header nav: - Active link: text-[15px] font-medium vs inactive text-sm — size+weight change makes focused page clearly distinct from muted items - Replace IntersectionObserver with rAF scroll listener that picks the section closest to viewport center — eliminates flicker when two sections share the intersection threshold simultaneously
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.
Closes #9
Changes
html[lang='ko']getsword-break: keep-all— Korean syllables no longer split at line wraps across all headings and body text.eyebrowand.uppercasein Korean context get reduced letter-spacing (0.1em / 0.08em vs. the Latin-designed 0.2em)IdealTraitsSectiontrait container getsoverflow-hiddento prevent animation bleedtext-[72px]mobile →sm:text-[96px]→lg:text-[130px]Tested
All pages audited at 375×812 mobile viewport (KO and EN locales).