From b4120d99d6b4b771faa50f45630ee9c9d5aa24c0 Mon Sep 17 00:00:00 2001
From: Julia Friesel <julia.friesel@gmail.com>
Date: Tue, 21 Aug 2018 15:05:52 +0200
Subject: [PATCH] Stylin'

---
 components/settings.js | 22 +++++++++++++++++++---
 styles/index.js        |  5 ++++-
 2 files changed, 23 insertions(+), 4 deletions(-)

diff --git a/components/settings.js b/components/settings.js
index 42788388..118dafb6 100644
--- a/components/settings.js
+++ b/components/settings.js
@@ -32,7 +32,7 @@ export default class Settings extends Component {
           <TouchableOpacity
             onPress={openShareDialogAndExport}
             style={styles.settingsButton}>
-            <Text>{labels.export.button}</Text>
+            <Text style={styles.settingsButtonText}>{labels.export.button}</Text>
           </TouchableOpacity>
         </View>
         <View style={styles.settingsSegment}>
@@ -41,7 +41,7 @@ export default class Settings extends Component {
           <TouchableOpacity
             onPress={openImportDialogAndImport}
             style={styles.settingsButton}>
-            <Text>{labels.import.button}</Text>
+            <Text style={styles.settingsButtonText}>{labels.import.button}</Text>
           </TouchableOpacity>
         </View>
       </ScrollView>
@@ -82,7 +82,7 @@ class TempSlider extends Component {
 
   render() {
     return (
-      <View>
+      <View style={{alignItems: 'center'}}>
         <Text>{`${labels.tempScale.min} ${this.state.min}`}</Text>
         <Text>{`${labels.tempScale.max} ${this.state.max}`}</Text>
         <Slider
@@ -92,6 +92,22 @@ class TempSlider extends Component {
           step={0.5}
           onValuesChange={this.onValuesChange}
           onValuesChangeFinish={this.onValuesChangeFinish}
+          selectedStyle={{
+            backgroundColor: 'darkgrey',
+          }}
+          unselectedStyle={{
+            backgroundColor: 'silver',
+          }}
+          trackStyle={{
+            height:10,
+          }}
+          markerStyle={{
+            backgroundColor: '#351c4d',
+            height: 20,
+            width: 20,
+            borderRadius: 100,
+            marginTop: 10
+          }}
         />
       </View>
     )
diff --git a/styles/index.js b/styles/index.js
index c0995ed0..44ea90d3 100644
--- a/styles/index.js
+++ b/styles/index.js
@@ -98,9 +98,12 @@ export default StyleSheet.create({
     fontWeight: 'bold'
   },
   settingsButton: {
-    backgroundColor: 'darkgrey',
+    backgroundColor: '#351c4d',
     padding: 10,
     alignItems: 'center',
     margin: 10
+  },
+  settingsButtonText: {
+    color: 'white'
   }
 })
\ No newline at end of file
-- 
GitLab