diff --git a/src/compose/ModeViews/PrivateBox.js b/src/compose/ModeViews/PrivateBox.js
index dd3d8f460cb..42c94bc85b5 100644
--- a/src/compose/ModeViews/PrivateBox.js
+++ b/src/compose/ModeViews/PrivateBox.js
@@ -5,14 +5,7 @@ import {
import TagInput from 'react-native-tag-input';
import PeopleAutocomplete from '../../autocomplete/PeopleAutocomplete';
-
-const styles = StyleSheet.create({
- privateInput: {
- flexDirection: 'row',
- alignItems: 'center',
- flex: 1
- },
-});
+import styles from '../../styles/index';
export default class PrivateBox extends Component {
constructor() {
@@ -69,13 +62,14 @@ export default class PrivateBox extends Component {
}
render() {
+ const tagStyle = StyleSheet.flatten(styles.tagInput);
const { text } = this.state;
const inputProps = {
keyboardType: 'default',
placeholder: 'Enter names',
autoFocus: true,
onChangeText: this.handleChangeText,
- value: text
+ value: text,
};
return (
@@ -88,8 +82,8 @@ export default class PrivateBox extends Component {
diff --git a/src/compose/ModeViews/StreamBox.js b/src/compose/ModeViews/StreamBox.js
index ed582e47bbd..4987c292a49 100644
--- a/src/compose/ModeViews/StreamBox.js
+++ b/src/compose/ModeViews/StreamBox.js
@@ -1,8 +1,9 @@
import React, { Component } from 'react';
import {
- View, TextInput, Text, StyleSheet
+ View, Text, StyleSheet
} from 'react-native';
import StreamAutocomplete from '../../autocomplete/StreamAutocomplete';
+import Input from '../../common/Input';
const styles = StyleSheet.create({
streamInputWrapper: {
@@ -47,7 +48,7 @@ export default class StreamBox extends Component {
{autoComplete &&
}
- {
@@ -62,7 +63,7 @@ export default class StreamBox extends Component {
autoFocus
/>
{'>'}
- { this.operandInput = component; }}
style={styles.topicInput}
placeholder={'Topic'}
diff --git a/src/styles/theme.js b/src/styles/theme.js
index eb16d8c4cfa..cc7e5d2bde1 100644
--- a/src/styles/theme.js
+++ b/src/styles/theme.js
@@ -1,7 +1,7 @@
import { Platform } from 'react-native';
-import { BORDER_COLOR, BRAND_COLOR, STATUSBAR_HEIGHT, CONTROL_SIZE, NAVBAR_HEIGHT } from './';
+import { BORDER_COLOR, BRAND_COLOR, STATUSBAR_HEIGHT, CONTROL_SIZE, NAVBAR_HEIGHT, HALF_COLOR } from './';
-export default ({ color, backgroundColor, borderColor }) => ({
+export default ({ color, backgroundColor, borderColor, tagColor }) => ({
color: {
color,
},
@@ -140,4 +140,13 @@ export default ({ color, backgroundColor, borderColor }) => ({
height: CONTROL_SIZE * 3 / 4,
borderColor: BORDER_COLOR,
},
+ tagInput: {
+ backgroundColor: tagColor,
+ color,
+ },
+ privateInput: {
+ flexDirection: 'row',
+ alignItems: 'center',
+ flex: 1
+ },
});
diff --git a/src/styles/themeDark.js b/src/styles/themeDark.js
index 38f73d3f7cf..517be190fc0 100644
--- a/src/styles/themeDark.js
+++ b/src/styles/themeDark.js
@@ -2,4 +2,5 @@ export default ({
color: '#d5d9dd',
backgroundColor: '#212D3B',
borderColor: 'rgba(127, 127, 127, 0.25)',
+ tagColor: '#2c3e50'
});
diff --git a/src/styles/themeLight.js b/src/styles/themeLight.js
index e2e3164ffbe..6a4657c0962 100644
--- a/src/styles/themeLight.js
+++ b/src/styles/themeLight.js
@@ -2,4 +2,5 @@ export default ({
color: '#333',
backgroundColor: 'white',
borderColor: 'rgba(127, 127, 127, 0.25)',
+ tagColor: '#ecf0f1'
});