acetheking987/bsky-social-app
1
0
Fork 0
Code Issues Actions Packages Projects Releases 1 Wiki Activity

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

Browse Source 
* 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
Download Patch File Download Diff File Expand all files Collapse all files
src/components/moderation/ContentHider.tsx
+4 -4
View File
@@ -178,9 +178,9 @@ function ContentHiderActive({
style={[
a.flex_1,
a.text_left,
a.font_bold,
a.font_semi_bold,
a.leading_snug,
gtMobile && [a.font_bold],
gtMobile && [a.font_semi_bold],
t.atoms.text_contrast_medium,
web({
marginBottom: 1,
@@ -192,9 +192,9 @@ function ContentHiderActive({
{!modui.noOverride && (
<Text
style={[
a.font_bold,
a.font_semi_bold,
a.leading_snug,
gtMobile && [a.font_bold],
gtMobile && [a.font_semi_bold],
t.atoms.text_contrast_high,
web({
marginBottom: 1,
src/components/moderation/LabelPreference.tsx
+8 -3
View File
@@ -48,7 +48,7 @@ export function Content({
return (
<View style={[a.gap_xs, a.flex_1]}>
<Text emoji style={[a.font_bold, gtPhone ? a.text_sm : a.text_md]}>
<Text emoji style={[a.font_semi_bold, gtPhone ? a.text_sm : a.text_md]}>
{name}
</Text>
<Text emoji style={[t.atoms.text_contrast_medium, a.leading_snug]}>
@@ -241,7 +241,12 @@ export function LabelerLabelPreference({
<View style={[a.flex_row, a.gap_xs, a.align_center, a.mt_xs]}>
<CircleInfo size="sm" fill={t.atoms.text_contrast_high.color} />
<Text style={[t.atoms.text_contrast_medium, a.font_bold, a.italic]}>
<Text
style={[
t.atoms.text_contrast_medium,
a.font_semi_bold,
a.italic,
]}>
{adultDisabled ? (
<Trans>Adult content is disabled.</Trans>
) : isGlobalLabel ? (
@@ -274,7 +279,7 @@ export function LabelerLabelPreference({
t.atoms.border_contrast_low,
a.self_start,
]}>
<Text emoji style={[a.font_bold, t.atoms.text_contrast_low]}>
<Text emoji style={[a.font_semi_bold, t.atoms.text_contrast_low]}>
{currentPrefLabel}
</Text>
</View>
src/components/moderation/LabelsOnMeDialog.tsx
+3 -3
View File
@@ -67,7 +67,7 @@ function LabelsOnMeDialogInner(props: LabelsOnMeDialogProps) {
/>
) : (
<>
<Text style={[a.text_2xl, a.font_heavy, a.pb_xs, a.leading_tight]}>
<Text style={[a.text_2xl, a.font_bold, a.pb_xs, a.leading_tight]}>
{isAccount ? (
<Trans>Labels on your account</Trans>
) : (
@@ -134,7 +134,7 @@ function Label({
]}>
<View style={[a.p_md, a.gap_sm, a.flex_row]}>
<View style={[a.flex_1, a.gap_xs]}>
<Text emoji style={[a.font_bold, a.text_md]}>
<Text emoji style={[a.font_semi_bold, a.text_md]}>
{strings.name}
</Text>
<Text emoji style={[t.atoms.text_contrast_medium, a.leading_snug]}>
@@ -264,7 +264,7 @@ function AppealForm({
return (
<>
<View>
<Text style={[a.text_2xl, a.font_bold, a.pb_xs, a.leading_tight]}>
<Text style={[a.text_2xl, a.font_semi_bold, a.pb_xs, a.leading_tight]}>
<Trans>Appeal "{strings.name}" label</Trans>
</Text>
<Text style={[a.text_md, a.leading_snug]}>
src/components/moderation/ModerationDetailsDialog.tsx
+1 -1
View File
@@ -142,7 +142,7 @@ function ModerationDetailsDialogInner({
paddingBottom: 0,
}}>
<View style={[xGutters, a.pb_lg]}>
<Text emoji style={[t.atoms.text, a.text_2xl, a.font_heavy, a.mb_sm]}>
<Text emoji style={[t.atoms.text, a.text_2xl, a.font_bold, a.mb_sm]}>
{name}
</Text>
<Text style={[t.atoms.text, a.text_sm, a.leading_snug]}>
src/components/moderation/ReportDialog/index.tsx
+6 -6
View File
@@ -69,7 +69,7 @@ function Invalid() {
const {_} = useLingui()
return (
<Dialog.ScrollableInner label={_(msg`Report dialog`)}>
<Text style={[a.font_heavy, a.text_xl, a.leading_snug, a.pb_xs]}>
<Text style={[a.font_bold, a.text_xl, a.leading_snug, a.pb_xs]}>
<Trans>Invalid report subject</Trans>
</Text>
<Text style={[a.text_md, a.leading_snug]}>
@@ -393,7 +393,7 @@ function Inner(props: ReportDialogProps) {
<Text style={[a.leading_snug, a.pb_xs]}>
<Trans>
Your report will be sent to{' '}
<Text style={[a.font_bold, a.leading_snug]}>
<Text style={[a.font_semi_bold, a.leading_snug]}>
{state.selectedLabeler?.creator.displayName}
</Text>
.
@@ -529,7 +529,7 @@ function StepTitle({
) : (
<Text
style={[
a.font_heavy,
a.font_bold,
a.text_center,
t.atoms.text,
{
@@ -552,7 +552,7 @@ function StepTitle({
<Text
style={[
a.flex_1,
a.font_heavy,
a.font_bold,
a.text_lg,
a.leading_snug,
active ? t.atoms.text : t.atoms.text_contrast_medium,
@@ -598,7 +598,7 @@ function OptionCard({
? [t.atoms.border_contrast_high]
: [t.atoms.border_contrast_low],
]}>
<Text style={[a.text_md, a.font_bold, a.leading_snug]}>
<Text style={[a.text_md, a.font_semi_bold, a.leading_snug]}>
{option.title}
</Text>
<Text
@@ -670,7 +670,7 @@ function LabelerCard({
avatar={labeler.creator.avatar}
/>
<View style={[a.flex_1]}>
<Text style={[a.text_md, a.font_bold, a.leading_snug]}>
<Text style={[a.text_md, a.font_semi_bold, a.leading_snug]}>
{title}
</Text>
<Text
src/components/moderation/ScreenHider.tsx
+8 -2
View File
@@ -86,7 +86,13 @@ export function ScreenHider({
</View>
</View>
<Text
style={[a.text_4xl, a.font_bold, a.text_center, a.mb_md, t.atoms.text]}>
style={[
a.text_4xl,
a.font_semi_bold,
a.text_center,
a.mb_md,
t.atoms.text,
]}>
{isNoPwi ? (
<Trans>Sign-in Required</Trans>
) : (
@@ -112,7 +118,7 @@ export function ScreenHider({
<Text
style={[
a.text_lg,
a.font_bold,
a.font_semi_bold,
a.leading_snug,
t.atoms.text,
a.ml_xs,