[RN] Add color scheme support to dialog buttons

This commit is contained in:
Bettenbuk Zoltan 2019-03-05 19:16:23 +01:00 committed by Zoltan Bettenbuk
parent d04068344a
commit 8400d01d75
5 changed files with 20 additions and 12 deletions

View File

@ -14,6 +14,8 @@ export default {
'Dialog': {
background: ColorPalette.blackBlue,
border: getRGBAFormat(ColorPalette.white, 0.2),
buttonBackground: ColorPalette.blue,
buttonLabel: ColorPalette.white,
icon: ColorPalette.white,
text: ColorPalette.white
},

View File

@ -67,12 +67,12 @@ class BaseSubmitDialog<P: Props, S: *> extends BaseDialog<P, S> {
disabled = { this.props.okDisabled }
onPress = { this._onSubmit }
style = { [
brandedDialog.button,
_dialogStyles.button,
additionalButtons
? null : brandedDialog.buttonFarLeft,
brandedDialog.buttonFarRight
] }>
<Text style = { _dialogStyles.text }>
<Text style = { _dialogStyles.buttonLabel }>
{ t(this._getSubmitButtonKey()) }
</Text>
</TouchableOpacity>

View File

@ -63,11 +63,11 @@ class ConfirmDialog extends BaseSubmitDialog<Props, *> {
<TouchableOpacity
onPress = { this._onCancel }
style = { [
brandedDialog.button,
_dialogStyles.button,
brandedDialog.buttonFarLeft,
_dialogStyles.buttonSeparator
] }>
<Text style = { _dialogStyles.text }>
<Text style = { _dialogStyles.buttonLabel }>
{ t(cancelKey || 'dialog.confirmNo') }
</Text>
</TouchableOpacity>

View File

@ -95,11 +95,11 @@ class InputDialog extends BaseDialog<Props, State> {
disabled = { okDisabled }
onPress = { this._onSubmitValue }
style = { [
brandedDialog.button,
_dialogStyles.button,
brandedDialog.buttonFarLeft,
brandedDialog.buttonFarRight
] }>
<Text style = { _dialogStyles.text }>
<Text style = { _dialogStyles.buttonLabel }>
{ t('dialog.Ok') }
</Text>
</TouchableOpacity>

View File

@ -66,12 +66,6 @@ export const brandedDialog = createStyleSheet({
fontWeight: 'bold'
},
button: {
backgroundColor: ColorPalette.blue,
flex: 1,
padding: BoxModel.padding * 1.5
},
buttonFarLeft: {
borderBottomLeftRadius: BORDER_RADIUS
},
@ -185,6 +179,12 @@ ColorSchemeRegistry.register('BottomSheet', {
* Color schemed styles for all the component based on the abstract dialog.
*/
ColorSchemeRegistry.register('Dialog', {
button: {
backgroundColor: schemeColor('buttonBackground'),
flex: 1,
padding: BoxModel.padding * 1.5
},
/**
* Separator line for the buttons in a dialog.
*/
@ -193,6 +193,12 @@ ColorSchemeRegistry.register('Dialog', {
borderRightWidth: 1
},
buttonLabel: {
color: schemeColor('buttonLabel'),
fontSize: MD_FONT_SIZE,
textAlign: 'center'
},
/**
* Style of the close icon on a dialog.
*/