Updating search bar styling (#626)
* Updating search bar styling * Updating search bar styling * Removing unusued variable
This commit is contained in:
parent
7e2192a052
commit
c9306a815a
6 changed files with 39 additions and 41 deletions
|
|
@ -155,15 +155,15 @@ class ChannelsList extends Component {
|
|||
placeholder={intl.formatMessage({id: 'mobile.channel_drawer.search', defaultMessage: 'Jump to a conversation'})}
|
||||
cancelTitle={intl.formatMessage({id: 'mobile.post.cancel', defaultMessage: 'Cancel'})}
|
||||
backgroundColor='transparent'
|
||||
inputHeight={Platform.OS === 'android' ? 32 : 33}
|
||||
inputHeight={33}
|
||||
inputStyle={{
|
||||
backgroundColor: changeOpacity(theme.sidebarText, 0.4),
|
||||
color: theme.sidebarText,
|
||||
backgroundColor: changeOpacity(theme.sidebarHeaderTextColor, 0.2),
|
||||
color: theme.sidebarHeaderTextColor,
|
||||
fontSize: 13
|
||||
}}
|
||||
placeholderTextColor={changeOpacity(theme.sidebarText, 0.5)}
|
||||
tintColorSearch={changeOpacity(theme.sidebarText, 0.5)}
|
||||
tintColorDelete={changeOpacity(theme.sidebarText, 0.5)}
|
||||
placeholderTextColor={changeOpacity(theme.sidebarHeaderTextColor, 0.5)}
|
||||
tintColorSearch={changeOpacity(theme.sidebarHeaderTextColor, 0.8)}
|
||||
tintColorDelete={changeOpacity(theme.sidebarHeaderTextColor, 0.5)}
|
||||
titleCancelColor={theme.sidebarHeaderTextColor}
|
||||
onSearchButtonPress={this.onSearch}
|
||||
onCancelButtonPress={this.cancelSearch}
|
||||
|
|
@ -331,6 +331,7 @@ const getStyleSheet = makeStyleSheetFromTheme((theme) => {
|
|||
height: 32,
|
||||
justifyContent: 'center',
|
||||
marginLeft: 16,
|
||||
marginRight: 10,
|
||||
paddingHorizontal: 6
|
||||
},
|
||||
switcherDivider: {
|
||||
|
|
|
|||
|
|
@ -115,10 +115,10 @@ export default class SearchBarIos extends Component {
|
|||
<Search
|
||||
{...this.props}
|
||||
ref='search'
|
||||
placeholderCollapsedMargin={this.state.placeholderWidth}
|
||||
placeholderExpandedMargin={20}
|
||||
searchIconCollapsedMargin={this.state.placeholderWidth + 10}
|
||||
searchIconExpandedMargin={10}
|
||||
placeholderCollapsedMargin={this.state.placeholderWidth - 15}
|
||||
placeholderExpandedMargin={30}
|
||||
searchIconCollapsedMargin={this.state.placeholderWidth}
|
||||
searchIconExpandedMargin={15}
|
||||
shadowVisible={false}
|
||||
onCancel={this.onCancel}
|
||||
onChangeText={this.onChangeText}
|
||||
|
|
|
|||
|
|
@ -6,7 +6,6 @@ import PropTypes from 'prop-types';
|
|||
import {injectIntl, intlShape} from 'react-intl';
|
||||
import {
|
||||
Alert,
|
||||
Platform,
|
||||
InteractionManager,
|
||||
StyleSheet,
|
||||
View
|
||||
|
|
@ -245,16 +244,16 @@ class ChannelAddMembers extends PureComponent {
|
|||
placeholder={formatMessage({id: 'search_bar.search', defaultMessage: 'Search'})}
|
||||
cancelTitle={formatMessage({id: 'mobile.post.cancel', defaultMessage: 'Cancel'})}
|
||||
backgroundColor='transparent'
|
||||
inputHeight={30}
|
||||
inputHeight={33}
|
||||
inputStyle={{
|
||||
backgroundColor: '#fff',
|
||||
color: changeOpacity('#000', 0.5),
|
||||
backgroundColor: changeOpacity(theme.sidebarHeaderTextColor, 0.2),
|
||||
color: theme.sidebarHeaderTextColor,
|
||||
fontSize: 13
|
||||
}}
|
||||
placeholderTextColor={changeOpacity('#000', 0.5)}
|
||||
tintColorSearch={changeOpacity('#000', 0.5)}
|
||||
tintColorDelete={changeOpacity('#000', 0.5)}
|
||||
titleCancelColor={Platform.OS === 'android' ? changeOpacity('#000', 0.5) : theme.sidebarHeaderBg}
|
||||
placeholderTextColor={changeOpacity(theme.sidebarHeaderTextColor, 0.5)}
|
||||
tintColorSearch={changeOpacity(theme.sidebarHeaderTextColor, 0.8)}
|
||||
tintColorDelete={changeOpacity(theme.sidebarHeaderTextColor, 0.5)}
|
||||
titleCancelColor={theme.sidebarHeaderTextColor}
|
||||
onChangeText={this.searchProfiles}
|
||||
onSearchButtonPress={this.searchProfiles}
|
||||
onCancelButtonPress={this.cancelSearch}
|
||||
|
|
|
|||
|
|
@ -5,7 +5,6 @@ import React, {PureComponent} from 'react';
|
|||
import PropTypes from 'prop-types';
|
||||
import {
|
||||
Alert,
|
||||
Platform,
|
||||
InteractionManager,
|
||||
StyleSheet,
|
||||
View
|
||||
|
|
@ -300,16 +299,16 @@ class ChannelMembers extends PureComponent {
|
|||
placeholder={formatMessage({id: 'search_bar.search', defaultMessage: 'Search'})}
|
||||
cancelTitle={formatMessage({id: 'mobile.post.cancel', defaultMessage: 'Cancel'})}
|
||||
backgroundColor='transparent'
|
||||
inputHeight={30}
|
||||
inputHeight={33}
|
||||
inputStyle={{
|
||||
backgroundColor: '#fff',
|
||||
color: changeOpacity('#000', 0.5),
|
||||
backgroundColor: changeOpacity(theme.sidebarHeaderTextColor, 0.2),
|
||||
color: theme.sidebarHeaderTextColor,
|
||||
fontSize: 13
|
||||
}}
|
||||
placeholderTextColor={changeOpacity('#000', 0.5)}
|
||||
tintColorSearch={changeOpacity('#000', 0.5)}
|
||||
tintColorDelete={changeOpacity('#000', 0.5)}
|
||||
titleCancelColor={Platform.OS === 'android' ? changeOpacity('#000', 0.5) : theme.sidebarHeaderBg}
|
||||
placeholderTextColor={changeOpacity(theme.sidebarHeaderTextColor, 0.5)}
|
||||
tintColorSearch={changeOpacity(theme.sidebarHeaderTextColor, 0.8)}
|
||||
tintColorDelete={changeOpacity(theme.sidebarHeaderTextColor, 0.5)}
|
||||
titleCancelColor={theme.sidebarHeaderTextColor}
|
||||
onChangeText={this.searchProfiles}
|
||||
onSearchButtonPress={this.searchProfiles}
|
||||
onCancelButtonPress={this.cancelSearch}
|
||||
|
|
|
|||
|
|
@ -258,16 +258,16 @@ class MoreChannels extends PureComponent {
|
|||
placeholder={formatMessage({id: 'search_bar.search', defaultMessage: 'Search'})}
|
||||
cancelTitle={formatMessage({id: 'mobile.post.cancel', defaultMessage: 'Cancel'})}
|
||||
backgroundColor='transparent'
|
||||
inputHeight={30}
|
||||
inputHeight={33}
|
||||
inputStyle={{
|
||||
backgroundColor: '#fff',
|
||||
color: changeOpacity('#000', 0.5),
|
||||
backgroundColor: changeOpacity(theme.sidebarHeaderTextColor, 0.2),
|
||||
color: theme.sidebarHeaderTextColor,
|
||||
fontSize: 13
|
||||
}}
|
||||
placeholderTextColor={changeOpacity('#000', 0.5)}
|
||||
tintColorSearch={changeOpacity('#000', 0.5)}
|
||||
tintColorDelete={changeOpacity('#000', 0.5)}
|
||||
titleCancelColor={Platform.OS === 'android' ? changeOpacity('#000', 0.5) : theme.sidebarHeaderBg}
|
||||
placeholderTextColor={changeOpacity(theme.sidebarHeaderTextColor, 0.5)}
|
||||
tintColorSearch={changeOpacity(theme.sidebarHeaderTextColor, 0.8)}
|
||||
tintColorDelete={changeOpacity(theme.sidebarHeaderTextColor, 0.5)}
|
||||
titleCancelColor={theme.sidebarHeaderTextColor}
|
||||
onChangeText={this.searchProfiles}
|
||||
onSearchButtonPress={this.searchProfiles}
|
||||
onCancelButtonPress={this.cancelSearch}
|
||||
|
|
|
|||
|
|
@ -5,7 +5,6 @@ import React, {PureComponent} from 'react';
|
|||
import PropTypes from 'prop-types';
|
||||
import {injectIntl, intlShape} from 'react-intl';
|
||||
import {
|
||||
Platform,
|
||||
InteractionManager,
|
||||
StyleSheet,
|
||||
View
|
||||
|
|
@ -170,16 +169,16 @@ class MoreDirectMessages extends PureComponent {
|
|||
placeholder={formatMessage({id: 'search_bar.search', defaultMessage: 'Search'})}
|
||||
cancelTitle={formatMessage({id: 'mobile.post.cancel', defaultMessage: 'Cancel'})}
|
||||
backgroundColor='transparent'
|
||||
inputHeight={30}
|
||||
inputHeight={33}
|
||||
inputStyle={{
|
||||
backgroundColor: '#fff',
|
||||
color: changeOpacity('#000', 0.5),
|
||||
backgroundColor: changeOpacity(theme.sidebarHeaderTextColor, 0.2),
|
||||
color: theme.sidebarHeaderTextColor,
|
||||
fontSize: 13
|
||||
}}
|
||||
placeholderTextColor={changeOpacity('#000', 0.5)}
|
||||
tintColorSearch={changeOpacity('#000', 0.5)}
|
||||
tintColorDelete={changeOpacity('#000', 0.5)}
|
||||
titleCancelColor={Platform.OS === 'android' ? changeOpacity('#000', 0.5) : theme.sidebarHeaderBg}
|
||||
placeholderTextColor={changeOpacity(theme.sidebarHeaderTextColor, 0.5)}
|
||||
tintColorSearch={changeOpacity(theme.sidebarHeaderTextColor, 0.8)}
|
||||
tintColorDelete={changeOpacity(theme.sidebarHeaderTextColor, 0.5)}
|
||||
titleCancelColor={theme.sidebarHeaderTextColor}
|
||||
onChangeText={this.searchProfiles}
|
||||
onSearchButtonPress={this.searchProfiles}
|
||||
onCancelButtonPress={this.cancelSearch}
|
||||
|
|
|
|||
Loading…
Reference in a new issue