Creepso/NuvioStreaming
1
0
Fork 0
mirror of https://github.com/tapframe/NuvioStreaming.git synced 2026-04-26 02:52:53 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Update SubtitleModals to conditionally display font size and background toggle sections based on custom subtitles setting. Adjust custom subtitle container position for better alignment.

Browse source
This commit is contained in:
tapframe 2025-07-08 15:54:48 +05:30
parent 897294fdfc
commit 65ece6a32a
2 changed files with 31 additions and 27 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

54
src/components/player/modals/SubtitleModals.tsx
View file

@ -169,28 +169,29 @@ export const SubtitleModals: React.FC<SubtitleModalsProps> = ({
contentContainerStyle={{ padding: 20, paddingBottom: 40 }} contentContainerStyle={{ padding: 20, paddingBottom: 40 }}
showsVerticalScrollIndicator={false} showsVerticalScrollIndicator={false}
> >
{/* Font Size Section */} {/* Font Size Section - Only show for custom subtitles */}
<View style={{ marginBottom: 30 }}> {useCustomSubtitles && (
<Text style={{ <View style={{ marginBottom: 30 }}>
color: 'rgba(255, 255, 255, 0.7)', <Text style={{
fontSize: 14, color: 'rgba(255, 255, 255, 0.7)',
fontWeight: '600', fontSize: 14,
marginBottom: 15, fontWeight: '600',
textTransform: 'uppercase', marginBottom: 15,
letterSpacing: 0.5, textTransform: 'uppercase',
}}> letterSpacing: 0.5,
Font Size }}>
</Text> Font Size
</Text>
<View style={{ <View style={{
flexDirection: 'row', flexDirection: 'row',
alignItems: 'center', alignItems: 'center',
justifyContent: 'space-between', justifyContent: 'space-between',
backgroundColor: 'rgba(255, 255, 255, 0.05)', backgroundColor: 'rgba(255, 255, 255, 0.05)',
borderRadius: 16, borderRadius: 16,
padding: 16, padding: 16,
}}> }}>
<TouchableOpacity <TouchableOpacity
style={{ style={{
width: 40, width: 40,
height: 40, height: 40,
@ -226,10 +227,12 @@ export const SubtitleModals: React.FC<SubtitleModalsProps> = ({
<MaterialIcons name="add" size={20} color="#FFFFFF" /> <MaterialIcons name="add" size={20} color="#FFFFFF" />
</TouchableOpacity> </TouchableOpacity>
</View> </View>
</View> </View>
)}
{/* Background Toggle Section */} {/* Background Toggle Section - Only show for custom subtitles */}
<View style={{ marginBottom: 30 }}> {useCustomSubtitles && (
<View style={{ marginBottom: 30 }}>
<Text style={{ <Text style={{
color: 'rgba(255, 255, 255, 0.7)', color: 'rgba(255, 255, 255, 0.7)',
fontSize: 14, fontSize: 14,
@ -277,7 +280,8 @@ export const SubtitleModals: React.FC<SubtitleModalsProps> = ({
}} /> }} />
</TouchableOpacity> </TouchableOpacity>
</View> </View>
</View> </View>
)}
{/* Built-in Subtitles */} {/* Built-in Subtitles */}
{vlcTextTracks.length > 0 && ( {vlcTextTracks.length > 0 && (

2
src/components/player/utils/playerStyles.ts
View file

@ -530,7 +530,7 @@ export const styles = StyleSheet.create({
}, },
customSubtitleContainer: { customSubtitleContainer: {
position: 'absolute', position: 'absolute',
bottom: 40, // Position above controls and progress bar bottom: 20, // Position lower, closer to bottom
left: 20, left: 20,
right: 20, right: 20,
alignItems: 'center', alignItems: 'center',