zio
/
bsky-app
2
0
Fork 0
Code Pull Requests Packages Releases Activity

Replace `import hairlineWidth =` with const (#4831) 

* replace import with const

* just use `StyleSheet.hairlineWidth`

---------

Co-authored-by: Samuel Newman <10959775+mozzius@users.noreply.github.com>
zio/stable
Samuel Newman 2024-07-25 20:45:15 +01:00 committed by GitHub
parent 00240b95b9
commit 401e92ed42
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
27 changed files with 81 additions and 105 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/alf/atoms.ts
View File

@ -2,7 +2,6 @@ import {Platform, StyleSheet} from 'react-native'
import * as tokens from '#/alf/tokens' import * as tokens from '#/alf/tokens'
import {native, web} from '#/alf/util/platform' import {native, web} from '#/alf/util/platform'
import hairlineWidth = StyleSheet.hairlineWidth
export const atoms = { export const atoms = {
/* /*
@ -284,19 +283,19 @@ export const atoms = {
borderWidth: 0, borderWidth: 0,
}, },
border: { border: {
borderWidth: hairlineWidth, borderWidth: StyleSheet.hairlineWidth,
}, },
border_t: { border_t: {
borderTopWidth: hairlineWidth, borderTopWidth: StyleSheet.hairlineWidth,
}, },
border_b: { border_b: {
borderBottomWidth: hairlineWidth, borderBottomWidth: StyleSheet.hairlineWidth,
}, },
border_l: { border_l: {
borderLeftWidth: hairlineWidth, borderLeftWidth: StyleSheet.hairlineWidth,
}, },
border_r: { border_r: {
borderRightWidth: hairlineWidth, borderRightWidth: StyleSheet.hairlineWidth,
}, },
/* /*

9
src/view/com/composer/Composer.tsx
View File

@ -99,7 +99,6 @@ import {SelectVideoBtn} from './videos/SelectVideoBtn'
import {useVideoState} from './videos/state' import {useVideoState} from './videos/state'
import {VideoPreview} from './videos/VideoPreview' import {VideoPreview} from './videos/VideoPreview'
import {VideoTranscodeProgress} from './videos/VideoTranscodeProgress' import {VideoTranscodeProgress} from './videos/VideoTranscodeProgress'
import hairlineWidth = StyleSheet.hairlineWidth
type CancelRef = { type CancelRef = {
onPressCancel: () => void onPressCancel: () => void
@ -763,7 +762,7 @@ function useAnimatedBorders() {
const topBarAnimatedStyle = useAnimatedStyle(() => { const topBarAnimatedStyle = useAnimatedStyle(() => {
return { return {
borderBottomWidth: hairlineWidth, borderBottomWidth: StyleSheet.hairlineWidth,
borderColor: interpolateColor( borderColor: interpolateColor(
hasScrolledTop.value, hasScrolledTop.value,
[0, 1], [0, 1],
@ -773,7 +772,7 @@ function useAnimatedBorders() {
}) })
const bottomBarAnimatedStyle = useAnimatedStyle(() => { const bottomBarAnimatedStyle = useAnimatedStyle(() => {
return { return {
borderTopWidth: hairlineWidth, borderTopWidth: StyleSheet.hairlineWidth,
borderColor: interpolateColor( borderColor: interpolateColor(
hasScrolledBottom.value, hasScrolledBottom.value,
[0, 1], [0, 1],
@ -855,7 +854,7 @@ const styles = StyleSheet.create({
marginBottom: 8, marginBottom: 8,
}, },
errorIcon: { errorIcon: {
borderWidth: hairlineWidth, borderWidth: StyleSheet.hairlineWidth,
borderColor: colors.red4, borderColor: colors.red4,
color: colors.red4, color: colors.red4,
borderRadius: 30, borderRadius: 30,
@ -891,6 +890,6 @@ const styles = StyleSheet.create({
paddingLeft: 7, paddingLeft: 7,
paddingRight: 16, paddingRight: 16,
alignItems: 'center', alignItems: 'center',
borderTopWidth: hairlineWidth, borderTopWidth: StyleSheet.hairlineWidth,
}, },
}) })

3
src/view/com/composer/Prompt.tsx
View File

@ -9,7 +9,6 @@ import {usePalette} from 'lib/hooks/usePalette'
import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
import {Text} from '../util/text/Text' import {Text} from '../util/text/Text'
import {UserAvatar} from '../util/UserAvatar' import {UserAvatar} from '../util/UserAvatar'
import hairlineWidth = StyleSheet.hairlineWidth
export function ComposePrompt({onPressCompose}: {onPressCompose: () => void}) { export function ComposePrompt({onPressCompose}: {onPressCompose: () => void}) {
const {currentAccount} = useSession() const {currentAccount} = useSession()
@ -49,7 +48,7 @@ const styles = StyleSheet.create({
paddingBottom: 10, paddingBottom: 10,
flexDirection: 'row', flexDirection: 'row',
alignItems: 'center', alignItems: 'center',
borderTopWidth: hairlineWidth, borderTopWidth: StyleSheet.hairlineWidth,
}, },
labelMobile: { labelMobile: {
paddingLeft: 12, paddingLeft: 12,

7
src/view/com/feeds/FeedSourceCard.tsx
View File

@ -13,6 +13,7 @@ import {msg, Plural, Trans} from '@lingui/macro'
import {useLingui} from '@lingui/react' import {useLingui} from '@lingui/react'
import {logger} from '#/logger' import {logger} from '#/logger'
import {shouldClickOpenNewTab} from '#/platform/urls'
import {FeedSourceInfo, useFeedSourceInfoQuery} from '#/state/queries/feed' import {FeedSourceInfo, useFeedSourceInfoQuery} from '#/state/queries/feed'
import { import {
useAddSavedFeedsMutation, useAddSavedFeedsMutation,
@ -32,8 +33,6 @@ import * as Prompt from '#/components/Prompt'
import {RichText} from '#/components/RichText' import {RichText} from '#/components/RichText'
import {Text} from '../util/text/Text' import {Text} from '../util/text/Text'
import {UserAvatar} from '../util/UserAvatar' import {UserAvatar} from '../util/UserAvatar'
import hairlineWidth = StyleSheet.hairlineWidth
import {shouldClickOpenNewTab} from '#/platform/urls'
export function FeedSourceCard({ export function FeedSourceCard({
feedUri, feedUri,
@ -209,7 +208,7 @@ export function FeedSourceCardLoaded({
styles.container, styles.container,
pal.border, pal.border,
style, style,
{borderTopWidth: hideTopBorder ? 0 : hairlineWidth}, {borderTopWidth: hideTopBorder ? 0 : StyleSheet.hairlineWidth},
]} ]}
onPress={e => { onPress={e => {
const shouldOpenInNewTab = shouldClickOpenNewTab(e) const shouldOpenInNewTab = shouldClickOpenNewTab(e)
@ -330,7 +329,7 @@ const styles = StyleSheet.create({
gap: 14, gap: 14,
}, },
border: { border: {
borderTopWidth: hairlineWidth, borderTopWidth: StyleSheet.hairlineWidth,
}, },
headerContainer: { headerContainer: {
flexDirection: 'row', flexDirection: 'row',

3
src/view/com/lists/ListCard.tsx
View File

@ -14,7 +14,6 @@ import {RichText as RichTextCom} from '#/components/RichText'
import {Link} from '../util/Link' import {Link} from '../util/Link'
import {Text} from '../util/text/Text' import {Text} from '../util/text/Text'
import {UserAvatar} from '../util/UserAvatar' import {UserAvatar} from '../util/UserAvatar'
import hairlineWidth = StyleSheet.hairlineWidth
export const ListCard = ({ export const ListCard = ({
testID, testID,
@ -134,7 +133,7 @@ export const ListCard = ({
const styles = StyleSheet.create({ const styles = StyleSheet.create({
outer: { outer: {
borderTopWidth: hairlineWidth, borderTopWidth: StyleSheet.hairlineWidth,
paddingHorizontal: 6, paddingHorizontal: 6,
}, },
outerNoBorder: { outerNoBorder: {

7
src/view/com/modals/UserAddRemoveLists.tsx
View File

@ -29,7 +29,6 @@ import {Button} from '../util/forms/Button'
import {Text} from '../util/text/Text' import {Text} from '../util/text/Text'
import * as Toast from '../util/Toast' import * as Toast from '../util/Toast'
import {UserAvatar} from '../util/UserAvatar' import {UserAvatar} from '../util/UserAvatar'
import hairlineWidth = StyleSheet.hairlineWidth
export const snapPoints = ['fullscreen'] export const snapPoints = ['fullscreen']
@ -63,7 +62,7 @@ export function Component({
return [pal.border, {height: screenHeight / 1.5}] return [pal.border, {height: screenHeight / 1.5}]
} }
return [pal.border, {flex: 1, borderTopWidth: hairlineWidth}] return [pal.border, {flex: 1, borderTopWidth: StyleSheet.hairlineWidth}]
}, [pal.border, screenHeight]) }, [pal.border, screenHeight])
return ( return (
@ -188,7 +187,7 @@ function ListItem({
style={[ style={[
styles.listItem, styles.listItem,
pal.border, pal.border,
index !== 0 && {borderTopWidth: hairlineWidth}, index !== 0 && {borderTopWidth: StyleSheet.hairlineWidth},
]}> ]}>
<View style={styles.listItemAvi}> <View style={styles.listItemAvi}>
<UserAvatar size={40} avatar={list.avatar} type="list" /> <UserAvatar size={40} avatar={list.avatar} type="list" />
@ -248,7 +247,7 @@ const styles = StyleSheet.create({
gap: 10, gap: 10,
paddingTop: 10, paddingTop: 10,
paddingBottom: isAndroid ? 10 : 0, paddingBottom: isAndroid ? 10 : 0,
borderTopWidth: hairlineWidth, borderTopWidth: StyleSheet.hairlineWidth,
}, },
footerBtn: { footerBtn: {
paddingHorizontal: 24, paddingHorizontal: 24,

3
src/view/com/notifications/Feed.tsx
View File

@ -24,7 +24,6 @@ import {NotificationFeedLoadingPlaceholder} from '#/view/com/util/LoadingPlaceho
import {LoadMoreRetryBtn} from '#/view/com/util/LoadMoreRetryBtn' import {LoadMoreRetryBtn} from '#/view/com/util/LoadMoreRetryBtn'
import {CenteredView} from '#/view/com/util/Views' import {CenteredView} from '#/view/com/util/Views'
import {FeedItem} from './FeedItem' import {FeedItem} from './FeedItem'
import hairlineWidth = StyleSheet.hairlineWidth
const EMPTY_FEED_ITEM = {_reactKey: '__empty__'} const EMPTY_FEED_ITEM = {_reactKey: '__empty__'}
const LOAD_MORE_ERROR_ITEM = {_reactKey: '__load_more_error__'} const LOAD_MORE_ERROR_ITEM = {_reactKey: '__load_more_error__'}
@ -137,7 +136,7 @@ export function Feed({
<View <View
style={[ style={[
pal.border, pal.border,
!isTabletOrMobile && {borderTopWidth: hairlineWidth}, !isTabletOrMobile && {borderTopWidth: StyleSheet.hairlineWidth},
]}> ]}>
<NotificationFeedLoadingPlaceholder /> <NotificationFeedLoadingPlaceholder />
</View> </View>

25
src/view/com/notifications/FeedItem.tsx
View File

@ -20,20 +20,28 @@ import {
import {AtUri} from '@atproto/api' import {AtUri} from '@atproto/api'
import {msg, plural, Trans} from '@lingui/macro' import {msg, plural, Trans} from '@lingui/macro'
import {useLingui} from '@lingui/react' import {useLingui} from '@lingui/react'
import {useNavigation} from '@react-navigation/native'
import {useQueryClient} from '@tanstack/react-query' import {useQueryClient} from '@tanstack/react-query'
import {useGate} from '#/lib/statsig/statsig' import {useGate} from '#/lib/statsig/statsig'
import {parseTenorGif} from '#/lib/strings/embed-player'
import {logger} from '#/logger'
import {FeedNotification} from '#/state/queries/notifications/feed' import {FeedNotification} from '#/state/queries/notifications/feed'
import {useAnimatedValue} from 'lib/hooks/useAnimatedValue' import {useAnimatedValue} from 'lib/hooks/useAnimatedValue'
import {usePalette} from 'lib/hooks/usePalette' import {usePalette} from 'lib/hooks/usePalette'
import {makeProfileLink} from 'lib/routes/links' import {makeProfileLink} from 'lib/routes/links'
import {NavigationProp} from 'lib/routes/types'
import {forceLTR} from 'lib/strings/bidi'
import {sanitizeDisplayName} from 'lib/strings/display-names' import {sanitizeDisplayName} from 'lib/strings/display-names'
import {sanitizeHandle} from 'lib/strings/handles' import {sanitizeHandle} from 'lib/strings/handles'
import {niceDate} from 'lib/strings/time' import {niceDate} from 'lib/strings/time'
import {colors, s} from 'lib/styles' import {colors, s} from 'lib/styles'
import {isWeb} from 'platform/detection' import {isWeb} from 'platform/detection'
import {DM_SERVICE_HEADERS} from 'state/queries/messages/const'
import {precacheProfile} from 'state/queries/profile' import {precacheProfile} from 'state/queries/profile'
import {useAgent} from 'state/session'
import {atoms as a, useTheme} from '#/alf' import {atoms as a, useTheme} from '#/alf'
import {Button, ButtonText} from '#/components/Button'
import { import {
ChevronBottom_Stroke2_Corner0_Rounded as ChevronDownIcon, ChevronBottom_Stroke2_Corner0_Rounded as ChevronDownIcon,
ChevronTop_Stroke2_Corner0_Rounded as ChevronUpIcon, ChevronTop_Stroke2_Corner0_Rounded as ChevronUpIcon,
@ -41,8 +49,10 @@ import {
import {Heart2_Filled_Stroke2_Corner0_Rounded as HeartIconFilled} from '#/components/icons/Heart2' import {Heart2_Filled_Stroke2_Corner0_Rounded as HeartIconFilled} from '#/components/icons/Heart2'
import {PersonPlus_Filled_Stroke2_Corner0_Rounded as PersonPlusIcon} from '#/components/icons/Person' import {PersonPlus_Filled_Stroke2_Corner0_Rounded as PersonPlusIcon} from '#/components/icons/Person'
import {Repost_Stroke2_Corner2_Rounded as RepostIcon} from '#/components/icons/Repost' import {Repost_Stroke2_Corner2_Rounded as RepostIcon} from '#/components/icons/Repost'
import {StarterPack} from '#/components/icons/StarterPack'
import {Link as NewLink} from '#/components/Link' import {Link as NewLink} from '#/components/Link'
import {ProfileHoverCard} from '#/components/ProfileHoverCard' import {ProfileHoverCard} from '#/components/ProfileHoverCard'
import {Notification as StarterPackCard} from '#/components/StarterPack/StarterPackCard'
import {FeedSourceCard} from '../feeds/FeedSourceCard' import {FeedSourceCard} from '../feeds/FeedSourceCard'
import {Post} from '../post/Post' import {Post} from '../post/Post'
import {ImageHorzList} from '../util/images/ImageHorzList' import {ImageHorzList} from '../util/images/ImageHorzList'
@ -52,19 +62,6 @@ import {Text} from '../util/text/Text'
import {TimeElapsed} from '../util/TimeElapsed' import {TimeElapsed} from '../util/TimeElapsed'
import {PreviewableUserAvatar, UserAvatar} from '../util/UserAvatar' import {PreviewableUserAvatar, UserAvatar} from '../util/UserAvatar'
import hairlineWidth = StyleSheet.hairlineWidth
import {useNavigation} from '@react-navigation/native'
import {parseTenorGif} from '#/lib/strings/embed-player'
import {logger} from '#/logger'
import {NavigationProp} from 'lib/routes/types'
import {forceLTR} from 'lib/strings/bidi'
import {DM_SERVICE_HEADERS} from 'state/queries/messages/const'
import {useAgent} from 'state/session'
import {Button, ButtonText} from '#/components/Button'
import {StarterPack} from '#/components/icons/StarterPack'
import {Notification as StarterPackCard} from '#/components/StarterPack/StarterPackCard'
const MAX_AUTHORS = 5 const MAX_AUTHORS = 5
const EXPANDED_AUTHOR_EL_HEIGHT = 35 const EXPANDED_AUTHOR_EL_HEIGHT = 35
@ -222,7 +219,7 @@ let FeedItem = ({
backgroundColor: pal.colors.unreadNotifBg, backgroundColor: pal.colors.unreadNotifBg,
borderColor: pal.colors.unreadNotifBorder, borderColor: pal.colors.unreadNotifBorder,
}, },
{borderTopWidth: hideTopBorder ? 0 : hairlineWidth}, {borderTopWidth: hideTopBorder ? 0 : StyleSheet.hairlineWidth},
]} ]}
href={itemHref} href={itemHref}
noFeedback noFeedback

3
src/view/com/pager/TabBar.tsx
View File

@ -7,7 +7,6 @@ import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
import {PressableWithHover} from '../util/PressableWithHover' import {PressableWithHover} from '../util/PressableWithHover'
import {Text} from '../util/text/Text' import {Text} from '../util/text/Text'
import {DraggableScrollView} from './DraggableScrollView' import {DraggableScrollView} from './DraggableScrollView'
import hairlineWidth = StyleSheet.hairlineWidth
export interface TabBarProps { export interface TabBarProps {
testID?: string testID?: string
@ -208,6 +207,6 @@ const mobileStyles = StyleSheet.create({
left: 0, left: 0,
right: 0, right: 0,
top: '100%', top: '100%',
borderBottomWidth: hairlineWidth, borderBottomWidth: StyleSheet.hairlineWidth,
}, },
}) })

11
src/view/com/post-thread/PostThreadItem.tsx
View File

@ -44,7 +44,6 @@ import {PostEmbeds} from '../util/post-embeds'
import {PostMeta} from '../util/PostMeta' import {PostMeta} from '../util/PostMeta'
import {Text} from '../util/text/Text' import {Text} from '../util/text/Text'
import {PreviewableUserAvatar} from '../util/UserAvatar' import {PreviewableUserAvatar} from '../util/UserAvatar'
import hairlineWidth = StyleSheet.hairlineWidth
export function PostThreadItem({ export function PostThreadItem({
post, post,
@ -604,7 +603,7 @@ function PostOuterWrapper({
{ {
flexDirection: 'row', flexDirection: 'row',
paddingHorizontal: isMobile ? 10 : 6, paddingHorizontal: isMobile ? 10 : 6,
borderTopWidth: depth === 1 ? hairlineWidth : 0, borderTopWidth: depth === 1 ? StyleSheet.hairlineWidth : 0,
}, },
]}> ]}>
{Array.from(Array(depth - 1)).map((_, n: number) => ( {Array.from(Array(depth - 1)).map((_, n: number) => (
@ -699,7 +698,7 @@ function getThreadAuthor(
const styles = StyleSheet.create({ const styles = StyleSheet.create({
outer: { outer: {
borderTopWidth: hairlineWidth, borderTopWidth: StyleSheet.hairlineWidth,
paddingLeft: 8, paddingLeft: 8,
}, },
outerHighlighted: { outerHighlighted: {
@ -709,7 +708,7 @@ const styles = StyleSheet.create({
paddingRight: 8, paddingRight: 8,
}, },
outerHighlightedRoot: { outerHighlightedRoot: {
borderTopWidth: hairlineWidth, borderTopWidth: StyleSheet.hairlineWidth,
paddingTop: 16, paddingTop: 16,
}, },
noTopBorder: { noTopBorder: {
@ -761,8 +760,8 @@ const styles = StyleSheet.create({
expandedInfo: { expandedInfo: {
flexDirection: 'row', flexDirection: 'row',
padding: 10, padding: 10,
borderTopWidth: hairlineWidth, borderTopWidth: StyleSheet.hairlineWidth,
borderBottomWidth: hairlineWidth, borderBottomWidth: StyleSheet.hairlineWidth,
marginTop: 5, marginTop: 5,
marginBottom: 10, marginBottom: 10,
}, },

3
src/view/com/post/Post.tsx
View File

@ -37,7 +37,6 @@ import {PostMeta} from '../util/PostMeta'
import {Text} from '../util/text/Text' import {Text} from '../util/text/Text'
import {PreviewableUserAvatar} from '../util/UserAvatar' import {PreviewableUserAvatar} from '../util/UserAvatar'
import {UserInfoText} from '../util/UserInfoText' import {UserInfoText} from '../util/UserInfoText'
import hairlineWidth = StyleSheet.hairlineWidth
export function Post({ export function Post({
post, post,
@ -155,7 +154,7 @@ function PostInner({
style={[ style={[
styles.outer, styles.outer,
pal.border, pal.border,
!hideTopBorder && {borderTopWidth: hairlineWidth}, !hideTopBorder && {borderTopWidth: StyleSheet.hairlineWidth},
style, style,
]} ]}
onBeforePress={onBeforePress}> onBeforePress={onBeforePress}>

4
src/view/com/posts/FeedItem.tsx
View File

@ -46,7 +46,6 @@ import {PostMeta} from '../util/PostMeta'
import {Text} from '../util/text/Text' import {Text} from '../util/text/Text'
import {PreviewableUserAvatar} from '../util/UserAvatar' import {PreviewableUserAvatar} from '../util/UserAvatar'
import {AviFollowButton} from './AviFollowButton' import {AviFollowButton} from './AviFollowButton'
import hairlineWidth = StyleSheet.hairlineWidth
interface FeedItemProps { interface FeedItemProps {
record: AppBskyFeedPost.Record record: AppBskyFeedPost.Record
@ -205,7 +204,8 @@ let FeedItemInner = ({
isThreadLastChild || (!isThreadChild && !isThreadParent) isThreadLastChild || (!isThreadChild && !isThreadParent)
? 8 ? 8
: undefined, : undefined,
borderTopWidth: hideTopBorder || isThreadChild ? 0 : hairlineWidth, borderTopWidth:
hideTopBorder || isThreadChild ? 0 : StyleSheet.hairlineWidth,
}, },
] ]

5
src/view/com/profile/ProfileCard.tsx
View File

@ -23,12 +23,11 @@ import {
KnownFollowers, KnownFollowers,
shouldShowKnownFollowers, shouldShowKnownFollowers,
} from '#/components/KnownFollowers' } from '#/components/KnownFollowers'
import * as Pills from '#/components/Pills'
import {Link} from '../util/Link' import {Link} from '../util/Link'
import {Text} from '../util/text/Text' import {Text} from '../util/text/Text'
import {PreviewableUserAvatar} from '../util/UserAvatar' import {PreviewableUserAvatar} from '../util/UserAvatar'
import {FollowButton} from './FollowButton' import {FollowButton} from './FollowButton'
import hairlineWidth = StyleSheet.hairlineWidth
import * as Pills from '#/components/Pills'
export function ProfileCard({ export function ProfileCard({
testID, testID,
@ -217,7 +216,7 @@ export function ProfileCardWithFollowBtn({
const styles = StyleSheet.create({ const styles = StyleSheet.create({
outer: { outer: {
borderTopWidth: hairlineWidth, borderTopWidth: StyleSheet.hairlineWidth,
paddingHorizontal: 6, paddingHorizontal: 6,
paddingVertical: 4, paddingVertical: 4,
}, },

8
src/view/com/profile/ProfileSubpageHeader.tsx
View File

@ -15,15 +15,13 @@ import {makeProfileLink} from 'lib/routes/links'
import {NavigationProp} from 'lib/routes/types' import {NavigationProp} from 'lib/routes/types'
import {sanitizeHandle} from 'lib/strings/handles' import {sanitizeHandle} from 'lib/strings/handles'
import {isNative} from 'platform/detection' import {isNative} from 'platform/detection'
import {Menu_Stroke2_Corner0_Rounded as Menu} from '#/components/icons/Menu'
import {StarterPack} from '#/components/icons/StarterPack'
import {TextLink} from '../util/Link' import {TextLink} from '../util/Link'
import {LoadingPlaceholder} from '../util/LoadingPlaceholder' import {LoadingPlaceholder} from '../util/LoadingPlaceholder'
import {Text} from '../util/text/Text' import {Text} from '../util/text/Text'
import {UserAvatar, UserAvatarType} from '../util/UserAvatar' import {UserAvatar, UserAvatarType} from '../util/UserAvatar'
import {CenteredView} from '../util/Views' import {CenteredView} from '../util/Views'
import hairlineWidth = StyleSheet.hairlineWidth
import {Menu_Stroke2_Corner0_Rounded as Menu} from '#/components/icons/Menu'
import {StarterPack} from '#/components/icons/StarterPack'
export function ProfileSubpageHeader({ export function ProfileSubpageHeader({
isLoading, isLoading,
@ -84,7 +82,7 @@ export function ProfileSubpageHeader({
{ {
flexDirection: 'row', flexDirection: 'row',
alignItems: 'center', alignItems: 'center',
borderBottomWidth: hairlineWidth, borderBottomWidth: StyleSheet.hairlineWidth,
paddingTop: isNative ? 0 : 8, paddingTop: isNative ? 0 : 8,
paddingBottom: 8, paddingBottom: 8,
paddingHorizontal: isMobile ? 12 : 14, paddingHorizontal: isMobile ? 12 : 14,

3
src/view/com/util/LoadingPlaceholder.tsx
View File

@ -17,7 +17,6 @@ import {
Heart2_Stroke2_Corner0_Rounded as HeartIconOutline, Heart2_Stroke2_Corner0_Rounded as HeartIconOutline,
} from '#/components/icons/Heart2' } from '#/components/icons/Heart2'
import {Repost_Stroke2_Corner2_Rounded as Repost} from '#/components/icons/Repost' import {Repost_Stroke2_Corner2_Rounded as Repost} from '#/components/icons/Repost'
import hairlineWidth = StyleSheet.hairlineWidth
export function LoadingPlaceholder({ export function LoadingPlaceholder({
width, width,
@ -236,7 +235,7 @@ export function FeedLoadingPlaceholder({
{ {
paddingHorizontal: 12, paddingHorizontal: 12,
paddingVertical: 18, paddingVertical: 18,
borderTopWidth: showTopBorder ? hairlineWidth : 0, borderTopWidth: showTopBorder ? StyleSheet.hairlineWidth : 0,
}, },
pal.border, pal.border,
style, style,

7
src/view/com/util/ViewHeader.tsx
View File

@ -13,10 +13,9 @@ import {usePalette} from 'lib/hooks/usePalette'
import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
import {NavigationProp} from 'lib/routes/types' import {NavigationProp} from 'lib/routes/types'
import {useTheme} from '#/alf' import {useTheme} from '#/alf'
import {Menu_Stroke2_Corner0_Rounded as Menu} from '#/components/icons/Menu'
import {Text} from './text/Text' import {Text} from './text/Text'
import {CenteredView} from './Views' import {CenteredView} from './Views'
import hairlineWidth = StyleSheet.hairlineWidth
import {Menu_Stroke2_Corner0_Rounded as Menu} from '#/components/icons/Menu'
const BACK_HITSLOP = {left: 20, top: 20, right: 50, bottom: 20} const BACK_HITSLOP = {left: 20, top: 20, right: 50, bottom: 20}
@ -154,7 +153,7 @@ function DesktopWebHeader({
styles.desktopHeader, styles.desktopHeader,
pal.border, pal.border,
{ {
borderBottomWidth: showBorder ? hairlineWidth : 0, borderBottomWidth: showBorder ? StyleSheet.hairlineWidth : 0,
}, },
{display: 'flex', flexDirection: 'column'}, {display: 'flex', flexDirection: 'column'},
]}> ]}>
@ -243,7 +242,7 @@ const styles = StyleSheet.create({
marginRight: 'auto', marginRight: 'auto',
}, },
border: { border: {
borderBottomWidth: hairlineWidth, borderBottomWidth: StyleSheet.hairlineWidth,
}, },
titleContainer: { titleContainer: {
marginLeft: 'auto', marginLeft: 'auto',

9
src/view/com/util/Views.web.tsx
View File

@ -26,7 +26,6 @@ import Animated from 'react-native-reanimated'
import {usePalette} from 'lib/hooks/usePalette' import {usePalette} from 'lib/hooks/usePalette'
import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
import {addStyle} from 'lib/styles' import {addStyle} from 'lib/styles'
import hairlineWidth = StyleSheet.hairlineWidth
interface AddedProps { interface AddedProps {
desktopFixedHeight?: boolean | number desktopFixedHeight?: boolean | number
@ -50,8 +49,8 @@ export const CenteredView = React.forwardRef(function CenteredView(
} }
if (sideBorders) { if (sideBorders) {
style = addStyle(style, { style = addStyle(style, {
borderLeftWidth: hairlineWidth, borderLeftWidth: StyleSheet.hairlineWidth,
borderRightWidth: hairlineWidth, borderRightWidth: StyleSheet.hairlineWidth,
}) })
style = addStyle(style, pal.border) style = addStyle(style, pal.border)
} }
@ -163,8 +162,8 @@ export const ScrollView = React.forwardRef(function ScrollViewImpl(
const styles = StyleSheet.create({ const styles = StyleSheet.create({
contentContainer: { contentContainer: {
borderLeftWidth: hairlineWidth, borderLeftWidth: StyleSheet.hairlineWidth,
borderRightWidth: hairlineWidth, borderRightWidth: StyleSheet.hairlineWidth,
// @ts-ignore web only // @ts-ignore web only
minHeight: '100vh', minHeight: '100vh',
}, },

3
src/view/com/util/load-latest/LoadLatestBtn.tsx
View File

@ -13,7 +13,6 @@ import {clamp} from '#/lib/numbers'
import {colors} from '#/lib/styles' import {colors} from '#/lib/styles'
import {isWeb} from '#/platform/detection' import {isWeb} from '#/platform/detection'
import {useSession} from '#/state/session' import {useSession} from '#/state/session'
import hairlineWidth = StyleSheet.hairlineWidth
const AnimatedTouchableOpacity = const AnimatedTouchableOpacity =
Animated.createAnimatedComponent(TouchableOpacity) Animated.createAnimatedComponent(TouchableOpacity)
@ -74,7 +73,7 @@ const styles = StyleSheet.create({
// @ts-ignore 'fixed' is web only -prf // @ts-ignore 'fixed' is web only -prf
position: isWeb ? 'fixed' : 'absolute', position: isWeb ? 'fixed' : 'absolute',
left: 18, left: 18,
borderWidth: hairlineWidth, borderWidth: StyleSheet.hairlineWidth,
width: 52, width: 52,
height: 52, height: 52,
borderRadius: 26, borderRadius: 26,

5
src/view/com/util/post-embeds/QuoteEmbed.tsx
View File

@ -39,7 +39,6 @@ import {Link} from '../Link'
import {PostMeta} from '../PostMeta' import {PostMeta} from '../PostMeta'
import {Text} from '../text/Text' import {Text} from '../text/Text'
import {PostEmbeds} from '.' import {PostEmbeds} from '.'
import hairlineWidth = StyleSheet.hairlineWidth
export function MaybeQuoteEmbed({ export function MaybeQuoteEmbed({
embed, embed,
@ -262,7 +261,7 @@ const styles = StyleSheet.create({
marginTop: 8, marginTop: 8,
paddingVertical: 12, paddingVertical: 12,
paddingHorizontal: 12, paddingHorizontal: 12,
borderWidth: hairlineWidth, borderWidth: StyleSheet.hairlineWidth,
}, },
errorContainer: { errorContainer: {
flexDirection: 'row', flexDirection: 'row',
@ -272,7 +271,7 @@ const styles = StyleSheet.create({
marginTop: 8, marginTop: 8,
paddingVertical: 14, paddingVertical: 14,
paddingHorizontal: 14, paddingHorizontal: 14,
borderWidth: hairlineWidth, borderWidth: StyleSheet.hairlineWidth,
}, },
alert: { alert: {
marginBottom: 6, marginBottom: 6,

7
src/view/com/util/post-embeds/index.tsx
View File

@ -19,18 +19,17 @@ import {
} from '@atproto/api' } from '@atproto/api'
import {ImagesLightbox, useLightboxControls} from '#/state/lightbox' import {ImagesLightbox, useLightboxControls} from '#/state/lightbox'
import {useLargeAltBadgeEnabled} from '#/state/preferences/large-alt-badge'
import {usePalette} from 'lib/hooks/usePalette' import {usePalette} from 'lib/hooks/usePalette'
import {FeedSourceCard} from 'view/com/feeds/FeedSourceCard' import {FeedSourceCard} from 'view/com/feeds/FeedSourceCard'
import {atoms as a} from '#/alf' import {atoms as a} from '#/alf'
import {Embed as StarterPackCard} from '#/components/StarterPack/StarterPackCard'
import {ContentHider} from '../../../../components/moderation/ContentHider' import {ContentHider} from '../../../../components/moderation/ContentHider'
import {AutoSizedImage} from '../images/AutoSizedImage' import {AutoSizedImage} from '../images/AutoSizedImage'
import {ImageLayoutGrid} from '../images/ImageLayoutGrid' import {ImageLayoutGrid} from '../images/ImageLayoutGrid'
import {ExternalLinkEmbed} from './ExternalLinkEmbed' import {ExternalLinkEmbed} from './ExternalLinkEmbed'
import {ListEmbed} from './ListEmbed' import {ListEmbed} from './ListEmbed'
import {MaybeQuoteEmbed} from './QuoteEmbed' import {MaybeQuoteEmbed} from './QuoteEmbed'
import hairlineWidth = StyleSheet.hairlineWidth
import {useLargeAltBadgeEnabled} from '#/state/preferences/large-alt-badge'
import {Embed as StarterPackCard} from '#/components/StarterPack/StarterPackCard'
type Embed = type Embed =
| AppBskyEmbedRecord.View | AppBskyEmbedRecord.View
@ -205,7 +204,7 @@ const styles = StyleSheet.create({
fontWeight: 'bold', fontWeight: 'bold',
}, },
customFeedOuter: { customFeedOuter: {
borderWidth: hairlineWidth, borderWidth: StyleSheet.hairlineWidth,
borderRadius: 8, borderRadius: 8,
marginTop: 4, marginTop: 4,
paddingHorizontal: 12, paddingHorizontal: 12,

11
src/view/screens/Feeds.tsx
View File

@ -33,14 +33,13 @@ import {ViewHeader} from 'view/com/util/ViewHeader'
import {NoFollowingFeed} from '#/screens/Feeds/NoFollowingFeed' import {NoFollowingFeed} from '#/screens/Feeds/NoFollowingFeed'
import {NoSavedFeedsOfAnyType} from '#/screens/Feeds/NoSavedFeedsOfAnyType' import {NoSavedFeedsOfAnyType} from '#/screens/Feeds/NoSavedFeedsOfAnyType'
import {atoms as a, useTheme} from '#/alf' import {atoms as a, useTheme} from '#/alf'
import {Divider} from '#/components/Divider'
import * as FeedCard from '#/components/FeedCard'
import {IconCircle} from '#/components/IconCircle' import {IconCircle} from '#/components/IconCircle'
import {ChevronRight_Stroke2_Corner0_Rounded as ChevronRight} from '#/components/icons/Chevron'
import {FilterTimeline_Stroke2_Corner0_Rounded as FilterTimeline} from '#/components/icons/FilterTimeline' import {FilterTimeline_Stroke2_Corner0_Rounded as FilterTimeline} from '#/components/icons/FilterTimeline'
import {ListMagnifyingGlass_Stroke2_Corner0_Rounded} from '#/components/icons/ListMagnifyingGlass' import {ListMagnifyingGlass_Stroke2_Corner0_Rounded} from '#/components/icons/ListMagnifyingGlass'
import {ListSparkle_Stroke2_Corner0_Rounded} from '#/components/icons/ListSparkle' import {ListSparkle_Stroke2_Corner0_Rounded} from '#/components/icons/ListSparkle'
import hairlineWidth = StyleSheet.hairlineWidth
import {Divider} from '#/components/Divider'
import * as FeedCard from '#/components/FeedCard'
import {ChevronRight_Stroke2_Corner0_Rounded as ChevronRight} from '#/components/icons/Chevron'
import * as ListCard from '#/components/ListCard' import * as ListCard from '#/components/ListCard'
type Props = NativeStackScreenProps<CommonNavigatorParams, 'Feeds'> type Props = NativeStackScreenProps<CommonNavigatorParams, 'Feeds'>
@ -793,13 +792,13 @@ const styles = StyleSheet.create({
paddingHorizontal: 16, paddingHorizontal: 16,
paddingVertical: 14, paddingVertical: 14,
gap: 12, gap: 12,
borderBottomWidth: hairlineWidth, borderBottomWidth: StyleSheet.hairlineWidth,
}, },
savedFeedMobile: { savedFeedMobile: {
paddingVertical: 10, paddingVertical: 10,
}, },
offlineSlug: { offlineSlug: {
borderWidth: hairlineWidth, borderWidth: StyleSheet.hairlineWidth,
borderRadius: 4, borderRadius: 4,
paddingHorizontal: 4, paddingHorizontal: 4,
paddingVertical: 2, paddingVertical: 2,

8
src/view/screens/Lists.tsx
View File

@ -16,7 +16,6 @@ import {MyLists} from '#/view/com/lists/MyLists'
import {Button} from 'view/com/util/forms/Button' import {Button} from 'view/com/util/forms/Button'
import {SimpleViewHeader} from 'view/com/util/SimpleViewHeader' import {SimpleViewHeader} from 'view/com/util/SimpleViewHeader'
import {Text} from 'view/com/util/text/Text' import {Text} from 'view/com/util/text/Text'
import hairlineWidth = StyleSheet.hairlineWidth
type Props = NativeStackScreenProps<CommonNavigatorParams, 'Lists'> type Props = NativeStackScreenProps<CommonNavigatorParams, 'Lists'>
export function ListsScreen({}: Props) { export function ListsScreen({}: Props) {
@ -55,8 +54,11 @@ export function ListsScreen({}: Props) {
style={[ style={[
pal.border, pal.border,
isMobile isMobile
? {borderBottomWidth: hairlineWidth} ? {borderBottomWidth: StyleSheet.hairlineWidth}
: {borderLeftWidth: hairlineWidth, borderRightWidth: hairlineWidth}, : {
borderLeftWidth: StyleSheet.hairlineWidth,
borderRightWidth: StyleSheet.hairlineWidth,
},
]}> ]}>
<View style={{flex: 1}}> <View style={{flex: 1}}>
<Text type="title-lg" style={[pal.text, {fontWeight: 'bold'}]}> <Text type="title-lg" style={[pal.text, {fontWeight: 'bold'}]}>

5
src/view/screens/ProfileList.tsx
View File

@ -65,7 +65,6 @@ import {useDialogControl} from '#/components/Dialog'
import * as Prompt from '#/components/Prompt' import * as Prompt from '#/components/Prompt'
import {ReportDialog, useReportDialogControl} from '#/components/ReportDialog' import {ReportDialog, useReportDialogControl} from '#/components/ReportDialog'
import {RichText} from '#/components/RichText' import {RichText} from '#/components/RichText'
import hairlineWidth = StyleSheet.hairlineWidth
const SECTION_TITLES_CURATE = ['Posts', 'About'] const SECTION_TITLES_CURATE = ['Posts', 'About']
const SECTION_TITLES_MOD = ['About'] const SECTION_TITLES_MOD = ['About']
@ -803,7 +802,7 @@ const AboutSection = React.forwardRef<SectionRef, AboutSectionProps>(
<View <View
style={[ style={[
{ {
borderTopWidth: hairlineWidth, borderTopWidth: StyleSheet.hairlineWidth,
padding: isMobile ? 14 : 20, padding: isMobile ? 14 : 20,
gap: 12, gap: 12,
}, },
@ -954,7 +953,7 @@ function ErrorScreen({error}: {error: string}) {
marginTop: 10, marginTop: 10,
paddingHorizontal: 18, paddingHorizontal: 18,
paddingVertical: 14, paddingVertical: 14,
borderTopWidth: hairlineWidth, borderTopWidth: StyleSheet.hairlineWidth,
}, },
]}> ]}>
<Text type="title-lg" style={[pal.text, s.mb10]}> <Text type="title-lg" style={[pal.text, s.mb10]}>

11
src/view/screens/SavedFeeds.tsx
View File

@ -32,7 +32,6 @@ import {NoFollowingFeed} from '#/screens/Feeds/NoFollowingFeed'
import {NoSavedFeedsOfAnyType} from '#/screens/Feeds/NoSavedFeedsOfAnyType' import {NoSavedFeedsOfAnyType} from '#/screens/Feeds/NoSavedFeedsOfAnyType'
import {atoms as a, useTheme} from '#/alf' import {atoms as a, useTheme} from '#/alf'
import {FilterTimeline_Stroke2_Corner0_Rounded as FilterTimeline} from '#/components/icons/FilterTimeline' import {FilterTimeline_Stroke2_Corner0_Rounded as FilterTimeline} from '#/components/icons/FilterTimeline'
import hairlineWidth = StyleSheet.hairlineWidth
const HITSLOP_TOP = { const HITSLOP_TOP = {
top: 20, top: 20,
@ -93,7 +92,8 @@ export function SavedFeeds({}: Props) {
<ViewHeader title={_(msg`Edit My Feeds`)} showOnDesktop showBorder /> <ViewHeader title={_(msg`Edit My Feeds`)} showOnDesktop showBorder />
<ScrollView style={s.flex1} contentContainerStyle={[styles.noBorder]}> <ScrollView style={s.flex1} contentContainerStyle={[styles.noBorder]}>
{noSavedFeedsOfAnyType && ( {noSavedFeedsOfAnyType && (
<View style={[pal.border, {borderBottomWidth: hairlineWidth}]}> <View
style={[pal.border, {borderBottomWidth: StyleSheet.hairlineWidth}]}>
<NoSavedFeedsOfAnyType /> <NoSavedFeedsOfAnyType />
</View> </View>
)} )}
@ -135,7 +135,8 @@ export function SavedFeeds({}: Props) {
)} )}
{noFollowingFeed && ( {noFollowingFeed && (
<View style={[pal.border, {borderBottomWidth: hairlineWidth}]}> <View
style={[pal.border, {borderBottomWidth: StyleSheet.hairlineWidth}]}>
<NoFollowingFeed /> <NoFollowingFeed />
</View> </View>
)} )}
@ -437,12 +438,12 @@ const styles = StyleSheet.create({
paddingHorizontal: 14, paddingHorizontal: 14,
paddingTop: 20, paddingTop: 20,
paddingBottom: 10, paddingBottom: 10,
borderBottomWidth: hairlineWidth, borderBottomWidth: StyleSheet.hairlineWidth,
}, },
itemContainer: { itemContainer: {
flexDirection: 'row', flexDirection: 'row',
alignItems: 'center', alignItems: 'center',
borderBottomWidth: hairlineWidth, borderBottomWidth: StyleSheet.hairlineWidth,
}, },
footerText: { footerText: {
paddingHorizontal: 26, paddingHorizontal: 26,

5
src/view/screens/Settings/index.tsx
View File

@ -62,13 +62,12 @@ import {UserAvatar} from 'view/com/util/UserAvatar'
import {ScrollView} from 'view/com/util/Views' import {ScrollView} from 'view/com/util/Views'
import {DeactivateAccountDialog} from '#/screens/Settings/components/DeactivateAccountDialog' import {DeactivateAccountDialog} from '#/screens/Settings/components/DeactivateAccountDialog'
import {useTheme} from '#/alf' import {useTheme} from '#/alf'
import {atoms as a} from '#/alf'
import {useDialogControl} from '#/components/Dialog' import {useDialogControl} from '#/components/Dialog'
import {BirthDateSettingsDialog} from '#/components/dialogs/BirthDateSettings' import {BirthDateSettingsDialog} from '#/components/dialogs/BirthDateSettings'
import {navigate, resetToTab} from '#/Navigation' import {navigate, resetToTab} from '#/Navigation'
import {Email2FAToggle} from './Email2FAToggle' import {Email2FAToggle} from './Email2FAToggle'
import {ExportCarDialog} from './ExportCarDialog' import {ExportCarDialog} from './ExportCarDialog'
import hairlineWidth = StyleSheet.hairlineWidth
import {atoms as a} from '#/alf'
function SettingsAccountCard({ function SettingsAccountCard({
account, account,
@ -326,7 +325,7 @@ export function SettingsScreen({}: Props) {
showBackButton={isMobile} showBackButton={isMobile}
style={[ style={[
pal.border, pal.border,
{borderBottomWidth: hairlineWidth}, {borderBottomWidth: StyleSheet.hairlineWidth},
!isMobile && {borderLeftWidth: 1, borderRightWidth: 1}, !isMobile && {borderLeftWidth: 1, borderRightWidth: 1},
]}> ]}>
<View style={{flex: 1}}> <View style={{flex: 1}}>

3
src/view/shell/bottom-bar/BottomBarStyles.tsx
View File

@ -1,7 +1,6 @@
import {StyleSheet} from 'react-native' import {StyleSheet} from 'react-native'
import {colors} from 'lib/styles' import {colors} from 'lib/styles'
import hairlineWidth = StyleSheet.hairlineWidth
export const styles = StyleSheet.create({ export const styles = StyleSheet.create({
bottomBar: { bottomBar: {
@ -10,7 +9,7 @@ export const styles = StyleSheet.create({
left: 0, left: 0,
right: 0, right: 0,
flexDirection: 'row', flexDirection: 'row',
borderTopWidth: hairlineWidth, borderTopWidth: StyleSheet.hairlineWidth,
paddingLeft: 5, paddingLeft: 5,
paddingRight: 10, paddingRight: 10,
}, },

7
src/view/shell/desktop/RightNav.tsx
View File

@ -11,10 +11,9 @@ import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries'
import {s} from 'lib/styles' import {s} from 'lib/styles'
import {TextLink} from 'view/com/util/Link' import {TextLink} from 'view/com/util/Link'
import {Text} from 'view/com/util/text/Text' import {Text} from 'view/com/util/text/Text'
import {ProgressGuideList} from '#/components/ProgressGuide/List'
import {DesktopFeeds} from './Feeds' import {DesktopFeeds} from './Feeds'
import {DesktopSearch} from './Search' import {DesktopSearch} from './Search'
import hairlineWidth = StyleSheet.hairlineWidth
import {ProgressGuideList} from '#/components/ProgressGuide/List'
export function DesktopRightNav({routeName}: {routeName: string}) { export function DesktopRightNav({routeName}: {routeName: string}) {
const pal = usePalette('default') const pal = usePalette('default')
@ -135,8 +134,8 @@ const styles = StyleSheet.create({
marginBottom: 10, marginBottom: 10,
}, },
desktopFeedsContainer: { desktopFeedsContainer: {
borderTopWidth: hairlineWidth, borderTopWidth: StyleSheet.hairlineWidth,
borderBottomWidth: hairlineWidth, borderBottomWidth: StyleSheet.hairlineWidth,
marginTop: 18, marginTop: 18,
marginBottom: 18, marginBottom: 18,
}, },