Change avatars to square format (#73)

This commit is contained in:
Rodrigo Nascimento 2017-11-13 18:51:36 -02:00 committed by Guilherme Gazzo
parent 0a00878499
commit 282a663b60
7 changed files with 1137 additions and 101 deletions

View File

@ -35,7 +35,7 @@ exports[`render channel 1`] = `
Array [ Array [
Object { Object {
"alignItems": "center", "alignItems": "center",
"borderRadius": 20, "borderRadius": 4,
"height": 40, "height": 40,
"justifyContent": "center", "justifyContent": "center",
"overflow": "hidden", "overflow": "hidden",
@ -310,7 +310,7 @@ exports[`render unread +999 1`] = `
}, },
Object { Object {
"backgroundColor": "#3F51B5", "backgroundColor": "#3F51B5",
"borderRadius": 20, "borderRadius": 4,
"height": 40, "height": 40,
"width": 40, "width": 40,
}, },
@ -442,7 +442,7 @@ exports[`render unread 1`] = `
}, },
Object { Object {
"backgroundColor": "#3F51B5", "backgroundColor": "#3F51B5",
"borderRadius": 20, "borderRadius": 4,
"height": 40, "height": 40,
"width": 40, "width": 40,
}, },
@ -574,7 +574,7 @@ exports[`renders correctly 1`] = `
}, },
Object { Object {
"backgroundColor": "#3F51B5", "backgroundColor": "#3F51B5",
"borderRadius": 20, "borderRadius": 4,
"height": 40, "height": 40,
"width": 40, "width": 40,
}, },

View File

@ -13,7 +13,7 @@ exports[`Storyshots Avatar avatar 1`] = `
}, },
Object { Object {
"backgroundColor": "#3F51B5", "backgroundColor": "#3F51B5",
"borderRadius": 5, "borderRadius": 4,
"height": 25, "height": 25,
"width": 25, "width": 25,
}, },
@ -49,7 +49,7 @@ exports[`Storyshots Avatar avatar 1`] = `
}, },
Object { Object {
"backgroundColor": "#9C27B0", "backgroundColor": "#9C27B0",
"borderRadius": 5, "borderRadius": 4,
"height": 40, "height": 40,
"width": 40, "width": 40,
}, },
@ -85,7 +85,7 @@ exports[`Storyshots Avatar avatar 1`] = `
}, },
Object { Object {
"backgroundColor": "#9C27B0", "backgroundColor": "#9C27B0",
"borderRadius": 5, "borderRadius": 4,
"height": 30, "height": 30,
"width": 30, "width": 30,
}, },
@ -193,7 +193,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
}, },
Object { Object {
"backgroundColor": "#8BC34A", "backgroundColor": "#8BC34A",
"borderRadius": 20, "borderRadius": 4,
"height": 40, "height": 40,
"width": 40, "width": 40,
}, },
@ -230,7 +230,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
"position": "absolute", "position": "absolute",
}, },
Object { Object {
"borderRadius": 20, "borderRadius": 4,
"height": 40, "height": 40,
"width": 40, "width": 40,
}, },
@ -321,7 +321,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
}, },
Object { Object {
"backgroundColor": "#8BC34A", "backgroundColor": "#8BC34A",
"borderRadius": 20, "borderRadius": 4,
"height": 40, "height": 40,
"width": 40, "width": 40,
}, },
@ -358,7 +358,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
"position": "absolute", "position": "absolute",
}, },
Object { Object {
"borderRadius": 20, "borderRadius": 4,
"height": 40, "height": 40,
"width": 40, "width": 40,
}, },
@ -449,7 +449,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
}, },
Object { Object {
"backgroundColor": "#8BC34A", "backgroundColor": "#8BC34A",
"borderRadius": 20, "borderRadius": 4,
"height": 40, "height": 40,
"width": 40, "width": 40,
}, },
@ -486,7 +486,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
"position": "absolute", "position": "absolute",
}, },
Object { Object {
"borderRadius": 20, "borderRadius": 4,
"height": 40, "height": 40,
"width": 40, "width": 40,
}, },
@ -597,7 +597,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
}, },
Object { Object {
"backgroundColor": "#795548", "backgroundColor": "#795548",
"borderRadius": 20, "borderRadius": 4,
"height": 40, "height": 40,
"width": 40, "width": 40,
}, },
@ -634,7 +634,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
"position": "absolute", "position": "absolute",
}, },
Object { Object {
"borderRadius": 20, "borderRadius": 4,
"height": 40, "height": 40,
"width": 40, "width": 40,
}, },
@ -745,7 +745,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
}, },
Object { Object {
"backgroundColor": "#795548", "backgroundColor": "#795548",
"borderRadius": 20, "borderRadius": 4,
"height": 40, "height": 40,
"width": 40, "width": 40,
}, },
@ -782,7 +782,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
"position": "absolute", "position": "absolute",
}, },
Object { Object {
"borderRadius": 20, "borderRadius": 4,
"height": 40, "height": 40,
"width": 40, "width": 40,
}, },
@ -893,7 +893,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
}, },
Object { Object {
"backgroundColor": "#795548", "backgroundColor": "#795548",
"borderRadius": 20, "borderRadius": 4,
"height": 40, "height": 40,
"width": 40, "width": 40,
}, },
@ -930,7 +930,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
"position": "absolute", "position": "absolute",
}, },
Object { Object {
"borderRadius": 20, "borderRadius": 4,
"height": 40, "height": 40,
"width": 40, "width": 40,
}, },
@ -1041,7 +1041,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
}, },
Object { Object {
"backgroundColor": "#795548", "backgroundColor": "#795548",
"borderRadius": 20, "borderRadius": 4,
"height": 40, "height": 40,
"width": 40, "width": 40,
}, },
@ -1078,7 +1078,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
"position": "absolute", "position": "absolute",
}, },
Object { Object {
"borderRadius": 20, "borderRadius": 4,
"height": 40, "height": 40,
"width": 40, "width": 40,
}, },
@ -1189,7 +1189,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
}, },
Object { Object {
"backgroundColor": "#E91E63", "backgroundColor": "#E91E63",
"borderRadius": 20, "borderRadius": 4,
"height": 40, "height": 40,
"width": 40, "width": 40,
}, },
@ -1298,7 +1298,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
}, },
Object { Object {
"backgroundColor": "#9C27B0", "backgroundColor": "#9C27B0",
"borderRadius": 20, "borderRadius": 4,
"height": 40, "height": 40,
"width": 40, "width": 40,
}, },
@ -1407,7 +1407,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
}, },
Object { Object {
"backgroundColor": undefined, "backgroundColor": undefined,
"borderRadius": 20, "borderRadius": 4,
"height": 40, "height": 40,
"width": 40, "width": 40,
}, },

View File

@ -21,7 +21,7 @@ const styles = StyleSheet.create({
class Avatar extends React.PureComponent { class Avatar extends React.PureComponent {
render() { render() {
const { const {
text = '', size = 25, baseUrl, borderRadius = 5, style, avatar text = '', size = 25, baseUrl, borderRadius = 4, style, avatar
} = this.props; } = this.props;
const { initials, color } = avatarInitialsAndColor(`${ text }`); const { initials, color } = avatarInitialsAndColor(`${ text }`);

View File

@ -47,7 +47,7 @@ const styles = StyleSheet.create({
iconContainer: { iconContainer: {
height: 40, height: 40,
width: 40, width: 40,
borderRadius: 20, borderRadius: 4,
overflow: 'hidden', overflow: 'hidden',
justifyContent: 'center', justifyContent: 'center',
alignItems: 'center' alignItems: 'center'
@ -56,12 +56,6 @@ const styles = StyleSheet.create({
fontSize: 20, fontSize: 20,
color: '#fff' color: '#fff'
}, },
avatar: {
width: 40,
height: 40,
position: 'absolute',
borderRadius: 20
},
avatarInitials: { avatarInitials: {
fontSize: 20, fontSize: 20,
color: '#ffffff' color: '#ffffff'
@ -97,7 +91,7 @@ export default class RoomItem extends React.PureComponent {
if (type === 'd') { if (type === 'd') {
return ( return (
<Avatar text={name} baseUrl={baseUrl} size={40} borderRadius={20} /> <Avatar text={name} baseUrl={baseUrl} size={40} />
); );
} }

View File

@ -227,7 +227,7 @@ export default class RoomsListView extends React.Component {
style={styles.selectItemView} style={styles.selectItemView}
onPress={() => this._onPressSelectedItem(item)} onPress={() => this._onPressSelectedItem(item)}
> >
<Avatar text={item.name} baseUrl={this.props.Site_Url} size={40} borderRadius={20} /> <Avatar text={item.name} baseUrl={this.props.Site_Url} size={40} />
<Text ellipsizeMode='tail' numberOfLines={1} style={{ fontSize: 10 }}> <Text ellipsizeMode='tail' numberOfLines={1} style={{ fontSize: 10 }}>
{item.name} {item.name}
</Text> </Text>

1166
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -18,8 +18,8 @@
"babel-polyfill": "^6.26.0", "babel-polyfill": "^6.26.0",
"moment": "^2.19.2", "moment": "^2.19.2",
"prop-types": "^15.6.0", "prop-types": "^15.6.0",
"react": "16.1.0", "react": "16.1.1",
"react-emojione": "^3.1.10", "react-emojione": "^5.0.0",
"react-native": "0.50.3", "react-native": "0.50.3",
"react-native-action-button": "^2.8.1", "react-native-action-button": "^2.8.1",
"react-native-animatable": "^1.2.4", "react-native-animatable": "^1.2.4",
@ -39,7 +39,7 @@
"react-native-zeroconf": "^0.8.3", "react-native-zeroconf": "^0.8.3",
"react-navigation": "^1.0.0-beta.19", "react-navigation": "^1.0.0-beta.19",
"react-redux": "^5.0.6", "react-redux": "^5.0.6",
"realm": "^1.10.1", "realm": "^2.0.6",
"redux": "^3.7.2", "redux": "^3.7.2",
"redux-immutable-state-invariant": "^2.1.0", "redux-immutable-state-invariant": "^2.1.0",
"redux-logger": "^3.0.6", "redux-logger": "^3.0.6",
@ -64,8 +64,8 @@
"identity-obj-proxy": "^3.0.0", "identity-obj-proxy": "^3.0.0",
"jest": "21.2.1", "jest": "21.2.1",
"jest-cli": "^21.2.1", "jest-cli": "^21.2.1",
"react-dom": "16.1.0", "react-dom": "16.1.1",
"react-test-renderer": "16.1.0" "react-test-renderer": "16.1.1"
}, },
"jest": { "jest": {
"preset": "react-native", "preset": "react-native",