В Input добавлена поддержка center поля

This commit is contained in:
ErickSkrauch 2016-06-16 16:11:55 +03:00
parent a99d55e061
commit 4a5c1ada1e
4 changed files with 14 additions and 7 deletions

View File

@ -39,7 +39,7 @@ export default class ActivationBody extends BaseAuthBody {
<div className={styles.formRow}> <div className={styles.formRow}>
<Input {...this.bindField('key')} <Input {...this.bindField('key')}
color="blue" color="blue"
style={{textAlign: 'center'}} center
required required
value={key} value={key}
readOnly={!!key} readOnly={!!key}

View File

@ -47,7 +47,7 @@ export default class RecoverPasswordBody extends BaseAuthBody {
<Input {...this.bindField('key')} <Input {...this.bindField('key')}
color="lightViolet" color="lightViolet"
style={{textAlign: 'center'}} // ну это уже низко center
required required
value={key} value={key}
readOnly={!!key} readOnly={!!key}

View File

@ -28,7 +28,8 @@ export default class Input extends FormInputComponent {
error: PropTypes.string, error: PropTypes.string,
icon: PropTypes.string, icon: PropTypes.string,
skin: PropTypes.oneOf(skins), skin: PropTypes.oneOf(skins),
color: PropTypes.oneOf(colors) color: PropTypes.oneOf(colors),
center: PropTypes.bool
}; };
static defaultProps = { static defaultProps = {
@ -37,7 +38,7 @@ export default class Input extends FormInputComponent {
}; };
render() { render() {
const { color, skin } = this.props; const { color, skin, center } = this.props;
let { icon, label } = this.props; let { icon, label } = this.props;
const props = { const props = {
@ -65,7 +66,7 @@ export default class Input extends FormInputComponent {
if (icon) { if (icon) {
baseClass = styles.formIconRow; baseClass = styles.formIconRow;
icon = ( icon = (
<div className={classNames(styles.textFieldIcon, icons[icon])} /> <span className={classNames(styles.textFieldIcon, icons[icon])} />
); );
} }
@ -76,7 +77,10 @@ export default class Input extends FormInputComponent {
<input ref={this.setEl} <input ref={this.setEl}
className={classNames( className={classNames(
styles[`${skin}TextField`], styles[`${skin}TextField`],
styles[`${color}TextField`] styles[`${color}TextField`],
{
[styles.textFieldCenter]: center
}
)} )}
{...props} {...props}
/> />

View File

@ -164,6 +164,10 @@
position: relative; position: relative;
} }
.textFieldCenter {
text-align: center;
}
@include input-theme('green', $green); @include input-theme('green', $green);
@include input-theme('blue', $blue); @include input-theme('blue', $blue);
@include input-theme('red', $red); @include input-theme('red', $red);
@ -171,7 +175,6 @@
@include input-theme('lightViolet', $light_violet); @include input-theme('lightViolet', $light_violet);
@include input-theme('violet', $violet); @include input-theme('violet', $violet);
/** /**
* Checkbox * Checkbox
*/ */