Small ui fixes (#419)
This commit is contained in:
enahum
GitHub
parent
9538132006
commit
5c5a4f5102
8 changed files with 14 additions and 165 deletions
|
|
@ -74,7 +74,7 @@ export default class ChannelDrawerItem extends PureComponent {
|
|||
isActive={isActive}
|
||||
hasUnread={hasUnread}
|
||||
membersCount={channel.display_name.split(',').length}
|
||||
size={12}
|
||||
size={16}
|
||||
status={channel.status}
|
||||
theme={theme}
|
||||
type={channel.type}
|
||||
|
|
|
|||
|
|
@ -226,10 +226,12 @@ class ChannelDrawerList extends Component {
|
|||
};
|
||||
|
||||
renderSectionAction = (styles, action) => {
|
||||
const {theme} = this.props;
|
||||
return (
|
||||
<TouchableHighlight
|
||||
style={styles.actionContainer}
|
||||
onPress={action}
|
||||
underlayColor={changeOpacity(theme.sidebarTextHoverBg, 0.5)}
|
||||
>
|
||||
<MaterialIcon
|
||||
name='add'
|
||||
|
|
@ -286,6 +288,7 @@ class ChannelDrawerList extends Component {
|
|||
<TouchableHighlight
|
||||
style={styles.settingsContainer}
|
||||
onPress={() => this.props.actions.openSettingsModal()}
|
||||
underlayColor={changeOpacity(theme.sidebarHeaderBg, 0.5)}
|
||||
>
|
||||
<AwesomeIcon
|
||||
name='cog'
|
||||
|
|
|
|||
|
|
@ -55,14 +55,14 @@ function channelIcon(props) {
|
|||
return (
|
||||
<Icon
|
||||
name='lock'
|
||||
style={[style.icon, unreadIcon, activeIcon, {fontSize: size + 1}]}
|
||||
style={[style.icon, unreadIcon, activeIcon, {fontSize: size}]}
|
||||
/>
|
||||
);
|
||||
} else if (type === Constants.GM_CHANNEL) {
|
||||
return (
|
||||
<View style={style.groupContainer}>
|
||||
<View style={[style.groupBox, unreadGroupBox, activeGroupBox, {width: (size + 2), height: (size + 3)}]}>
|
||||
<Text style={[style.group, unreadGroup, activeGroup, {fontSize: (size - 2)}]}>
|
||||
<View style={[style.groupBox, unreadGroupBox, activeGroupBox, {width: size, height: size}]}>
|
||||
<Text style={[style.group, unreadGroup, activeGroup, {fontSize: (size - 6)}]}>
|
||||
{membersCount}
|
||||
</Text>
|
||||
</View>
|
||||
|
|
|
|||
|
|
@ -109,11 +109,11 @@ export default class PushNotification extends PureComponent {
|
|||
|
||||
if (data.channel_id !== currentChannelId) {
|
||||
MessageBarManager.showAlert({
|
||||
alertType: 'info',
|
||||
alertType: 'extra',
|
||||
avatar: icon,
|
||||
avatarStyle: {borderRadius: 10, width: 20, height: 20},
|
||||
message,
|
||||
stylesheetInfo: {backgroundColor: changeOpacity('#000', 0.9)},
|
||||
stylesheetExtra: {backgroundColor: changeOpacity('#000', 0.9)},
|
||||
messageStyle: {color: 'white', fontSize: 13},
|
||||
viewTopInset: 15,
|
||||
viewBottomInset: 15,
|
||||
|
|
|
|||
|
|
@ -1,155 +0,0 @@
|
|||
// Copyright (c) 2016 Mattermost, Inc. All Rights Reserved.
|
||||
// See License.txt for license information.
|
||||
|
||||
import React from 'react';
|
||||
|
||||
import {Image, Navigator, StyleSheet, Text, TouchableOpacity} from 'react-native';
|
||||
import SelectServerView from './select_server_view';
|
||||
|
||||
import menuImage from 'images/menu.png';
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
container: {
|
||||
flexDirection: 'row',
|
||||
flex: 1
|
||||
},
|
||||
|
||||
button: {
|
||||
backgroundColor: 'white',
|
||||
padding: 15,
|
||||
borderBottomWidth: StyleSheet.hairlineWidth,
|
||||
borderBottomColor: '#CDCDCD'
|
||||
},
|
||||
buttonText: {
|
||||
fontSize: 17,
|
||||
fontWeight: '500'
|
||||
},
|
||||
navBar: {
|
||||
backgroundColor: 'white',
|
||||
flexDirection: 'row'
|
||||
},
|
||||
navBarText: {
|
||||
fontSize: 16,
|
||||
marginVertical: 10
|
||||
},
|
||||
navBarTitleText: {
|
||||
color: '#373E4D',
|
||||
fontWeight: '500',
|
||||
marginVertical: 9
|
||||
},
|
||||
navBarLeftButton: {
|
||||
paddingLeft: 10
|
||||
},
|
||||
navBarRightButton: {
|
||||
paddingRight: 10
|
||||
},
|
||||
navBarButtonText: {
|
||||
color: '#5890FF'
|
||||
},
|
||||
|
||||
activityIndicator: {
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
padding: 8,
|
||||
flex: 1
|
||||
},
|
||||
|
||||
menuImage: {
|
||||
height: 30,
|
||||
width: 30
|
||||
}
|
||||
});
|
||||
|
||||
const NavigationBarRouteMapper = {
|
||||
LeftButton(route, navigator, index, navState) {
|
||||
if (index === 0) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const previousRoute = navState.routeStack[index - 1];
|
||||
|
||||
if (previousRoute.signin) {
|
||||
return (
|
||||
<TouchableOpacity
|
||||
onPress={() => navigator.pop()}
|
||||
style={styles.navBarLeftButton}
|
||||
>
|
||||
<Image
|
||||
style={styles.menuImage}
|
||||
source={menuImage}
|
||||
/>
|
||||
</TouchableOpacity>
|
||||
);
|
||||
}
|
||||
|
||||
let title = null;
|
||||
if (previousRoute.root) {
|
||||
title = 'Server';
|
||||
} else if (previousRoute.channels) {
|
||||
title = 'Channels';
|
||||
}
|
||||
|
||||
return (
|
||||
<TouchableOpacity
|
||||
onPress={() => navigator.pop()}
|
||||
style={styles.navBarLeftButton}
|
||||
>
|
||||
<Text style={[styles.navBarText, styles.navBarButtonText]}>
|
||||
{'< ' + title}
|
||||
</Text>
|
||||
</TouchableOpacity>
|
||||
);
|
||||
},
|
||||
|
||||
RightButton() {
|
||||
return null;
|
||||
},
|
||||
|
||||
Title(route) {
|
||||
return (
|
||||
<Text style={[styles.navBarText, styles.navBarTitleText]}>
|
||||
{route.title}
|
||||
</Text>
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
export default class RootNavigator extends React.Component {
|
||||
renderScene = (route, navigator) => {
|
||||
if (route.root) {
|
||||
return (
|
||||
<SelectServerView
|
||||
onProceed={() => {
|
||||
navigator.push({signin: true});
|
||||
}}
|
||||
/>
|
||||
);
|
||||
} else if (route.signin) {
|
||||
// return (
|
||||
// <LoginView
|
||||
// onSignIn={() => {
|
||||
// navigator.push({title: 'Team Selection', });
|
||||
// }}
|
||||
// />
|
||||
// );
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<Navigator
|
||||
style={styles.container}
|
||||
initialRouteStack={[{title: 'Mattermost Lite', root: true}]}
|
||||
renderScene={this.renderScene}
|
||||
navigationBar={
|
||||
<Navigator.NavigationBar
|
||||
routeMapper={NavigationBarRouteMapper}
|
||||
style={styles.navBar}
|
||||
/>
|
||||
}
|
||||
/>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
@ -10,7 +10,7 @@ import {
|
|||
TouchableOpacity,
|
||||
View
|
||||
} from 'react-native';
|
||||
import Icon from 'react-native-vector-icons/FontAwesome';
|
||||
import Icon from 'react-native-vector-icons/Ionicons';
|
||||
|
||||
import Badge from 'app/components/badge';
|
||||
import {getTheme} from 'app/selectors/preferences';
|
||||
|
|
@ -101,7 +101,7 @@ class ChannelDrawerButton extends PureComponent {
|
|||
>
|
||||
<View style={[style.wrapper, {opacity: this.state.opacity, zIndex: 30}]}>
|
||||
<Icon
|
||||
name='bars'
|
||||
name='md-menu'
|
||||
size={25}
|
||||
color={this.props.theme.sidebarHeaderTextColor}
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@ function channelInfoHeader(props) {
|
|||
<ChanneIcon
|
||||
isInfo={true}
|
||||
membersCount={memberCount - 1}
|
||||
size={15}
|
||||
size={16}
|
||||
status={status}
|
||||
theme={theme}
|
||||
type={type}
|
||||
|
|
|
|||
|
|
@ -103,6 +103,7 @@ export default class SettingsItem extends PureComponent {
|
|||
const getStyleSheet = makeStyleSheetFromTheme((theme) => {
|
||||
return StyleSheet.create({
|
||||
container: {
|
||||
backgroundColor: theme.centerChannelBg,
|
||||
height: 51,
|
||||
flexDirection: 'column',
|
||||
justifyContent: 'center'
|
||||
|
|
@ -116,7 +117,7 @@ const getStyleSheet = makeStyleSheetFromTheme((theme) => {
|
|||
},
|
||||
icon: {
|
||||
color: theme.linkColor,
|
||||
fontSize: 16
|
||||
fontSize: 20
|
||||
},
|
||||
label: {
|
||||
color: theme.centerChannelColor,
|
||||
|
|
|
|||
Loading…
Reference in a new issue