alteropen/streamyfin
1
0
Fork 0
mirror of https://github.com/streamyfin/streamyfin.git synced 2026-03-29 13:31:51 +01:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

fix(tv): font sizes

Browse Source
This commit is contained in:
Fredrik Burmester
2026-01-19 20:01:00 +01:00
parent f4445c4152
commit 2b36d4bc76
35 changed files with 437 additions and 167 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
components/tv/settings/TVLogoutButton.tsx
View File

@@ -2,6 +2,7 @@ import React from "react";
import { useTranslation } from "react-i18next";
import { Animated, Pressable, View } from "react-native";
import { Text } from "@/components/common/Text";
import { TVTypography } from "@/constants/TVTypography";
import { useTVFocusAnimation } from "../hooks/useTVFocusAnimation";
export interface TVLogoutButtonProps {
@@ -48,7 +49,7 @@ export const TVLogoutButton: React.FC<TVLogoutButtonProps> = ({
>
<Text
style={{
fontSize: 20,
fontSize: TVTypography.body,
fontWeight: "bold",
color: "#FFFFFF",
}}

3
components/tv/settings/TVSectionHeader.tsx
View File

@@ -1,5 +1,6 @@
import React from "react";
import { Text } from "@/components/common/Text";
import { TVTypography } from "@/constants/TVTypography";
export interface TVSectionHeaderProps {
title: string;
@@ -8,7 +9,7 @@ export interface TVSectionHeaderProps {
export const TVSectionHeader: React.FC<TVSectionHeaderProps> = ({ title }) => (
<Text
style={{
fontSize: 16,
fontSize: TVTypography.callout,
fontWeight: "600",
color: "#9CA3AF",
textTransform: "uppercase",

7
components/tv/settings/TVSettingsOptionButton.tsx
View File

@@ -2,6 +2,7 @@ import { Ionicons } from "@expo/vector-icons";
import React from "react";
import { Animated, Pressable, View } from "react-native";
import { Text } from "@/components/common/Text";
import { TVTypography } from "@/constants/TVTypography";
import { useTVFocusAnimation } from "../hooks/useTVFocusAnimation";
export interface TVSettingsOptionButtonProps {
@@ -48,11 +49,13 @@ export const TVSettingsOptionButton: React.FC<TVSettingsOptionButtonProps> = ({
},
]}
>
<Text style={{ fontSize: 20, color: "#FFFFFF" }}>{label}</Text>
<Text style={{ fontSize: TVTypography.body, color: "#FFFFFF" }}>
{label}
</Text>
<View style={{ flexDirection: "row", alignItems: "center" }}>
<Text
style={{
fontSize: 18,
fontSize: TVTypography.callout,
color: "#9CA3AF",
marginRight: 12,
}}

7
components/tv/settings/TVSettingsRow.tsx
View File

@@ -2,6 +2,7 @@ import { Ionicons } from "@expo/vector-icons";
import React from "react";
import { Animated, Pressable, View } from "react-native";
import { Text } from "@/components/common/Text";
import { TVTypography } from "@/constants/TVTypography";
import { useTVFocusAnimation } from "../hooks/useTVFocusAnimation";
export interface TVSettingsRowProps {
@@ -50,11 +51,13 @@ export const TVSettingsRow: React.FC<TVSettingsRowProps> = ({
},
]}
>
<Text style={{ fontSize: 20, color: "#FFFFFF" }}>{label}</Text>
<Text style={{ fontSize: TVTypography.body, color: "#FFFFFF" }}>
{label}
</Text>
<View style={{ flexDirection: "row", alignItems: "center" }}>
<Text
style={{
fontSize: 18,
fontSize: TVTypography.callout,
color: "#9CA3AF",
marginRight: showChevron ? 12 : 0,
}}

7
components/tv/settings/TVSettingsStepper.tsx
View File

@@ -2,6 +2,7 @@ import { Ionicons } from "@expo/vector-icons";
import React from "react";
import { Animated, Pressable, View } from "react-native";
import { Text } from "@/components/common/Text";
import { TVTypography } from "@/constants/TVTypography";
import { useTVFocusAnimation } from "../hooks/useTVFocusAnimation";
export interface TVSettingsStepperProps {
@@ -53,7 +54,9 @@ export const TVSettingsStepper: React.FC<TVSettingsStepperProps> = ({
focusable={!disabled}
>
<Animated.View style={labelAnim.animatedStyle}>
<Text style={{ fontSize: 20, color: "#FFFFFF" }}>{label}</Text>
<Text style={{ fontSize: TVTypography.body, color: "#FFFFFF" }}>
{label}
</Text>
</Animated.View>
</Pressable>
<View style={{ flexDirection: "row", alignItems: "center" }}>
@@ -86,7 +89,7 @@ export const TVSettingsStepper: React.FC<TVSettingsStepperProps> = ({
</Pressable>
<Text
style={{
fontSize: 18,
fontSize: TVTypography.callout,
color: "#FFFFFF",
minWidth: 60,
textAlign: "center",

11
components/tv/settings/TVSettingsTextInput.tsx
View File

@@ -1,6 +1,7 @@
import React, { useRef } from "react";
import { Animated, Pressable, TextInput } from "react-native";
import { Text } from "@/components/common/Text";
import { TVTypography } from "@/constants/TVTypography";
import { useTVFocusAnimation } from "../hooks/useTVFocusAnimation";
export interface TVSettingsTextInputProps {
@@ -53,7 +54,13 @@ export const TVSettingsTextInput: React.FC<TVSettingsTextInputProps> = ({
},
]}
>
<Text style={{ fontSize: 16, color: "#9CA3AF", marginBottom: 8 }}>
<Text
style={{
fontSize: TVTypography.callout,
color: "#9CA3AF",
marginBottom: 8,
}}
>
{label}
</Text>
<TextInput
@@ -67,7 +74,7 @@ export const TVSettingsTextInput: React.FC<TVSettingsTextInputProps> = ({
autoCapitalize='none'
autoCorrect={false}
style={{
fontSize: 18,
fontSize: TVTypography.body,
color: "#FFFFFF",
backgroundColor: "rgba(255, 255, 255, 0.05)",
borderRadius: 8,

5
components/tv/settings/TVSettingsToggle.tsx
View File

@@ -1,6 +1,7 @@
import React from "react";
import { Animated, Pressable, View } from "react-native";
import { Text } from "@/components/common/Text";
import { TVTypography } from "@/constants/TVTypography";
import { useTVFocusAnimation } from "../hooks/useTVFocusAnimation";
export interface TVSettingsToggleProps {
@@ -47,7 +48,9 @@ export const TVSettingsToggle: React.FC<TVSettingsToggleProps> = ({
},
]}
>
<Text style={{ fontSize: 20, color: "#FFFFFF" }}>{label}</Text>
<Text style={{ fontSize: TVTypography.body, color: "#FFFFFF" }}>
{label}
</Text>
<View
style={{
width: 56,