.

screens/Private/TimerScreen/TimerScreen.js

 import React, { Component } from 'react';
 import { View, StyleSheet, FlatList, ScrollView, TouchableHighlight, Modal } from 'react-native';
-import { Switch, Button, Tab, Tabs, ScrollableTab, Icon, Fab, Text, Picker } from 'native-base';
+import { Switch, Button, Tab, Tabs, ScrollableTab, Icon, Fab, Text } from 'native-base';
 import { HeaderButtons, Item as HeaderItem } from 'react-navigation-header-buttons';
 import IoniconsHeaderButton from '../../../components/IoniconsHeaderButton';
 import { color, theme } from '../../../constants/Styles';
@@ -315,18 +315,7 @@ export default class TimerScreen extends Component {
 					visible={this.state.filterOpen}
 				>
 					<View style={{ flex: 1, backgroundColor: 'rgba(0,0,0,0.5)' }}>
-						<ScrollView
-							contentContainerStyle={{
-								flex: 0.7,
-								top: height * 0.3,
-								paddingTop: 20,
-								paddingBottom: 18,
-								paddingHorizontal: 25,
-								backgroundColor: color.white,
-								borderTopLeftRadius: 10,
-								borderTopRightRadius: 10,
-							}}
-						>
+						<ScrollView contentContainerStyle={styles.filterModal}>
 							<View
 								style={[
 									theme.rowContainer,
@@ -396,13 +385,7 @@ export default class TimerScreen extends Component {
 								ItemSeparatorComponent={() => <View style={theme.mt1} />}
 								renderItem={({ item, index }) => (
 									<CheckBox
-										containerStyle={{
-											border: 0,
-											borderColor: 'transparent',
-											backgroundColor: color.white,
-											padding: 0,
-											margin: 0,
-										}}
+										containerStyle={styles.checkboxContainer}
 										fontFamily={'Avenir-Roman'}
 										textStyle={{ fontWeight: 'normal', color: color.darkGrey }}
 										title={'Sub breaker ' + (index + 1)}
@@ -410,7 +393,7 @@ export default class TimerScreen extends Component {
 										checkedIcon={
 											<Icon name="checkbox" style={{ color: color.primary, fontSize: 26 }} />
 										}
-										uncheckedIcon={<Icon name="square-outline" style={{ color: '#9b9b9b' }} />}
+										uncheckedIcon={<Icon name="square-outline" style={{ color: color.grey }} />}
 										onPress={() => this.setState({ checked: !this.state.checked })}
 									/>
 								)}
@@ -467,4 +450,20 @@ const styles = StyleSheet.create({
 		paddingVertical: 10,
 		justifyContent: 'space-between',
 	},
+	filterModal: {
+		flex: 0.7,
+		top: height * 0.3,
+		paddingTop: 20,
+		paddingBottom: 18,
+		paddingHorizontal: 25,
+		backgroundColor: color.white,
+		borderTopLeftRadius: 10,
+		borderTopRightRadius: 10,
+	},
+	checkboxContainer: {
+		borderColor: 'transparent',
+		backgroundColor: color.white,
+		padding: 0,
+		margin: 0,
+	},
 });