self-hosted/joplin
1
0
Fork 0
mirror of https://github.com/laurent22/joplin.git synced 2025-06-12 22:57:38 +02:00
Code Issues Releases Activity

Styling

Browse Source
This commit is contained in:
Laurent Cozic
2017-07-22 17:36:55 +01:00
parent cbe0859496
commit 7aee903ca2
4 changed files with 62 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
ReactNativeClient/lib/components/screen-header.js
View File

@ -34,17 +34,12 @@ let styleObject = {
},
sideMenuButton: {
flex: 1,
alignItems: 'center',
backgroundColor: globalStyle.backgroundColor,
paddingLeft: globalStyle.marginLeft,
paddingRight: 5,
marginRight: 2,
},
sideMenuButtonText: {
textAlignVertical: 'center',
color: globalStyle.color,
fontWeight: 'bold',
flex: 1,
},
backButton: {
flex: 1,
backgroundColor: globalStyle.backgroundColor,
@ -52,29 +47,32 @@ let styleObject = {
paddingRight: 15,
marginRight: 1,
},
backButtonIcon: {
flex: 1,
fontSize: 20,
color: globalStyle.color,
textAlignVertical: 'center',
},
saveButton: {
flex: 1,
backgroundColor: "#0482E3",
flexDirection: 'row',
alignItems: 'center',
paddingLeft: 15,
paddingRight: 15,
marginRight: 10,
borderWidth: 1,
borderColor: globalStyle.color,
borderRadius: 10,
},
saveButtonText: {
textAlignVertical: 'center',
color: "#ffffff",
color: globalStyle.color,
fontWeight: 'bold',
flex: 1,
},
saveButtonIcon: {
fontSize: 20,
color: globalStyle.color,
marginRight: 5,
},
contextMenuTrigger: {
fontSize: 25,
paddingRight: globalStyle.marginRight,
color: globalStyle.color,
fontWeight: 'bold',
},
contextMenu: {
backgroundColor: globalStyle.backgroundColor,
@ -98,8 +96,12 @@ let styleObject = {
}
};
styleObject.backButtonDisabled = Object.assign({}, styleObject.backButton, { opacity: 0.2 });
styleObject.saveButtonDisabled = Object.assign({}, styleObject.saveButton, { opacity: 0.2 });
styleObject.topIcon = Object.assign({}, globalStyle.icon);
styleObject.topIcon.flex = 1;
styleObject.topIcon.textAlignVertical = 'center';
styleObject.backButtonDisabled = Object.assign({}, styleObject.backButton, { opacity: globalStyle.disabledOpacity });
styleObject.saveButtonDisabled = Object.assign({}, styleObject.saveButton, { opacity: globalStyle.disabledOpacity });
const styles = StyleSheet.create(styleObject);
@ -139,18 +141,17 @@ class ScreenHeaderComponent extends Component {
return (
<TouchableOpacity onPress={onPress}>
<View style={styles.sideMenuButton}>
<Text style={styles.sideMenuButtonText}>☰</Text>
<Icon name='md-menu' style={styleObject.topIcon} />
</View>
</TouchableOpacity>
);
}
function backButton(styles, onPress, disabled) {
// <Text style={styles.backButtonText}>&lt;</Text>
return (
<TouchableOpacity onPress={onPress} disabled={disabled}>
<View style={disabled ? styles.backButtonDisabled : styles.backButton}>
<Icon name='md-arrow-back' style={styles.backButtonIcon} />
<Icon name='md-arrow-back' style={styles.topIcon} />
</View>
</TouchableOpacity>
);
@ -162,6 +163,7 @@ class ScreenHeaderComponent extends Component {
return (
<TouchableOpacity onPress={onPress} disabled={disabled}>
<View style={disabled ? styles.saveButtonDisabled : styles.saveButton}>
{ disabled && <Icon name='md-checkmark' style={styles.saveButtonIcon} /> }
<Text style={styles.saveButtonText}>Save</Text>
</View>
</TouchableOpacity>