[RN] Improve app-settings back button style
This commit is contained in:
parent
6f8f64ba48
commit
aa9efd6f69
|
@ -4,15 +4,9 @@ import React, { Component } from 'react';
|
|||
import { TouchableOpacity } from 'react-native';
|
||||
|
||||
import { Icon } from '../../base/font-icons';
|
||||
import { Platform } from '../../base/react';
|
||||
|
||||
import styles from './styles';
|
||||
|
||||
/**
|
||||
* The icon glyph to be used on a specific platform.
|
||||
*/
|
||||
const BACK_ICON = Platform.OS === 'android' ? 'arrow_back' : 'navigate_before';
|
||||
|
||||
/**
|
||||
* The type of the React {@code Component} props of {@link BackButton}
|
||||
*/
|
||||
|
@ -30,7 +24,7 @@ type Props = {
|
|||
};
|
||||
|
||||
/**
|
||||
* A component rendering a back button that looks native on both platforms.
|
||||
* A component rendering a back button.
|
||||
*/
|
||||
export default class BackButton extends Component<Props> {
|
||||
/**
|
||||
|
@ -45,7 +39,7 @@ export default class BackButton extends Component<Props> {
|
|||
accessibilityLabel = { 'Back' }
|
||||
onPress = { this.props.onPress }>
|
||||
<Icon
|
||||
name = { BACK_ICON }
|
||||
name = { 'arrow_back' }
|
||||
style = { [
|
||||
styles.backIcon,
|
||||
this.props.style
|
||||
|
|
|
@ -1,5 +1,3 @@
|
|||
import { Platform } from 'react-native';
|
||||
|
||||
import {
|
||||
BoxModel,
|
||||
ColorPalette,
|
||||
|
@ -19,19 +17,13 @@ const TEXT_SIZE = 17;
|
|||
export default createStyleSheet({
|
||||
|
||||
/**
|
||||
* The platform specific back button style.
|
||||
* The back button style.
|
||||
*/
|
||||
backIcon: {
|
||||
alignSelf: 'center',
|
||||
...Platform.select({
|
||||
android: {
|
||||
fontSize: 24,
|
||||
padding: 8
|
||||
},
|
||||
ios: {
|
||||
fontSize: 30
|
||||
}
|
||||
})
|
||||
fontSize: 26,
|
||||
padding: 8,
|
||||
paddingRight: 22
|
||||
},
|
||||
|
||||
/**
|
||||
|
@ -48,7 +40,8 @@ export default createStyleSheet({
|
|||
*/
|
||||
fieldLabelContainer: {
|
||||
alignItems: 'center',
|
||||
flexDirection: 'row'
|
||||
flexDirection: 'row',
|
||||
marginRight: 5
|
||||
},
|
||||
|
||||
/**
|
||||
|
@ -92,7 +85,7 @@ export default createStyleSheet({
|
|||
*/
|
||||
headerTitle: {
|
||||
color: ColorPalette.white,
|
||||
fontSize: 24
|
||||
fontSize: 22
|
||||
},
|
||||
|
||||
/**
|
||||
|
@ -106,8 +99,7 @@ export default createStyleSheet({
|
|||
* The back button style on the settings screen.
|
||||
*/
|
||||
settingsBackButton: {
|
||||
color: ColorPalette.white,
|
||||
fontSize: 25
|
||||
color: ColorPalette.white
|
||||
},
|
||||
|
||||
/**
|
||||
|
|
Loading…
Reference in New Issue