Migrate to @bsky.app/alf package (#9030)

* Add storybook shortcut in dev

* Migrate to alg pkg

* Migrate font_bold to new font_semi_bold

* Migrate font_heavy to font_bold

* Fix old theme refs

* Remove leading util

* Bump

* Revert "Add storybook shortcut in dev"

This reverts commit 7a86195c77fb5d449c7782e64ebabb6addfab919.

* Remove alf script

* Adjust font scale

* Bump

* Bump pkg

* Migrate values from conflicts

* Create default themes outside react

* Use built-in alf utils

* Migrate old font styles

* Remove unused tokens

* Move theme creation to more appropriate file

* Update button colors

* Adjust TextField colors, line heights
This commit is contained in:
Eric Bailey
2025-09-24 11:47:08 -05:00
committed by GitHub
parent bdc58045cf
commit bd17f04810
219 changed files with 645 additions and 2413 deletions
@@ -153,7 +153,7 @@ export function Disable() {
return (
<View style={[a.gap_sm]}>
<Text style={[a.text_xl, a.font_heavy, a.leading_snug]}>
<Text style={[a.text_xl, a.font_bold, a.leading_snug]}>
<Trans>Disable email 2FA</Trans>
</Text>
@@ -163,7 +163,7 @@ export function Disable() {
style={[a.text_sm, a.leading_snug, t.atoms.text_contrast_medium]}>
<Trans>
To disable your email 2FA method, please verify your access to{' '}
<Span style={[a.font_bold]}>{currentAccount?.email}</Span>
<Span style={[a.font_semi_bold]}>{currentAccount?.email}</Span>
</Trans>
</Text>
@@ -214,7 +214,7 @@ export function Disable() {
style={[a.text_sm, a.leading_snug, t.atoms.text_contrast_medium]}>
<Trans>
To disable your email 2FA method, please verify your access to{' '}
<Span style={[a.font_bold]}>{currentAccount?.email}</Span>
<Span style={[a.font_semi_bold]}>{currentAccount?.email}</Span>
</Trans>
</Text>
@@ -88,7 +88,7 @@ export function Enable() {
return (
<View style={[a.gap_lg]}>
<View style={[a.gap_sm]}>
<Text style={[a.text_xl, a.font_heavy, a.leading_snug]}>
<Text style={[a.text_xl, a.font_bold, a.leading_snug]}>
<Trans>Enable email 2FA</Trans>
</Text>
@@ -199,7 +199,7 @@ export function Update(_props: ScreenProps<ScreenID.Update>) {
return (
<View style={[a.gap_lg]}>
<Text style={[a.text_xl, a.font_heavy]}>
<Text style={[a.text_xl, a.font_bold]}>
<Trans>Update your email</Trans>
</Text>
@@ -239,7 +239,7 @@ export function Update(_props: ScreenProps<ScreenID.Update>) {
<>
<Divider />
<View>
<Text style={[a.text_md, a.pb_sm, a.font_bold]}>
<Text style={[a.text_md, a.pb_sm, a.font_semi_bold]}>
<Trans>Security step required</Trans>
</Text>
<Text
@@ -282,7 +282,7 @@ export function Update(_props: ScreenProps<ScreenID.Update>) {
<View style={[a.gap_sm]}>
<View style={[a.flex_row, a.gap_sm, a.align_center]}>
<Check fill={t.palette.positive_600} size="xs" />
<Text style={[a.text_md, a.font_heavy]}>
<Text style={[a.text_md, a.font_bold]}>
<Trans>Success!</Trans>
</Text>
</View>
@@ -58,7 +58,7 @@ export function VerificationReminder({
<View style={[a.mb_xs, {height: 150 - dialogPadding}]} />
<View style={[a.gap_sm]}>
<Text style={[a.text_xl, a.font_heavy]}>
<Text style={[a.text_xl, a.font_bold]}>
<Trans>Please verify your email</Trans>
</Text>
<Text style={[a.text_sm, a.leading_snug, t.atoms.text_contrast_medium]}>
@@ -174,7 +174,7 @@ export function Verify({config, showScreen}: ScreenProps<ScreenID.Verify>) {
return (
<View style={[a.gap_lg]}>
<View style={[a.gap_sm]}>
<Text style={[a.text_xl, a.font_heavy]}>
<Text style={[a.text_xl, a.font_bold]}>
<Span style={{top: 1}}>
<Check size="sm" fill={t.palette.positive_600} />
</Span>
@@ -197,7 +197,7 @@ export function Verify({config, showScreen}: ScreenProps<ScreenID.Verify>) {
return (
<View style={[a.gap_lg]}>
<View style={[a.gap_sm]}>
<Text style={[a.text_xl, a.font_heavy]}>
<Text style={[a.text_xl, a.font_bold]}>
{state.step === 'email' ? (
state.mutationStatus === 'success' ? (
<>
@@ -239,7 +239,7 @@ export function Verify({config, showScreen}: ScreenProps<ScreenID.Verify>) {
state.mutationStatus === 'success' ? (
<Trans>
We sent an email to{' '}
<Span style={[a.font_bold, t.atoms.text]}>
<Span style={[a.font_semi_bold, t.atoms.text]}>
{currentAccount!.email}
</Span>{' '}
containing a link. Please click on it to complete the email
@@ -248,7 +248,7 @@ export function Verify({config, showScreen}: ScreenProps<ScreenID.Verify>) {
) : (
<Trans>
We'll send an email to{' '}
<Span style={[a.font_bold, t.atoms.text]}>
<Span style={[a.font_semi_bold, t.atoms.text]}>
{currentAccount!.email}
</Span>{' '}
containing a link. Please click on it to complete the email
@@ -258,7 +258,7 @@ export function Verify({config, showScreen}: ScreenProps<ScreenID.Verify>) {
) : (
<Trans>
Please enter the code we sent to{' '}
<Span style={[a.font_bold, t.atoms.text]}>
<Span style={[a.font_semi_bold, t.atoms.text]}>
{currentAccount!.email}
</Span>{' '}
below.