mirror of
https://github.com/Jellify-Music/App.git
synced 2026-03-18 03:00:35 -05:00
styling fixes for android around text
This commit is contained in:
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -13,7 +13,7 @@ export function RunTimeSeconds({
|
||||
}): React.JSX.Element {
|
||||
return (
|
||||
<Paragraph
|
||||
fontWeight={'bold'}
|
||||
fontWeight={'$6'}
|
||||
color={color}
|
||||
textAlign={alignment}
|
||||
fontVariant={['tabular-nums']}
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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}
|
||||
|
||||
@@ -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>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -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 () => {}} />
|
||||
|
||||
@@ -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 },
|
||||
}
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -121,7 +121,7 @@ export default function ServerAuthentication({
|
||||
}
|
||||
}}
|
||||
>
|
||||
<Paragraph fontWeight={'bold'} color={'$primary'}>
|
||||
<Paragraph fontWeight={'$6'} color={'$primary'}>
|
||||
Sign in
|
||||
</Paragraph>
|
||||
</Button>
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user