layout main details in row
This commit is contained in:
parent
7e2920b694
commit
8528f19beb
1 changed files with 14 additions and 5 deletions
|
@ -46,6 +46,13 @@ const styles = StyleSheet.create({
|
||||||
fontSize: 12.5,
|
fontSize: 12.5,
|
||||||
fontWeight: '300',
|
fontWeight: '300',
|
||||||
marginLeft: 3
|
marginLeft: 3
|
||||||
|
},
|
||||||
|
detailsRow: {
|
||||||
|
flex: 1,
|
||||||
|
flexDirection: 'row'
|
||||||
|
},
|
||||||
|
mainDetails: {
|
||||||
|
marginRight: 10
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -76,7 +83,7 @@ export default class ProjectItem extends React.Component {
|
||||||
return (
|
return (
|
||||||
<View style={styles.buildCell}>
|
<View style={styles.buildCell}>
|
||||||
<Text style={styles.details}><Icon name="pulse" /> #{ mostRecentBuild.build_num }</Text>
|
<Text style={styles.details}><Icon name="pulse" /> #{ mostRecentBuild.build_num }</Text>
|
||||||
<Text style={styles.details}><Icon name="history" /> { buildTime }</Text>
|
<Text style={styles.details}><Icon name="clock" /> { buildTime }</Text>
|
||||||
<Text style={styles.details}><Icon name="git-commit" /> { commit.commit.substring(0, 6) }</Text>
|
<Text style={styles.details}><Icon name="git-commit" /> { commit.commit.substring(0, 6) }</Text>
|
||||||
</View>
|
</View>
|
||||||
);
|
);
|
||||||
|
@ -91,10 +98,10 @@ export default class ProjectItem extends React.Component {
|
||||||
GlobalStyles.get('CIRCLE_TEST_FAIL') :
|
GlobalStyles.get('CIRCLE_TEST_FAIL') :
|
||||||
GlobalStyles.get('CIRCLE_TEST_PASS');
|
GlobalStyles.get('CIRCLE_TEST_PASS');
|
||||||
const username = this.props.userDetails && this.props.userDetails.login !== project.username ?
|
const username = this.props.userDetails && this.props.userDetails.login !== project.username ?
|
||||||
(<Text style={styles.details}><Icon name="person" /> {project.username}</Text>) : null;
|
(<Text style={[styles.details, styles.mainDetails]}><Icon name="person" /> {project.username}</Text>) : null;
|
||||||
|
|
||||||
const language = project.language ?
|
const language = project.language ?
|
||||||
(<Text style={styles.details}><Icon name="keyboard" /> {project.language}</Text>) : null;
|
(<Text style={[styles.details, styles.mainDetails]}><Icon name="keyboard" /> {project.language}</Text>) : null;
|
||||||
|
|
||||||
const buildDetails = mostRecentBuild ? this._displayMoreInfo(mostRecentBuild) : null;
|
const buildDetails = mostRecentBuild ? this._displayMoreInfo(mostRecentBuild) : null;
|
||||||
|
|
||||||
|
@ -106,9 +113,11 @@ export default class ProjectItem extends React.Component {
|
||||||
<View style={styles.container}>
|
<View style={styles.container}>
|
||||||
<View style={styles.repoCell}>
|
<View style={styles.repoCell}>
|
||||||
<Text style={styles.repoName}>{project.reponame}</Text>
|
<Text style={styles.repoName}>{project.reponame}</Text>
|
||||||
|
<View style={styles.detailsRow}>
|
||||||
{ username }
|
{ username }
|
||||||
{ language }
|
{ language }
|
||||||
</View>
|
</View>
|
||||||
|
</View>
|
||||||
{ buildDetails }
|
{ buildDetails }
|
||||||
<View style={[styles.colourPanel, {backgroundColor: statusColour}]} />
|
<View style={[styles.colourPanel, {backgroundColor: statusColour}]} />
|
||||||
</View>
|
</View>
|
||||||
|
|
Reference in a new issue