javier/jellyfin-audio-player
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Resolve dark mode styling issues

Browse Source
This commit is contained in:
Lei Nelissen
2020-08-25 10:39:21 +02:00
parent 91344300c8
commit ea11a7d317
6 changed files with 7 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/Colors.ios.tsx
View File

@@ -22,5 +22,6 @@ export const colors = StyleSheet.create({
}, },
input: { input: {
backgroundColor: PlatformColor('systemGray5Color'), backgroundColor: PlatformColor('systemGray5Color'),
color: PlatformColor('label'),
} }
}); });

2
src/components/Modal.tsx
View File

@@ -11,8 +11,6 @@ const Background = styled.View`
const Container = styled.View` const Container = styled.View`
border-radius: 20px; border-radius: 20px;
flex: 1; flex: 1;
justify-content: center;
align-items: center;
`; `;
const Modal: React.FC = ({ children }) => { const Modal: React.FC = ({ children }) => {

2
src/screens/Player/index.tsx
View File

@@ -13,8 +13,6 @@ const styles = StyleSheet.create({
} }
}); });
console.log(JSON.stringify(styles));
export default function Player() { export default function Player() {
return ( return (
<ScrollView contentContainerStyle={styles.inner} style={styles.outer}> <ScrollView contentContainerStyle={styles.inner} style={styles.outer}>

10
src/screens/Settings/index.tsx
View File

@@ -1,6 +1,5 @@
import React, { useCallback } from 'react'; import React, { useCallback } from 'react';
import { View, Text, SafeAreaView, Button } from 'react-native'; import { View, Text, SafeAreaView, Button, StyleSheet } from 'react-native';
import { Picker } from '@react-native-community/picker';
import { ScrollView } from 'react-native-gesture-handler'; import { ScrollView } from 'react-native-gesture-handler';
import styled from 'styled-components/native'; import styled from 'styled-components/native';
import { useSelector } from 'react-redux'; import { useSelector } from 'react-redux';
@@ -16,7 +15,6 @@ const InputContainer = styled.View`
`; `;
const Input = styled.TextInput` const Input = styled.TextInput`
background-color: #fbfbfb;
padding: 15px; padding: 15px;
margin-top: 5px; margin-top: 5px;
border-radius: 5px; border-radius: 5px;
@@ -34,15 +32,15 @@ export default function Settings() {
<Header style={colors.text}>Settings</Header> <Header style={colors.text}>Settings</Header>
<InputContainer> <InputContainer>
<Text style={colors.text}>Jellyfin Server URL</Text> <Text style={colors.text}>Jellyfin Server URL</Text>
<Input placeholder="https://jellyfin.yourserver.com/" value={jellyfin?.uri} editable={false} /> <Input placeholder="https://jellyfin.yourserver.com/" value={jellyfin?.uri} editable={false} style={colors.input} />
</InputContainer> </InputContainer>
<InputContainer> <InputContainer>
<Text style={colors.text}>Jellyfin Access Token</Text> <Text style={colors.text}>Jellyfin Access Token</Text>
<Input placeholder="deadbeefdeadbeefdeadbeef" value={jellyfin?.access_token} editable={false} /> <Input placeholder="deadbeefdeadbeefdeadbeef" value={jellyfin?.access_token} editable={false} style={colors.input} />
</InputContainer> </InputContainer>
<InputContainer> <InputContainer>
<Text style={colors.text}>Jellyfin User ID</Text> <Text style={colors.text}>Jellyfin User ID</Text>
<Input placeholder="deadbeefdeadbeefdeadbeef" value={jellyfin?.user_id} editable={false} /> <Input placeholder="deadbeefdeadbeefdeadbeef" value={jellyfin?.user_id} editable={false} style={colors.input} />
</InputContainer> </InputContainer>
<Button title="Set Jellyfin server" onPress={handleClick} color={THEME_COLOR} /> <Button title="Set Jellyfin server" onPress={handleClick} color={THEME_COLOR} />
{/* The bitrate setting is hidden for now, since Jellyfin does not appear to support custom bitrates */} {/* The bitrate setting is hidden for now, since Jellyfin does not appear to support custom bitrates */}

4
src/screens/modals/SetJellyfinServer/index.tsx
View File

@@ -32,7 +32,7 @@ export default function SetJellyfinServer() {
onCredentialsRetrieved={saveCredentials} onCredentialsRetrieved={saveCredentials}
/> />
) : ( ) : (
<View style={{ padding: 20 }}> <View style={{ padding: 20, flex: 1, justifyContent: 'center', alignItems: 'center' }}>
<Text style={colors.text}> <Text style={colors.text}>
Please enter your Jellyfin server URL. Make sure to include the protocol and port Please enter your Jellyfin server URL. Make sure to include the protocol and port
</Text> </Text>
@@ -43,7 +43,7 @@ export default function SetJellyfinServer() {
keyboardType="url" keyboardType="url"
autoCapitalize="none" autoCapitalize="none"
autoCorrect={false} autoCorrect={false}
style={colors.input} style={{ ...colors.input, width: '100%' }}
/> />
<Button <Button
title="Set server" title="Set server"

2
src/utility/JellyfinApi.ts
View File

@@ -47,8 +47,6 @@ export function generateTrack(track: AlbumTrack, credentials: Credentials): Trac
const trackParams = new URLSearchParams(trackOptions).toString(); const trackParams = new URLSearchParams(trackOptions).toString();
const url = encodeURI(`${credentials?.uri}/Audio/${track.Id}/universal.mp3?${trackParams}`); const url = encodeURI(`${credentials?.uri}/Audio/${track.Id}/universal.mp3?${trackParams}`);
console.log(url);
return { return {
id: track.Id, id: track.Id,
url, url,