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:
@@ -121,7 +121,7 @@ export function Deactivated() {
|
||||
</View>
|
||||
|
||||
<View style={[a.gap_xs, a.pb_3xl]}>
|
||||
<Text style={[a.text_xl, a.font_bold, a.leading_snug]}>
|
||||
<Text style={[a.text_xl, a.font_semi_bold, a.leading_snug]}>
|
||||
<Trans>Welcome back!</Trans>
|
||||
</Text>
|
||||
<Text style={[a.text_sm, a.leading_snug]}>
|
||||
|
||||
@@ -75,7 +75,7 @@ export function NoFeedsPinned({
|
||||
},
|
||||
]}>
|
||||
<View style={[a.align_center, a.gap_sm, a.pb_xl]}>
|
||||
<Text style={[a.text_xl, a.font_bold]}>
|
||||
<Text style={[a.text_xl, a.font_semi_bold]}>
|
||||
<Trans>Whoops!</Trans>
|
||||
</Text>
|
||||
<Text
|
||||
|
||||
@@ -122,7 +122,7 @@ export function ListHiddenScreen({
|
||||
width={42}
|
||||
/>
|
||||
<View style={[a.gap_sm, a.align_center]}>
|
||||
<Text style={[a.font_bold, a.text_3xl]}>
|
||||
<Text style={[a.font_semi_bold, a.text_3xl]}>
|
||||
{list.creator.viewer?.blocking || list.creator.viewer?.blockedBy ? (
|
||||
<Trans>Creator has been blocked</Trans>
|
||||
) : (
|
||||
@@ -150,7 +150,7 @@ export function ListHiddenScreen({
|
||||
) : (
|
||||
<Trans>
|
||||
This list – created by{' '}
|
||||
<Text style={[a.font_bold]}>
|
||||
<Text style={[a.font_semi_bold]}>
|
||||
{sanitizeHandle(list.creator.handle, '@')}
|
||||
</Text>{' '}
|
||||
– contains possible violations of Bluesky's community guidelines
|
||||
|
||||
@@ -22,7 +22,7 @@ export function FormContainer({
|
||||
testID={testID}
|
||||
style={[a.gap_md, a.flex_1, !gtMobile && [a.px_lg, a.py_md], style]}>
|
||||
{titleText && !gtMobile && (
|
||||
<Text style={[a.text_xl, a.font_bold, t.atoms.text_contrast_high]}>
|
||||
<Text style={[a.text_xl, a.font_semi_bold, t.atoms.text_contrast_high]}>
|
||||
{titleText}
|
||||
</Text>
|
||||
)}
|
||||
|
||||
@@ -19,7 +19,7 @@ export const PasswordUpdatedForm = ({
|
||||
<FormContainer
|
||||
testID="passwordUpdatedForm"
|
||||
style={[a.gap_2xl, !gtMobile && a.mt_5xl]}>
|
||||
<Text style={[a.text_3xl, a.font_bold, a.text_center]}>
|
||||
<Text style={[a.text_3xl, a.font_semi_bold, a.text_center]}>
|
||||
<Trans>Password updated!</Trans>
|
||||
</Text>
|
||||
<Text style={[a.text_center, a.mx_auto, {maxWidth: '80%'}]}>
|
||||
|
||||
@@ -265,7 +265,8 @@ export function MessagesScreenInner({navigation, route}: Props) {
|
||||
width={48}
|
||||
fill={t.atoms.text_contrast_low.color}
|
||||
/>
|
||||
<Text style={[a.pt_md, a.pb_sm, a.text_2xl, a.font_bold]}>
|
||||
<Text
|
||||
style={[a.pt_md, a.pb_sm, a.text_2xl, a.font_semi_bold]}>
|
||||
<Trans>Whoops!</Trans>
|
||||
</Text>
|
||||
<Text
|
||||
@@ -298,7 +299,8 @@ export function MessagesScreenInner({navigation, route}: Props) {
|
||||
<>
|
||||
<View style={[a.pt_3xl, a.align_center]}>
|
||||
<MessageIcon width={48} fill={t.palette.primary_500} />
|
||||
<Text style={[a.pt_md, a.pb_sm, a.text_2xl, a.font_bold]}>
|
||||
<Text
|
||||
style={[a.pt_md, a.pb_sm, a.text_2xl, a.font_semi_bold]}>
|
||||
<Trans>Nothing here</Trans>
|
||||
</Text>
|
||||
<Text
|
||||
|
||||
@@ -193,7 +193,8 @@ function RequestList({
|
||||
width={48}
|
||||
fill={t.atoms.text_contrast_low.color}
|
||||
/>
|
||||
<Text style={[a.pt_md, a.pb_sm, a.text_2xl, a.font_bold]}>
|
||||
<Text
|
||||
style={[a.pt_md, a.pb_sm, a.text_2xl, a.font_semi_bold]}>
|
||||
<Trans>Whoops!</Trans>
|
||||
</Text>
|
||||
<Text
|
||||
@@ -225,7 +226,8 @@ function RequestList({
|
||||
<>
|
||||
<View style={[a.pt_3xl, a.align_center]}>
|
||||
<MessageIcon width={48} fill={t.palette.primary_500} />
|
||||
<Text style={[a.pt_md, a.pb_sm, a.text_2xl, a.font_bold]}>
|
||||
<Text
|
||||
style={[a.pt_md, a.pb_sm, a.text_2xl, a.font_semi_bold]}>
|
||||
<Trans comment="Title message shown in chat requests inbox when it's empty">
|
||||
Inbox zero!
|
||||
</Trans>
|
||||
|
||||
@@ -71,7 +71,7 @@ export function MessagesSettingsScreenInner({}: Props) {
|
||||
</Layout.Header.Outer>
|
||||
<Layout.Content>
|
||||
<View style={[a.p_lg, a.gap_md]}>
|
||||
<Text style={[a.text_lg, a.font_bold]}>
|
||||
<Text style={[a.text_lg, a.font_semi_bold]}>
|
||||
<Trans>Allow new messages from</Trans>
|
||||
</Text>
|
||||
<Toggle.Group
|
||||
@@ -121,7 +121,7 @@ export function MessagesSettingsScreenInner({}: Props) {
|
||||
{isNative && (
|
||||
<>
|
||||
<Divider style={a.my_md} />
|
||||
<Text style={[a.text_lg, a.font_bold]}>
|
||||
<Text style={[a.text_lg, a.font_semi_bold]}>
|
||||
<Trans>Notification Sounds</Trans>
|
||||
</Text>
|
||||
<Toggle.Group
|
||||
|
||||
@@ -22,7 +22,12 @@ export function ChatDisabled() {
|
||||
<View
|
||||
style={[a.align_start, a.p_xl, a.rounded_md, t.atoms.bg_contrast_25]}>
|
||||
<Text
|
||||
style={[a.text_md, a.font_bold, a.pb_sm, t.atoms.text_contrast_high]}>
|
||||
style={[
|
||||
a.text_md,
|
||||
a.font_semi_bold,
|
||||
a.pb_sm,
|
||||
t.atoms.text_contrast_high,
|
||||
]}>
|
||||
<Trans>Your chats have been disabled</Trans>
|
||||
</Text>
|
||||
<Text style={[a.text_sm, a.leading_snug, t.atoms.text_contrast_medium]}>
|
||||
@@ -104,7 +109,7 @@ function DialogInner() {
|
||||
|
||||
return (
|
||||
<Dialog.ScrollableInner label={_(msg`Appeal this decision`)}>
|
||||
<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 this decision</Trans>
|
||||
</Text>
|
||||
<Text style={[a.text_md, a.leading_snug]}>
|
||||
|
||||
@@ -397,7 +397,7 @@ function ChatListItemReady({
|
||||
style={[
|
||||
a.text_md,
|
||||
t.atoms.text,
|
||||
a.font_bold,
|
||||
a.font_semi_bold,
|
||||
{lineHeight: 21},
|
||||
isDimStyle && t.atoms.text_contrast_medium,
|
||||
]}>
|
||||
@@ -461,7 +461,7 @@ function ChatListItemReady({
|
||||
style={[
|
||||
a.text_sm,
|
||||
a.leading_snug,
|
||||
hasUnread ? a.font_bold : t.atoms.text_contrast_high,
|
||||
hasUnread ? a.font_semi_bold : t.atoms.text_contrast_high,
|
||||
isDimStyle && t.atoms.text_contrast_medium,
|
||||
]}>
|
||||
{lastMessage}
|
||||
|
||||
@@ -57,7 +57,7 @@ export function InboxPreview({
|
||||
)}
|
||||
</View>
|
||||
<ButtonText
|
||||
style={[a.flex_1, a.font_bold, a.text_left]}
|
||||
style={[a.flex_1, a.font_semi_bold, a.text_left]}
|
||||
numberOfLines={1}>
|
||||
<Trans>Chat requests</Trans>
|
||||
</ButtonText>
|
||||
|
||||
@@ -38,7 +38,7 @@ export function RequestListItem({convo}: {convo: ChatBskyConvoDefs.ConvoView}) {
|
||||
{/* spacer, since you can't nest pressables */}
|
||||
<View style={[a.pt_md, a.pb_xs, a.w_full, {opacity: 0}]} aria-hidden>
|
||||
{/* Placeholder text so that it responds to the font height */}
|
||||
<Text style={[a.text_xs, a.leading_tight, a.font_bold]}>
|
||||
<Text style={[a.text_xs, a.leading_tight, a.font_semi_bold]}>
|
||||
<Trans comment="Accept a chat request">Accept Request</Trans>
|
||||
</Text>
|
||||
</View>
|
||||
|
||||
@@ -142,7 +142,7 @@ function SubItem({
|
||||
]}>
|
||||
<View style={[a.flex_row, a.align_center, a.gap_md]}>
|
||||
<Icon size="md" style={[t.atoms.text_contrast_medium]} />
|
||||
<Text style={[a.text_sm, a.font_bold]}>{title}</Text>
|
||||
<Text style={[a.text_sm, a.font_semi_bold]}>{title}</Text>
|
||||
</View>
|
||||
<ChevronRight
|
||||
size="sm"
|
||||
@@ -221,7 +221,12 @@ export function ModerationScreenInner({
|
||||
)}
|
||||
|
||||
<Text
|
||||
style={[a.text_md, a.font_bold, a.pb_md, t.atoms.text_contrast_high]}>
|
||||
style={[
|
||||
a.text_md,
|
||||
a.font_semi_bold,
|
||||
a.pb_md,
|
||||
t.atoms.text_contrast_high,
|
||||
]}>
|
||||
<Trans>Moderation tools</Trans>
|
||||
</Text>
|
||||
|
||||
@@ -330,7 +335,7 @@ export function ModerationScreenInner({
|
||||
a.pt_2xl,
|
||||
a.pb_md,
|
||||
a.text_md,
|
||||
a.font_bold,
|
||||
a.font_semi_bold,
|
||||
t.atoms.text_contrast_high,
|
||||
]}>
|
||||
<Trans>Content filters</Trans>
|
||||
@@ -364,7 +369,7 @@ export function ModerationScreenInner({
|
||||
a.pt_2xl,
|
||||
a.pb_md,
|
||||
a.text_md,
|
||||
a.font_bold,
|
||||
a.font_semi_bold,
|
||||
t.atoms.text_contrast_high,
|
||||
]}>
|
||||
<Trans>Content filters</Trans>
|
||||
@@ -396,7 +401,8 @@ export function ModerationScreenInner({
|
||||
a.justify_between,
|
||||
disabledOnIOS && {opacity: 0.5},
|
||||
]}>
|
||||
<Text style={[a.font_bold, t.atoms.text_contrast_high]}>
|
||||
<Text
|
||||
style={[a.font_semi_bold, t.atoms.text_contrast_high]}>
|
||||
<Trans>Enable adult content</Trans>
|
||||
</Text>
|
||||
<Toggle.Item
|
||||
@@ -465,7 +471,7 @@ export function ModerationScreenInner({
|
||||
<Text
|
||||
style={[
|
||||
a.text_md,
|
||||
a.font_bold,
|
||||
a.font_semi_bold,
|
||||
a.pt_2xl,
|
||||
a.pb_md,
|
||||
t.atoms.text_contrast_high,
|
||||
|
||||
@@ -17,7 +17,6 @@ import {
|
||||
useTheme,
|
||||
web,
|
||||
} from '#/alf'
|
||||
import {leading} from '#/alf/typography'
|
||||
import {Button, ButtonIcon, ButtonText} from '#/components/Button'
|
||||
import {ArrowLeft_Stroke2_Corner0_Rounded as ArrowLeft} from '#/components/icons/Arrow'
|
||||
import {HEADER_SLOT_SIZE} from '#/components/Layout'
|
||||
@@ -234,10 +233,8 @@ export function TitleText({
|
||||
style={[
|
||||
a.pb_sm,
|
||||
a.text_4xl,
|
||||
a.font_bold,
|
||||
{
|
||||
lineHeight: leading(a.text_4xl, a.leading_tight),
|
||||
},
|
||||
a.font_semi_bold,
|
||||
a.leading_tight,
|
||||
flatten(style),
|
||||
]}>
|
||||
{children}
|
||||
|
||||
@@ -432,7 +432,7 @@ function ValueProposition({
|
||||
</View>
|
||||
|
||||
<View style={[a.gap_sm]}>
|
||||
<Text style={[a.font_heavy, a.text_3xl, a.text_center]}>
|
||||
<Text style={[a.font_bold, a.text_3xl, a.text_center]}>
|
||||
{title}
|
||||
</Text>
|
||||
<Text
|
||||
@@ -537,7 +537,7 @@ function LegacyFinalStep({
|
||||
<View style={[a.flex_row, a.align_center, a.w_full, a.gap_lg]}>
|
||||
<IconCircle icon={Growth} size="lg" style={{width: 48, height: 48}} />
|
||||
<View style={[a.flex_1, a.gap_xs]}>
|
||||
<Text style={[a.font_bold, a.text_lg]}>
|
||||
<Text style={[a.font_semi_bold, a.text_lg]}>
|
||||
<Trans>Public</Trans>
|
||||
</Text>
|
||||
<Text
|
||||
@@ -551,7 +551,7 @@ function LegacyFinalStep({
|
||||
<View style={[a.flex_row, a.align_center, a.w_full, a.gap_lg]}>
|
||||
<IconCircle icon={News} size="lg" style={{width: 48, height: 48}} />
|
||||
<View style={[a.flex_1, a.gap_xs]}>
|
||||
<Text style={[a.font_bold, a.text_lg]}>
|
||||
<Text style={[a.font_semi_bold, a.text_lg]}>
|
||||
<Trans>Open</Trans>
|
||||
</Text>
|
||||
<Text
|
||||
@@ -567,7 +567,7 @@ function LegacyFinalStep({
|
||||
style={{width: 48, height: 48}}
|
||||
/>
|
||||
<View style={[a.flex_1, a.gap_xs]}>
|
||||
<Text style={[a.font_bold, a.text_lg]}>
|
||||
<Text style={[a.font_semi_bold, a.text_lg]}>
|
||||
<Trans>Flexible</Trans>
|
||||
</Text>
|
||||
<Text
|
||||
|
||||
@@ -69,7 +69,7 @@ export function InterestButton({interest}: {interest: string}) {
|
||||
{
|
||||
color: t.palette.contrast_900,
|
||||
},
|
||||
a.font_bold,
|
||||
a.font_semi_bold,
|
||||
native({paddingTop: 2}),
|
||||
ctx.selected ? styles.textSelected : {},
|
||||
]}>
|
||||
|
||||
@@ -184,7 +184,7 @@ export function StepInterests() {
|
||||
<Text
|
||||
style={[
|
||||
a.text_md,
|
||||
a.font_bold,
|
||||
a.font_semi_bold,
|
||||
{
|
||||
color: t.palette.negative_900,
|
||||
},
|
||||
|
||||
@@ -133,7 +133,7 @@ export function StepSuggestedAccounts() {
|
||||
|
||||
return (
|
||||
<View style={[a.align_start]} testID="onboardingInterests">
|
||||
<Text style={[a.font_heavy, a.text_3xl]}>
|
||||
<Text style={[a.font_bold, a.text_3xl]}>
|
||||
<Trans comment="Accounts suggested to the user for them to follow">
|
||||
Suggested for you
|
||||
</Trans>
|
||||
|
||||
@@ -58,7 +58,12 @@ export function ThreadError({
|
||||
]}>
|
||||
<View style={[a.gap_xs]}>
|
||||
<Text
|
||||
style={[a.text_center, a.text_lg, a.font_bold, a.leading_snug]}>
|
||||
style={[
|
||||
a.text_center,
|
||||
a.text_lg,
|
||||
a.font_semi_bold,
|
||||
a.leading_snug,
|
||||
]}>
|
||||
{title}
|
||||
</Text>
|
||||
<Text
|
||||
|
||||
@@ -129,7 +129,8 @@ function ThreadItemAnchorDeleted({isRoot}: {isRoot: boolean}) {
|
||||
]}>
|
||||
<TrashIcon style={[t.atoms.text_contrast_medium]} />
|
||||
</View>
|
||||
<Text style={[a.text_md, a.font_bold, t.atoms.text_contrast_medium]}>
|
||||
<Text
|
||||
style={[a.text_md, a.font_semi_bold, t.atoms.text_contrast_medium]}>
|
||||
<Trans>Post has been deleted</Trans>
|
||||
</Text>
|
||||
</View>
|
||||
@@ -343,7 +344,7 @@ const ThreadItemAnchorInner = memo(function ThreadItemAnchorInner({
|
||||
style={[
|
||||
a.flex_shrink,
|
||||
a.text_lg,
|
||||
a.font_bold,
|
||||
a.font_semi_bold,
|
||||
a.leading_snug,
|
||||
]}
|
||||
numberOfLines={1}>
|
||||
@@ -439,7 +440,7 @@ const ThreadItemAnchorInner = memo(function ThreadItemAnchorInner({
|
||||
<Text
|
||||
testID="repostCount-expanded"
|
||||
style={[a.text_md, t.atoms.text_contrast_medium]}>
|
||||
<Text style={[a.text_md, a.font_bold, t.atoms.text]}>
|
||||
<Text style={[a.text_md, a.font_semi_bold, t.atoms.text]}>
|
||||
{formatPostStatCount(post.repostCount)}
|
||||
</Text>{' '}
|
||||
<Plural
|
||||
@@ -457,7 +458,7 @@ const ThreadItemAnchorInner = memo(function ThreadItemAnchorInner({
|
||||
<Text
|
||||
testID="quoteCount-expanded"
|
||||
style={[a.text_md, t.atoms.text_contrast_medium]}>
|
||||
<Text style={[a.text_md, a.font_bold, t.atoms.text]}>
|
||||
<Text style={[a.text_md, a.font_semi_bold, t.atoms.text]}>
|
||||
{formatPostStatCount(post.quoteCount)}
|
||||
</Text>{' '}
|
||||
<Plural
|
||||
@@ -473,7 +474,7 @@ const ThreadItemAnchorInner = memo(function ThreadItemAnchorInner({
|
||||
<Text
|
||||
testID="likeCount-expanded"
|
||||
style={[a.text_md, t.atoms.text_contrast_medium]}>
|
||||
<Text style={[a.text_md, a.font_bold, t.atoms.text]}>
|
||||
<Text style={[a.text_md, a.font_semi_bold, t.atoms.text]}>
|
||||
{formatPostStatCount(post.likeCount)}
|
||||
</Text>{' '}
|
||||
<Plural value={post.likeCount} one="like" other="likes" />
|
||||
@@ -484,7 +485,7 @@ const ThreadItemAnchorInner = memo(function ThreadItemAnchorInner({
|
||||
<Text
|
||||
testID="bookmarkCount-expanded"
|
||||
style={[a.text_md, t.atoms.text_contrast_medium]}>
|
||||
<Text style={[a.text_md, a.font_bold, t.atoms.text]}>
|
||||
<Text style={[a.text_md, a.font_semi_bold, t.atoms.text]}>
|
||||
{formatPostStatCount(post.bookmarkCount)}
|
||||
</Text>{' '}
|
||||
<Plural value={post.bookmarkCount} one="save" other="saves" />
|
||||
@@ -652,7 +653,7 @@ function BackdatedPostIndicator({post}: {post: AppBskyFeedDefs.PostView}) {
|
||||
<Text
|
||||
style={[
|
||||
a.text_xs,
|
||||
a.font_bold,
|
||||
a.font_semi_bold,
|
||||
a.leading_tight,
|
||||
t.atoms.text_contrast_medium,
|
||||
]}>
|
||||
@@ -669,9 +670,14 @@ function BackdatedPostIndicator({post}: {post: AppBskyFeedDefs.PostView}) {
|
||||
<Prompt.DescriptionText>
|
||||
<Trans>
|
||||
This post claims to have been created on{' '}
|
||||
<RNText style={[a.font_bold]}>{niceDate(i18n, createdAt)}</RNText>,
|
||||
but was first seen by Bluesky on{' '}
|
||||
<RNText style={[a.font_bold]}>{niceDate(i18n, indexedAt)}</RNText>.
|
||||
<RNText style={[a.font_semi_bold]}>
|
||||
{niceDate(i18n, createdAt)}
|
||||
</RNText>
|
||||
, but was first seen by Bluesky on{' '}
|
||||
<RNText style={[a.font_semi_bold]}>
|
||||
{niceDate(i18n, indexedAt)}
|
||||
</RNText>
|
||||
.
|
||||
</Trans>
|
||||
</Prompt.DescriptionText>
|
||||
<Text
|
||||
|
||||
@@ -106,7 +106,8 @@ function ThreadItemPostDeleted({
|
||||
]}>
|
||||
<TrashIcon style={[t.atoms.text_contrast_medium]} />
|
||||
</View>
|
||||
<Text style={[a.text_md, a.font_bold, t.atoms.text_contrast_medium]}>
|
||||
<Text
|
||||
style={[a.text_md, a.font_semi_bold, t.atoms.text_contrast_medium]}>
|
||||
<Trans>Post has been deleted</Trans>
|
||||
</Text>
|
||||
</View>
|
||||
|
||||
@@ -46,7 +46,8 @@ export function ThreadItemPostTombstone({type}: ThreadItemPostTombstoneProps) {
|
||||
<View style={[a.flex_row, a.justify_center, {width: LINEAR_AVI_WIDTH}]}>
|
||||
<Icon style={[t.atoms.text_contrast_medium]} />
|
||||
</View>
|
||||
<Text style={[a.text_md, a.font_bold, t.atoms.text_contrast_medium]}>
|
||||
<Text
|
||||
style={[a.text_md, a.font_semi_bold, t.atoms.text_contrast_medium]}>
|
||||
{copy}
|
||||
</Text>
|
||||
</View>
|
||||
|
||||
@@ -27,7 +27,7 @@ export function ErrorState({error}: {error: string}) {
|
||||
<View style={[a.px_xl]}>
|
||||
<CircleInfo width={48} style={[t.atoms.text_contrast_low]} />
|
||||
|
||||
<Text style={[a.text_xl, a.font_bold, a.pb_md, a.pt_xl]}>
|
||||
<Text style={[a.text_xl, a.font_semi_bold, a.pb_md, a.pt_xl]}>
|
||||
<Trans>Hmmmm, we couldn't load that moderation service.</Trans>
|
||||
</Text>
|
||||
<Text
|
||||
|
||||
@@ -26,7 +26,7 @@ export function ProfileHeaderDisplayName({
|
||||
t.atoms.text,
|
||||
gtMobile ? a.text_4xl : a.text_3xl,
|
||||
a.self_start,
|
||||
a.font_heavy,
|
||||
a.font_bold,
|
||||
]}>
|
||||
{sanitizeDisplayName(
|
||||
profile.displayName || sanitizeHandle(profile.handle),
|
||||
|
||||
@@ -326,7 +326,7 @@ function DialogInner({
|
||||
style={[
|
||||
a.text_sm,
|
||||
a.mt_xs,
|
||||
a.font_bold,
|
||||
a.font_semi_bold,
|
||||
{color: t.palette.negative_400},
|
||||
]}>
|
||||
<Plural
|
||||
@@ -377,7 +377,7 @@ function DialogInner({
|
||||
style={[
|
||||
a.text_sm,
|
||||
a.mt_xs,
|
||||
a.font_bold,
|
||||
a.font_semi_bold,
|
||||
{color: t.palette.negative_400},
|
||||
]}>
|
||||
<Plural
|
||||
|
||||
@@ -37,7 +37,7 @@ export function ProfileHeaderMetrics({
|
||||
style={[a.flex_row, t.atoms.text]}
|
||||
to={makeProfileLink(profile, 'followers')}
|
||||
label={`${profile.followersCount || 0} ${pluralizedFollowers}`}>
|
||||
<Text style={[a.font_bold, a.text_md]}>{followers} </Text>
|
||||
<Text style={[a.font_semi_bold, a.text_md]}>{followers} </Text>
|
||||
<Text style={[t.atoms.text_contrast_medium, a.text_md]}>
|
||||
{pluralizedFollowers}
|
||||
</Text>
|
||||
@@ -47,12 +47,12 @@ export function ProfileHeaderMetrics({
|
||||
style={[a.flex_row, t.atoms.text]}
|
||||
to={makeProfileLink(profile, 'follows')}
|
||||
label={_(msg`${profile.followsCount || 0} following`)}>
|
||||
<Text style={[a.font_bold, a.text_md]}>{following} </Text>
|
||||
<Text style={[a.font_semi_bold, a.text_md]}>{following} </Text>
|
||||
<Text style={[t.atoms.text_contrast_medium, a.text_md]}>
|
||||
{pluralizedFollowings}
|
||||
</Text>
|
||||
</InlineLinkText>
|
||||
<Text style={[a.font_bold, t.atoms.text, a.text_md]}>
|
||||
<Text style={[a.font_semi_bold, t.atoms.text, a.text_md]}>
|
||||
{formatCount(i18n, profile.postsCount || 0)}{' '}
|
||||
<Text style={[t.atoms.text_contrast_medium, a.font_normal, a.text_md]}>
|
||||
{plural(profile.postsCount || 0, {one: 'post', other: 'posts'})}
|
||||
|
||||
@@ -225,7 +225,7 @@ let ProfileHeaderLabeler = ({
|
||||
? t.palette.contrast_700
|
||||
: t.palette.white,
|
||||
},
|
||||
a.font_bold,
|
||||
a.font_semi_bold,
|
||||
a.text_center,
|
||||
a.leading_tight,
|
||||
]}>
|
||||
@@ -297,7 +297,7 @@ let ProfileHeaderLabeler = ({
|
||||
{({hovered, focused, pressed}) => (
|
||||
<Text
|
||||
style={[
|
||||
a.font_bold,
|
||||
a.font_semi_bold,
|
||||
a.text_sm,
|
||||
t.atoms.text_contrast_medium,
|
||||
(hovered || focused || pressed) &&
|
||||
|
||||
@@ -267,7 +267,7 @@ let ProfileHeaderStandard = ({
|
||||
t.atoms.text,
|
||||
gtMobile ? a.text_4xl : a.text_3xl,
|
||||
a.self_start,
|
||||
a.font_heavy,
|
||||
a.font_bold,
|
||||
a.leading_tight,
|
||||
]}>
|
||||
{sanitizeDisplayName(
|
||||
|
||||
@@ -234,7 +234,7 @@ export function ProfileFeedHeader({info}: {info: FeedSourceFeedInfo}) {
|
||||
<Text
|
||||
style={[
|
||||
a.text_md,
|
||||
a.font_heavy,
|
||||
a.font_bold,
|
||||
a.leading_tight,
|
||||
gtMobile && a.text_lg,
|
||||
]}
|
||||
@@ -441,7 +441,7 @@ function DialogInner({
|
||||
|
||||
<View style={[a.flex_1, a.gap_2xs]}>
|
||||
<Text
|
||||
style={[a.text_2xl, a.font_heavy, a.leading_tight]}
|
||||
style={[a.text_2xl, a.font_bold, a.leading_tight]}
|
||||
numberOfLines={2}>
|
||||
{info.displayName}
|
||||
</Text>
|
||||
|
||||
@@ -22,7 +22,7 @@ export function ErrorScreen({error}: {error: React.ReactNode}) {
|
||||
|
||||
return (
|
||||
<View style={[a.px_xl, a.py_md, a.gap_md]}>
|
||||
<Text style={[a.text_4xl, a.font_heavy]}>
|
||||
<Text style={[a.text_4xl, a.font_bold]}>
|
||||
<Trans>Could not load list</Trans>
|
||||
</Text>
|
||||
<Text style={[a.text_md, t.atoms.text_contrast_high, a.leading_snug]}>
|
||||
|
||||
@@ -374,7 +374,7 @@ function SectionHeaderText({children}: {children: React.ReactNode}) {
|
||||
a.border_b,
|
||||
t.atoms.border_contrast_low,
|
||||
]}>
|
||||
<Text style={[a.text_xl, a.font_heavy, a.leading_snug]}>{children}</Text>
|
||||
<Text style={[a.text_xl, a.font_bold, a.leading_snug]}>{children}</Text>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
@@ -406,7 +406,7 @@ function FollowingFeedCard() {
|
||||
/>
|
||||
</View>
|
||||
<View style={[a.flex_1, a.flex_row, a.gap_sm, a.align_center]}>
|
||||
<Text style={[a.text_sm, a.font_bold, a.leading_snug]}>
|
||||
<Text style={[a.text_sm, a.font_semi_bold, a.leading_snug]}>
|
||||
<Trans context="feed-name">Following</Trans>
|
||||
</Text>
|
||||
</View>
|
||||
|
||||
@@ -885,7 +885,7 @@ export function Explore({
|
||||
]}>
|
||||
<CircleInfo size="md" fill={t.palette.negative_400} />
|
||||
<View style={[a.flex_1, a.gap_sm]}>
|
||||
<Text style={[a.font_bold, a.leading_snug]}>
|
||||
<Text style={[a.font_semi_bold, a.leading_snug]}>
|
||||
{item.message}
|
||||
</Text>
|
||||
<Text
|
||||
|
||||
@@ -460,7 +460,7 @@ let SearchScreenInner = ({
|
||||
a.pt_sm,
|
||||
a.pb_lg,
|
||||
]}>
|
||||
<Text style={[a.text_2xl, a.font_heavy]}>
|
||||
<Text style={[a.text_2xl, a.font_bold]}>
|
||||
<Trans>Search</Trans>
|
||||
</Text>
|
||||
</View>
|
||||
|
||||
@@ -93,7 +93,11 @@ export function Icon({
|
||||
|
||||
export function TitleText({style, ...props}: TextProps) {
|
||||
return (
|
||||
<Text style={[a.font_bold, a.flex_1, a.text_xl, style]} emoji {...props} />
|
||||
<Text
|
||||
style={[a.font_semi_bold, a.flex_1, a.text_xl, style]}
|
||||
emoji
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
@@ -45,7 +45,7 @@ export function SearchHistory({
|
||||
<View style={[a.w_full, a.gap_md]}>
|
||||
{(searchHistory.length > 0 || selectedProfiles.length > 0) && (
|
||||
<View style={[a.px_lg, a.pt_sm]}>
|
||||
<Text style={[a.text_md, a.font_bold]}>
|
||||
<Text style={[a.text_md, a.font_semi_bold]}>
|
||||
<Trans>Recent Searches</Trans>
|
||||
</Text>
|
||||
</View>
|
||||
|
||||
@@ -89,7 +89,7 @@ export function StarterPackCard({
|
||||
<View style={[a.flex_1]}>
|
||||
<Text
|
||||
emoji
|
||||
style={[a.text_md, a.font_bold, a.leading_snug]}
|
||||
style={[a.text_md, a.font_semi_bold, a.leading_snug]}
|
||||
numberOfLines={1}>
|
||||
{record.name}
|
||||
</Text>
|
||||
@@ -242,7 +242,7 @@ export function AvatarStack({
|
||||
<Text
|
||||
style={[
|
||||
gtPhone ? a.text_md : a.text_xs,
|
||||
a.font_bold,
|
||||
a.font_semi_bold,
|
||||
a.leading_snug,
|
||||
{color: 'white'},
|
||||
]}>
|
||||
|
||||
@@ -63,7 +63,7 @@ export function ExploreInterestsCard() {
|
||||
]}>
|
||||
<View style={[a.flex_row, a.gap_sm, a.align_center]}>
|
||||
<Shapes />
|
||||
<Text style={[a.text_xl, a.font_bold, a.leading_tight]}>
|
||||
<Text style={[a.text_xl, a.font_semi_bold, a.leading_tight]}>
|
||||
<Trans>Your interests</Trans>
|
||||
</Text>
|
||||
</View>
|
||||
|
||||
@@ -50,7 +50,7 @@ function Inner() {
|
||||
fill={t.palette.primary_500}
|
||||
style={{marginLeft: -2}}
|
||||
/>
|
||||
<Text style={[a.text_2xl, a.font_heavy, t.atoms.text]}>
|
||||
<Text style={[a.text_2xl, a.font_bold, t.atoms.text]}>
|
||||
<Trans>Recommended</Trans>
|
||||
</Text>
|
||||
</View>
|
||||
|
||||
@@ -104,7 +104,7 @@ export function TrendRow({
|
||||
<Text
|
||||
style={[
|
||||
a.text_md,
|
||||
a.font_bold,
|
||||
a.font_semi_bold,
|
||||
a.leading_tight,
|
||||
{width: 20},
|
||||
]}>
|
||||
@@ -113,7 +113,7 @@ export function TrendRow({
|
||||
</Trans>
|
||||
</Text>
|
||||
<Text
|
||||
style={[a.text_md, a.font_bold, a.leading_tight]}
|
||||
style={[a.text_md, a.font_semi_bold, a.leading_tight]}
|
||||
numberOfLines={1}>
|
||||
{trend.displayName}
|
||||
</Text>
|
||||
|
||||
@@ -97,7 +97,7 @@ export function AccountSettingsScreen({}: Props) {
|
||||
color={t.palette.primary_500}
|
||||
/>
|
||||
<SettingsList.ItemText
|
||||
style={[{color: t.palette.primary_500}, a.font_bold]}>
|
||||
style={[{color: t.palette.primary_500}, a.font_semi_bold]}>
|
||||
<Trans>Verify your email</Trans>
|
||||
</SettingsList.ItemText>
|
||||
<SettingsList.Chevron color={t.palette.primary_500} />
|
||||
|
||||
@@ -93,7 +93,7 @@ export function AppIconSettingsScreen({}: Props) {
|
||||
a.text_md,
|
||||
a.mt_xl,
|
||||
a.mb_sm,
|
||||
a.font_bold,
|
||||
a.font_semi_bold,
|
||||
t.atoms.text_contrast_medium,
|
||||
]}>
|
||||
<Trans>Bluesky+</Trans>
|
||||
@@ -201,7 +201,12 @@ function RowText({children}: {children: React.ReactNode}) {
|
||||
const t = useTheme()
|
||||
return (
|
||||
<Text
|
||||
style={[a.text_md, a.font_bold, a.flex_1, t.atoms.text_contrast_medium]}
|
||||
style={[
|
||||
a.text_md,
|
||||
a.font_semi_bold,
|
||||
a.flex_1,
|
||||
t.atoms.text_contrast_medium,
|
||||
]}
|
||||
emoji>
|
||||
{children}
|
||||
</Text>
|
||||
|
||||
@@ -167,7 +167,7 @@ function AppPasswordCard({
|
||||
a.gap_sm,
|
||||
]}>
|
||||
<View style={[a.gap_xs]}>
|
||||
<Text style={[t.atoms.text, a.text_md, a.font_bold]}>
|
||||
<Text style={[t.atoms.text, a.text_md, a.font_semi_bold]}>
|
||||
{appPassword.name}
|
||||
</Text>
|
||||
<Text style={[t.atoms.text_contrast_medium]}>
|
||||
|
||||
@@ -222,7 +222,7 @@ export function InterestButton({interest}: {interest: string}) {
|
||||
{
|
||||
color: t.palette.contrast_900,
|
||||
},
|
||||
a.font_bold,
|
||||
a.font_semi_bold,
|
||||
ctx.selected ? styles.textSelected : {},
|
||||
]}>
|
||||
{interestsDisplayNames[interest]}
|
||||
|
||||
@@ -140,7 +140,10 @@ export function ActivityNotificationSettingsScreen({}: Props) {
|
||||
Enable notifications for an account by visiting their
|
||||
profile and pressing the{' '}
|
||||
<RNText
|
||||
style={[a.font_bold, t.atoms.text_contrast_high]}>
|
||||
style={[
|
||||
a.font_semi_bold,
|
||||
t.atoms.text_contrast_high,
|
||||
]}>
|
||||
bell icon
|
||||
</RNText>{' '}
|
||||
<BellRingingFilledIcon
|
||||
@@ -157,7 +160,7 @@ export function ActivityNotificationSettingsScreen({}: Props) {
|
||||
<InlineLinkText
|
||||
label={_(msg`Privacy and Security settings`)}
|
||||
to={{screen: 'ActivityPrivacySettings'}}
|
||||
style={[a.font_bold]}>
|
||||
style={[a.font_semi_bold]}>
|
||||
Settings → Privacy and Security
|
||||
</InlineLinkText>
|
||||
.
|
||||
|
||||
@@ -19,7 +19,7 @@ export function ItemTextWithSubtitle({
|
||||
const t = useTheme()
|
||||
return (
|
||||
<View style={[a.flex_1, bold ? a.gap_xs : a.gap_2xs]}>
|
||||
<SettingsList.ItemText style={bold && [a.font_bold, a.text_lg]}>
|
||||
<SettingsList.ItemText style={bold && [a.font_semi_bold, a.text_lg]}>
|
||||
{titleText}
|
||||
</SettingsList.ItemText>
|
||||
{showSkeleton ? (
|
||||
|
||||
@@ -150,7 +150,7 @@ export function Inner({
|
||||
{'include' in preference && (
|
||||
<>
|
||||
<Divider />
|
||||
<Text style={[a.font_bold, a.text_md]}>
|
||||
<Text style={[a.font_semi_bold, a.text_md]}>
|
||||
<Trans>From</Trans>
|
||||
</Text>
|
||||
<Toggle.Group
|
||||
|
||||
@@ -343,7 +343,7 @@ function ProfilePreview({
|
||||
a.pt_sm,
|
||||
t.atoms.text,
|
||||
gtMobile ? a.text_4xl : a.text_3xl,
|
||||
a.font_heavy,
|
||||
a.font_bold,
|
||||
]}>
|
||||
{displayName}
|
||||
</Text>
|
||||
@@ -513,7 +513,9 @@ function DevOptions() {
|
||||
|
||||
<SettingsList.Divider />
|
||||
<View style={[a.p_xl, a.gap_md]}>
|
||||
<Text style={[a.text_lg, a.font_bold]}>PolicyUpdate202508 Debug</Text>
|
||||
<Text style={[a.text_lg, a.font_semi_bold]}>
|
||||
PolicyUpdate202508 Debug
|
||||
</Text>
|
||||
|
||||
<View style={[a.flex_row, a.align_center, a.justify_between, a.gap_md]}>
|
||||
<Button
|
||||
|
||||
@@ -107,7 +107,7 @@ function CreateDialogInner({passwords}: {passwords: string[]}) {
|
||||
style={[a.gap_lg]}
|
||||
exiting={native(SlideOutLeft)}
|
||||
key={0}>
|
||||
<Text style={[a.text_2xl, a.font_bold]}>
|
||||
<Text style={[a.text_2xl, a.font_semi_bold]}>
|
||||
<Trans>Add App Password</Trans>
|
||||
</Text>
|
||||
<Text style={[a.text_md, a.leading_snug]}>
|
||||
@@ -183,7 +183,7 @@ function CreateDialogInner({passwords}: {passwords: string[]}) {
|
||||
style={[a.gap_lg]}
|
||||
entering={isWeb ? FadeIn.delay(200) : SlideInRight}
|
||||
key={1}>
|
||||
<Text style={[a.text_2xl, a.font_bold]}>
|
||||
<Text style={[a.text_2xl, a.font_semi_bold]}>
|
||||
<Trans>Here is your app password!</Trans>
|
||||
</Text>
|
||||
<Text style={[a.text_md, a.leading_snug]}>
|
||||
|
||||
@@ -244,7 +244,7 @@ function ProvidedHandlePage({
|
||||
<Text>
|
||||
<Trans>
|
||||
Your full handle will be{' '}
|
||||
<Text style={[a.font_bold]}>
|
||||
<Text style={[a.font_semi_bold]}>
|
||||
@{createFullHandle(subdomain, host)}
|
||||
</Text>
|
||||
</Trans>
|
||||
@@ -280,7 +280,7 @@ function ProvidedHandlePage({
|
||||
}),
|
||||
)}
|
||||
to="https://bsky.social/about/blog/4-28-2023-domain-handle-tutorial"
|
||||
style={[a.font_bold]}
|
||||
style={[a.font_semi_bold]}
|
||||
disableMismatchWarning>
|
||||
Learn more here.
|
||||
</InlineLinkText>
|
||||
@@ -522,7 +522,7 @@ function OwnHandlePage({goToServiceHandle}: {goToServiceHandle: () => void}) {
|
||||
<Admonition type="info" style={[a.mb_md]}>
|
||||
<Trans>
|
||||
Your current handle{' '}
|
||||
<Text style={[a.font_bold]}>
|
||||
<Text style={[a.font_semi_bold]}>
|
||||
{sanitizeHandle(currentAccount?.handle || '', '@')}
|
||||
</Text>{' '}
|
||||
will automatically remain reserved for you. You can switch back to
|
||||
|
||||
@@ -165,7 +165,7 @@ function Inner() {
|
||||
style={web({maxWidth: 400})}>
|
||||
<View style={[a.gap_xl]}>
|
||||
<View style={[a.gap_sm]}>
|
||||
<Text style={[a.font_heavy, a.text_2xl]}>
|
||||
<Text style={[a.font_bold, a.text_2xl]}>
|
||||
{uiStrings[stage].title}
|
||||
</Text>
|
||||
{error ? (
|
||||
|
||||
@@ -58,7 +58,7 @@ export function CopyButton({
|
||||
pointerEvents="none">
|
||||
<Text
|
||||
style={[
|
||||
a.font_bold,
|
||||
a.font_semi_bold,
|
||||
a.text_right,
|
||||
a.text_md,
|
||||
t.atoms.text_contrast_high,
|
||||
|
||||
@@ -85,7 +85,7 @@ export function DisableEmail2FADialog({
|
||||
<View style={[a.relative, a.gap_md, a.w_full]}>
|
||||
<Text
|
||||
nativeID="dialog-title"
|
||||
style={[a.text_2xl, a.font_bold, t.atoms.text]}>
|
||||
style={[a.text_2xl, a.font_semi_bold, t.atoms.text]}>
|
||||
<Trans>Disable Email 2FA</Trans>
|
||||
</Text>
|
||||
<P nativeID="dialog-description">
|
||||
|
||||
@@ -58,7 +58,7 @@ export function ExportCarDialog({
|
||||
accessibilityDescribedBy="dialog-description"
|
||||
accessibilityLabelledBy="dialog-title">
|
||||
<View style={[a.relative, a.gap_lg, a.w_full]}>
|
||||
<Text nativeID="dialog-title" style={[a.text_2xl, a.font_heavy]}>
|
||||
<Text nativeID="dialog-title" style={[a.text_2xl, a.font_bold]}>
|
||||
<Trans>Export My Data</Trans>
|
||||
</Text>
|
||||
<Text
|
||||
|
||||
@@ -133,7 +133,7 @@ export function Signup({onPressBack}: {onPressBack: () => void}) {
|
||||
<Animated.View entering={!isFetchedAtMount ? FadeIn : undefined}>
|
||||
<LinearGradientBackground
|
||||
style={[a.mx_lg, a.p_lg, a.gap_sm, a.rounded_sm]}>
|
||||
<Text style={[a.font_bold, a.text_xl, {color: 'white'}]}>
|
||||
<Text style={[a.font_semi_bold, a.text_xl, {color: 'white'}]}>
|
||||
{starterPack.record.name}
|
||||
</Text>
|
||||
<Text style={[{color: 'white'}]}>
|
||||
@@ -164,7 +164,8 @@ export function Signup({onPressBack}: {onPressBack: () => void}) {
|
||||
!gtMobile && {paddingBottom: 100},
|
||||
]}>
|
||||
<View style={[a.gap_sm, a.pb_3xl]}>
|
||||
<Text style={[a.font_bold, t.atoms.text_contrast_medium]}>
|
||||
<Text
|
||||
style={[a.font_semi_bold, t.atoms.text_contrast_medium]}>
|
||||
<Trans>
|
||||
Step {state.activeStep + 1} of{' '}
|
||||
{state.serviceDescription &&
|
||||
@@ -173,7 +174,7 @@ export function Signup({onPressBack}: {onPressBack: () => void}) {
|
||||
: '3'}
|
||||
</Trans>
|
||||
</Text>
|
||||
<Text style={[a.text_3xl, a.font_bold]}>
|
||||
<Text style={[a.text_3xl, a.font_semi_bold]}>
|
||||
{state.activeStep === SignupStep.INFO ? (
|
||||
<Trans>Your account</Trans>
|
||||
) : state.activeStep === SignupStep.HANDLE ? (
|
||||
|
||||
@@ -123,7 +123,7 @@ export function SignupQueued() {
|
||||
<Logo width={120} />
|
||||
</View>
|
||||
|
||||
<Text style={[a.text_4xl, a.font_heavy, a.pb_sm]}>
|
||||
<Text style={[a.text_4xl, a.font_bold, a.pb_sm]}>
|
||||
<Trans>You're in line</Trans>
|
||||
</Text>
|
||||
<P style={[t.atoms.text_contrast_medium]}>
|
||||
@@ -146,7 +146,7 @@ export function SignupQueued() {
|
||||
]}>
|
||||
{typeof placeInQueue === 'number' && (
|
||||
<Text
|
||||
style={[a.text_5xl, a.text_center, a.font_heavy, a.mb_2xl]}>
|
||||
style={[a.text_5xl, a.text_center, a.font_bold, a.mb_2xl]}>
|
||||
{placeInQueue}
|
||||
</Text>
|
||||
)}
|
||||
|
||||
@@ -183,7 +183,7 @@ function LandingScreenLoaded({
|
||||
</View>
|
||||
<Text
|
||||
style={[
|
||||
a.font_bold,
|
||||
a.font_semi_bold,
|
||||
a.text_4xl,
|
||||
a.text_center,
|
||||
a.leading_tight,
|
||||
@@ -192,7 +192,12 @@ function LandingScreenLoaded({
|
||||
{record.name}
|
||||
</Text>
|
||||
<Text
|
||||
style={[a.text_center, a.font_bold, a.text_md, {color: 'white'}]}>
|
||||
style={[
|
||||
a.text_center,
|
||||
a.font_semi_bold,
|
||||
a.text_md,
|
||||
{color: 'white'},
|
||||
]}>
|
||||
Starter pack by {`@${creator.handle}`}
|
||||
</Text>
|
||||
</LinearGradientBackground>
|
||||
@@ -218,7 +223,11 @@ function LandingScreenLoaded({
|
||||
color={t.atoms.text_contrast_medium.color}
|
||||
/>
|
||||
<Text
|
||||
style={[a.font_bold, a.text_sm, t.atoms.text_contrast_medium]}
|
||||
style={[
|
||||
a.font_semi_bold,
|
||||
a.text_sm,
|
||||
t.atoms.text_contrast_medium,
|
||||
]}
|
||||
numberOfLines={1}>
|
||||
<Trans>
|
||||
{formatCount(i18n, JOINED_THIS_WEEK)} joined this week
|
||||
@@ -229,7 +238,7 @@ function LandingScreenLoaded({
|
||||
<View style={[a.gap_3xl]}>
|
||||
{Boolean(listItemsSample?.length) && (
|
||||
<View style={[a.gap_md]}>
|
||||
<Text style={[a.font_heavy, a.text_lg]}>
|
||||
<Text style={[a.font_bold, a.text_lg]}>
|
||||
{listItemsCount <= 8 ? (
|
||||
<Trans>You'll follow these people right away</Trans>
|
||||
) : (
|
||||
@@ -270,7 +279,7 @@ function LandingScreenLoaded({
|
||||
)}
|
||||
{feeds?.length ? (
|
||||
<View style={[a.gap_md]}>
|
||||
<Text style={[a.font_heavy, a.text_lg]}>
|
||||
<Text style={[a.font_bold, a.text_lg]}>
|
||||
<Trans>You'll stay updated with these feeds</Trans>
|
||||
</Text>
|
||||
|
||||
@@ -387,7 +396,11 @@ export function AppClipOverlay({
|
||||
{/* Webkit needs this to have a zindex of 2? */}
|
||||
<View style={[a.gap_md, {zIndex: 2}]}>
|
||||
<Text
|
||||
style={[a.font_bold, a.text_4xl, {lineHeight: 40, color: 'white'}]}>
|
||||
style={[
|
||||
a.font_semi_bold,
|
||||
a.text_4xl,
|
||||
{lineHeight: 40, color: 'white'},
|
||||
]}>
|
||||
Download Bluesky to get started!
|
||||
</Text>
|
||||
<Text style={[a.text_lg, {color: 'white'}]}>
|
||||
|
||||
@@ -486,7 +486,11 @@ function Header({
|
||||
color={t.atoms.text_contrast_medium.color}
|
||||
/>
|
||||
<Text
|
||||
style={[a.font_bold, a.text_sm, t.atoms.text_contrast_medium]}>
|
||||
style={[
|
||||
a.font_semi_bold,
|
||||
a.text_sm,
|
||||
t.atoms.text_contrast_medium,
|
||||
]}>
|
||||
<Trans comment="Number of users (always at least 25) who have joined Bluesky using a specific starter pack">
|
||||
<Plural
|
||||
value={starterPack.joinedAllTimeCount || 0}
|
||||
@@ -669,7 +673,7 @@ function OverflowMenu({
|
||||
t.atoms.bg_contrast_25,
|
||||
]}>
|
||||
<View style={[a.flex_1, a.gap_2xs]}>
|
||||
<Text style={[a.font_bold]}>
|
||||
<Text style={[a.font_semi_bold]}>
|
||||
<Trans>Unable to delete</Trans>
|
||||
</Text>
|
||||
<Text style={[a.leading_snug]}>{cleanError(deleteError)}</Text>
|
||||
@@ -727,7 +731,7 @@ function InvalidStarterPack({rkey}: {rkey: string}) {
|
||||
<Layout.Content centerContent>
|
||||
<View style={[a.py_4xl, a.px_xl, a.align_center, a.gap_5xl]}>
|
||||
<View style={[a.w_full, a.align_center, a.gap_lg]}>
|
||||
<Text style={[a.font_bold, a.text_3xl]}>
|
||||
<Text style={[a.font_semi_bold, a.text_3xl]}>
|
||||
<Trans>Starter pack is invalid</Trans>
|
||||
</Text>
|
||||
<Text
|
||||
|
||||
@@ -27,7 +27,7 @@ export function StepDetails() {
|
||||
<View style={[a.px_xl, a.gap_xl, a.mt_4xl]}>
|
||||
<View style={[a.gap_md, a.align_center, a.px_md, a.mb_md]}>
|
||||
<StarterPack width={90} gradient="sky" />
|
||||
<Text style={[a.font_bold, a.text_3xl]}>
|
||||
<Text style={[a.font_semi_bold, a.text_3xl]}>
|
||||
<Trans>Invites, but personal</Trans>
|
||||
</Text>
|
||||
<Text style={[a.text_center, a.text_md, a.px_md]}>
|
||||
|
||||
@@ -113,7 +113,7 @@ export function StepFeeds({moderationOpts}: {moderationOpts: ModerationOpts}) {
|
||||
) : (
|
||||
<Text
|
||||
style={[
|
||||
a.font_bold,
|
||||
a.font_semi_bold,
|
||||
a.text_lg,
|
||||
a.text_center,
|
||||
a.mt_lg,
|
||||
|
||||
@@ -98,7 +98,7 @@ export function StepProfiles({
|
||||
) : (
|
||||
<Text
|
||||
style={[
|
||||
a.font_bold,
|
||||
a.font_semi_bold,
|
||||
a.text_lg,
|
||||
a.text_center,
|
||||
a.mt_lg,
|
||||
|
||||
@@ -447,7 +447,7 @@ function Footer({
|
||||
]}>
|
||||
{items.length > minimumItems && (
|
||||
<View style={[a.absolute, {right: 14, top: 31}]}>
|
||||
<Text style={[a.font_bold]}>
|
||||
<Text style={[a.font_semi_bold]}>
|
||||
{items.length}/
|
||||
{state.currentStep === 'Profiles' ? STARTER_PACK_MAX_SIZE : 3}
|
||||
</Text>
|
||||
@@ -490,7 +490,7 @@ function Footer({
|
||||
) : (
|
||||
<Trans>
|
||||
It's just{' '}
|
||||
<Text style={[a.font_bold, textStyles]} emoji>
|
||||
<Text style={[a.font_semi_bold, textStyles]} emoji>
|
||||
{getName(items[0])}{' '}
|
||||
</Text>
|
||||
right now! Add more people to your starter pack by searching
|
||||
@@ -500,21 +500,21 @@ function Footer({
|
||||
) : items.length === 2 ? (
|
||||
currentAccount?.did === items[0].did ? (
|
||||
<Trans>
|
||||
<Text style={[a.font_bold, textStyles]}>You</Text> and
|
||||
<Text style={[a.font_semi_bold, textStyles]}>You</Text> and
|
||||
<Text> </Text>
|
||||
<Text style={[a.font_bold, textStyles]} emoji>
|
||||
<Text style={[a.font_semi_bold, textStyles]} emoji>
|
||||
{getName(items[1] /* [0] is self, skip it */)}{' '}
|
||||
</Text>
|
||||
are included in your starter pack
|
||||
</Trans>
|
||||
) : (
|
||||
<Trans>
|
||||
<Text style={[a.font_bold, textStyles]}>
|
||||
<Text style={[a.font_semi_bold, textStyles]}>
|
||||
{getName(items[0])}
|
||||
</Text>{' '}
|
||||
and
|
||||
<Text> </Text>
|
||||
<Text style={[a.font_bold, textStyles]} emoji>
|
||||
<Text style={[a.font_semi_bold, textStyles]} emoji>
|
||||
{getName(items[1] /* [0] is self, skip it */)}{' '}
|
||||
</Text>
|
||||
are included in your starter pack
|
||||
@@ -522,10 +522,10 @@ function Footer({
|
||||
)
|
||||
) : items.length > 2 ? (
|
||||
<Trans context="profiles">
|
||||
<Text style={[a.font_bold, textStyles]} emoji>
|
||||
<Text style={[a.font_semi_bold, textStyles]} emoji>
|
||||
{getName(items[1] /* [0] is self, skip it */)},{' '}
|
||||
</Text>
|
||||
<Text style={[a.font_bold, textStyles]} emoji>
|
||||
<Text style={[a.font_semi_bold, textStyles]} emoji>
|
||||
{getName(items[2])},{' '}
|
||||
</Text>
|
||||
and{' '}
|
||||
@@ -542,7 +542,7 @@ function Footer({
|
||||
) : state.currentStep === 'Feeds' ? (
|
||||
items.length === 0 ? (
|
||||
<View style={[a.gap_sm]}>
|
||||
<Text style={[a.font_bold, a.text_center, textStyles]}>
|
||||
<Text style={[a.font_semi_bold, a.text_center, textStyles]}>
|
||||
<Trans>Add some feeds to your starter pack!</Trans>
|
||||
</Text>
|
||||
<Text style={[a.text_center, textStyles]}>
|
||||
@@ -556,29 +556,29 @@ function Footer({
|
||||
{
|
||||
items.length === 1 ? (
|
||||
<Trans>
|
||||
<Text style={[a.font_bold, textStyles]} emoji>
|
||||
<Text style={[a.font_semi_bold, textStyles]} emoji>
|
||||
{getName(items[0])}
|
||||
</Text>{' '}
|
||||
is included in your starter pack
|
||||
</Trans>
|
||||
) : items.length === 2 ? (
|
||||
<Trans>
|
||||
<Text style={[a.font_bold, textStyles]} emoji>
|
||||
<Text style={[a.font_semi_bold, textStyles]} emoji>
|
||||
{getName(items[0])}
|
||||
</Text>{' '}
|
||||
and
|
||||
<Text> </Text>
|
||||
<Text style={[a.font_bold, textStyles]} emoji>
|
||||
<Text style={[a.font_semi_bold, textStyles]} emoji>
|
||||
{getName(items[1])}{' '}
|
||||
</Text>
|
||||
are included in your starter pack
|
||||
</Trans>
|
||||
) : items.length > 2 ? (
|
||||
<Trans context="feeds">
|
||||
<Text style={[a.font_bold, textStyles]} emoji>
|
||||
<Text style={[a.font_semi_bold, textStyles]} emoji>
|
||||
{getName(items[0])},{' '}
|
||||
</Text>
|
||||
<Text style={[a.font_bold, textStyles]} emoji>
|
||||
<Text style={[a.font_semi_bold, textStyles]} emoji>
|
||||
{getName(items[1])},{' '}
|
||||
</Text>
|
||||
and{' '}
|
||||
@@ -604,7 +604,12 @@ function Footer({
|
||||
isNative ? a.mt_sm : a.mt_md,
|
||||
]}>
|
||||
{state.currentStep === 'Profiles' && items.length < 8 && (
|
||||
<Text style={[a.font_bold, textStyles, t.atoms.text_contrast_medium]}>
|
||||
<Text
|
||||
style={[
|
||||
a.font_semi_bold,
|
||||
textStyles,
|
||||
t.atoms.text_contrast_medium,
|
||||
]}>
|
||||
<Trans>Add {8 - items.length} more to continue</Trans>
|
||||
</Text>
|
||||
)}
|
||||
|
||||
@@ -148,7 +148,7 @@ export function Takendown() {
|
||||
<Logo width={64} />
|
||||
</View>
|
||||
|
||||
<Text style={[a.text_4xl, a.font_heavy, a.pb_md]}>
|
||||
<Text style={[a.text_4xl, a.font_bold, a.pb_md]}>
|
||||
{isAppealling ? (
|
||||
<Trans>Appeal suspension</Trans>
|
||||
) : (
|
||||
|
||||
@@ -120,7 +120,7 @@ export function FeedHeader({
|
||||
<Text
|
||||
style={[
|
||||
a.text_md,
|
||||
a.font_heavy,
|
||||
a.font_bold,
|
||||
a.leading_tight,
|
||||
gtMobile && a.text_lg,
|
||||
]}
|
||||
|
||||
@@ -179,7 +179,7 @@ export function Scrubber({
|
||||
timeStyle,
|
||||
]}
|
||||
pointerEvents="none">
|
||||
<Text style={[a.text_center, a.font_bold]}>
|
||||
<Text style={[a.text_center, a.font_semi_bold]}>
|
||||
<Text style={[a.text_5xl, {fontVariant: ['tabular-nums']}]}>
|
||||
{formatTime(currentSeekTime)}
|
||||
</Text>
|
||||
|
||||
@@ -524,7 +524,7 @@ let VideoItem = ({
|
||||
<Text
|
||||
style={[
|
||||
a.text_2xl,
|
||||
a.font_heavy,
|
||||
a.font_bold,
|
||||
a.text_center,
|
||||
a.leading_tight,
|
||||
a.mx_xl,
|
||||
@@ -670,7 +670,7 @@ function ModerationOverlay({
|
||||
<Text
|
||||
style={[
|
||||
a.text_sm,
|
||||
a.font_bold,
|
||||
a.font_semi_bold,
|
||||
a.text_center,
|
||||
{opacity: pressed ? 0.5 : 1},
|
||||
]}>
|
||||
@@ -807,7 +807,7 @@ function Overlay({
|
||||
/>
|
||||
<View style={[a.flex_1]}>
|
||||
<Text
|
||||
style={[a.text_md, a.font_heavy]}
|
||||
style={[a.text_md, a.font_bold]}
|
||||
emoji
|
||||
numberOfLines={1}>
|
||||
{sanitizeDisplayName(
|
||||
@@ -1115,7 +1115,7 @@ function EndMessage() {
|
||||
<LeafIcon width={64} fill="black" />
|
||||
</View>
|
||||
<View style={[a.w_full, a.gap_md]}>
|
||||
<Text style={[a.text_3xl, a.text_center, a.font_heavy]}>
|
||||
<Text style={[a.text_3xl, a.text_center, a.font_bold]}>
|
||||
<Trans>That's everything!</Trans>
|
||||
</Text>
|
||||
<Text
|
||||
|
||||
Reference in New Issue
Block a user