styling fixes for android around text

This commit is contained in:
Violet Caulfield
2026-03-06 23:20:39 -06:00
parent 708d0a4106
commit 58d35ec8e9
17 changed files with 29 additions and 35 deletions

View File

@@ -65,7 +65,7 @@ export default function AlbumTrackListHeader({ album }: { album: BaseItemDto }):
{album.AlbumArtists && album.AlbumArtists.length > 0 && (
<Paragraph
fontWeight={'bold'}
fontWeight={'$6'}
color={'$primary'}
onPress={() =>
navigation.navigate('Artist', {
@@ -106,14 +106,13 @@ export default function AlbumTrackListHeader({ album }: { album: BaseItemDto }):
<Button
flex={1}
icon={() => <Icon small name='play' color='$background' />}
borderWidth={'$0.25'}
borderRadius={'$4'}
backgroundColor={'$primary'}
paddingRight={'$5'}
onPress={() => playAlbum(false)}
{...BUTTON_PRESS_STYLES}
>
<Paragraph fontWeight={'bold'} color={'$background'}>
<Paragraph fontWeight={'$6'} color={'$background'}>
Play
</Paragraph>
</Button>
@@ -127,7 +126,7 @@ export default function AlbumTrackListHeader({ album }: { album: BaseItemDto }):
onPress={() => playAlbum(true)}
{...BUTTON_PRESS_STYLES}
>
<Paragraph fontWeight={'bold'} color={'$primary'}>
<Paragraph fontWeight={'$6'} color={'$primary'}>
Shuffle
</Paragraph>
</Button>

View File

@@ -70,7 +70,7 @@ export default function ArtistHeader(): React.JSX.Element {
<YStack paddingHorizontal={'$2'}>
<XStack alignItems='flex-end' justifyContent='flex-start' flex={1}>
<XStack alignItems='center' flex={1} justifyContent='space-between'>
<H5 flexGrow={1} fontWeight={'bold'}>
<H5 flexGrow={1} fontWeight={'$6'}>
{artist.Name}
</H5>
</XStack>
@@ -105,7 +105,7 @@ export default function ArtistHeader(): React.JSX.Element {
})
}
>
<Text fontWeight={'bold'} fontSize={'$4'}>{`View Tracks`}</Text>
<Text fontWeight={'$6'} fontSize={'$4'}>{`View Tracks`}</Text>
<Icon name='chevron-right' small />
</XStack>

View File

@@ -51,7 +51,7 @@ export function InstantMixButton({
borderWidth={'$1'}
{...BUTTON_PRESS_STYLES}
>
<Text fontWeight={'bold'} color={'$success'}>
<Text fontWeight={'$6'} color={'$success'}>
Mix
</Text>
</Button>

View File

@@ -196,7 +196,7 @@ export default function LibrarySelector({
testID='let_s_go_button'
flex={1}
>
<Paragraph color={'$primary'} fontWeight={'bold'}>
<Paragraph color={'$primary'} fontWeight={'$6'}>
{primaryButtonText}
</Paragraph>
</Button>

View File

@@ -12,7 +12,7 @@ export default function FlashListStickyHeader({ text }: { text: string }): React
borderColor={'$primary'}
backgroundColor={'$background'}
>
<Text margin={'$2'} fontSize={'$4'} fontWeight={'bold'} color={'$primary'}>
<Text margin={'$2'} fontSize={'$4'} fontWeight={'$6'} color={'$primary'}>
{text}
</Text>
</XStack>

View File

@@ -13,7 +13,7 @@ export function RunTimeSeconds({
}): React.JSX.Element {
return (
<Paragraph
fontWeight={'bold'}
fontWeight={'$6'}
color={color}
textAlign={alignment}
fontVariant={['tabular-nums']}

View File

@@ -98,11 +98,7 @@ export default function Scrubber({ onSeekComplete }: ScrubberProps = {}): React.
{/* Time display and quality badge */}
<XStack alignItems='center' justifyContent='space-between'>
<YStack flex={1}>
<Paragraph
fontWeight={'bold'}
textAlign={'left'}
fontVariant={['tabular-nums']}
>
<Paragraph fontWeight={'$6'} textAlign={'left'} fontVariant={['tabular-nums']}>
{positionRunTimeText}
</Paragraph>
</YStack>

View File

@@ -136,7 +136,7 @@ export default function SongInfo({ swipeX }: SongInfoProps = {}): React.JSX.Elem
key={`${currentTrack?.id ?? 'no-track'}-title`}
>
<Paragraph
fontWeight={'bold'}
fontWeight={'$6'}
fontSize={'$6'}
onPress={handleTrackPress}
{...ICON_PRESS_STYLES}

View File

@@ -122,31 +122,30 @@ function PlaylistHeaderControls({
<XStack justifyContent='center' marginHorizontal={'$2'} gap={'$2'}>
<Button
flex={1}
{...BUTTON_PRESS_STYLES}
borderColor={'$primary'}
borderWidth={'$1'}
backgroundColor={'$primary'}
onPress={async () => await playPlaylist(false)}
icon={<Icon name='play' color='$primary' small />}
icon={<Icon name='play' color='$background' small />}
{...BUTTON_PRESS_STYLES}
>
<Text bold color={'$primary'}>
<Text bold color={'$background'}>
Play
</Text>
</Button>
<InstantMixButton item={playlist} navigation={navigation} />
<Button
flex={1}
{...BUTTON_PRESS_STYLES}
borderColor={'$primary'}
borderWidth={'$1'}
onPress={async () => await playPlaylist(true)}
icon={<Icon name='shuffle' color='$primary' small />}
{...BUTTON_PRESS_STYLES}
>
<Text bold color={'$primary'}>
Shuffle
</Text>
</Button>
<InstantMixButton item={playlist} navigation={navigation} />
</XStack>
)
}

View File

@@ -39,7 +39,7 @@ export default function Queue({
headerRight: () => {
return (
<XStack gap='$1'>
<Text color={'$warning'} marginVertical={'auto'} fontWeight={'bold'}>
<Text color={'$warning'} marginVertical={'auto'} fontWeight={'$6'}>
Clear
</Text>
<Icon name='broom' color='$warning' onPress={async () => {}} />

View File

@@ -1,7 +1,7 @@
import { ViewStyle } from 'tamagui'
export const BUTTON_PRESS_STYLES: Pick<ViewStyle, 'pressStyle' | 'hoverStyle' | 'transition'> = {
transition: 'bouncy',
transition: 'quick',
pressStyle: { scale: 0.875 },
hoverStyle: { scale: 0.925 },
}

View File

@@ -253,7 +253,7 @@ export default function GenreSelectionScreen({
size='$3'
onPress={handleSave}
>
<Paragraph fontWeight={'bold'} color={'$primary'}>
<Paragraph fontWeight={'$6'} color={'$primary'}>
Apply
</Paragraph>
</Button>

View File

@@ -121,7 +121,7 @@ export default function ServerAuthentication({
}
}}
>
<Paragraph fontWeight={'bold'} color={'$primary'}>
<Paragraph fontWeight={'$6'} color={'$primary'}>
Sign in
</Paragraph>
</Button>

View File

@@ -119,7 +119,7 @@ export default function StorageSelectionModal({
disabled={isDeleting}
backgroundColor='$danger'
>
<Paragraph fontWeight={'bold'} color={'$background'}>
<Paragraph fontWeight={'$6'} color={'$background'}>
Delete downloads
</Paragraph>
</Button>

View File

@@ -244,7 +244,7 @@ const StorageSummaryCard = ({
onPress={onDeleteAll}
icon={() => <Icon name='broom' color='$background' small />}
>
<Paragraph fontWeight={'bold'} color={'$background'}>
<Paragraph fontWeight={'$6'} color={'$background'}>
Clear All
</Paragraph>
</Button>
@@ -341,7 +341,7 @@ const CleanupSuggestionsRow = ({
}
onPress={() => onApply(suggestion)}
>
<Paragraph fontWeight={'bold'} color={'$background'}>
<Paragraph fontWeight={'$6'} color={'$background'}>
Free {formatBytes(suggestion.freedBytes)}
</Paragraph>
</Button>
@@ -486,7 +486,7 @@ const SelectionReviewBanner = ({
onPress={onDelete}
>
<Paragraph
fontWeight={'bold'}
fontWeight={'$6'}
color={'$warning'}
>{`Clear ${formatBytes(selectedBytes)}`}</Paragraph>
</Button>

View File

@@ -285,7 +285,7 @@ export default function YearSelectionScreen({
size='$3'
onPress={handleSave}
>
<Paragraph color={'$primary'} fontWeight={'bold'}>
<Paragraph color={'$primary'} fontWeight={'$6'}>
Apply
</Paragraph>
</Button>

View File

@@ -150,14 +150,14 @@ function ContextSheetHeader(item: BaseItemDto): React.JSX.Element {
return (
<YStack gap={'$1'} marginTop={'$4'} alignItems='center'>
<TextTicker {...TextTickerConfig}>
<Paragraph fontWeight={'bold'} fontSize={'$6'}>
<Paragraph fontWeight={'$6'} fontSize={'$6'}>
{getItemName(item)}
</Paragraph>
</TextTicker>
{(item.ArtistItems?.length ?? 0) > 0 && (
<TextTicker {...TextTickerConfig}>
<Paragraph fontWeight={'bold'} fontSize={'$4'}>
<Paragraph fontWeight={'$6'} fontSize={'$4'}>
{`${formatArtistNames(item.ArtistItems?.map((artist) => getItemName(artist)) ?? [])}`}
</Paragraph>
</TextTicker>