Use colors module and remove in-lined colors

This commit is contained in:
Fabio Berger 2018-01-29 10:55:53 +01:00
parent d18554e0e8
commit 45fdfc2d3d
2 changed files with 10 additions and 7 deletions

View File

@ -49,11 +49,14 @@ export class ProviderDisplay extends React.Component<ProviderDisplayProps, Provi
<Identicon address={this.props.userAddress} diameter={IDENTICON_DIAMETER} /> <Identicon address={this.props.userAddress} diameter={IDENTICON_DIAMETER} />
</div> </div>
<div style={{ marginLeft: 12, paddingTop: 1 }}> <div style={{ marginLeft: 12, paddingTop: 1 }}>
<div style={{ fontSize: 12, color: '#FF7F00' }}>{providerTitle}</div> <div style={{ fontSize: 12, color: colors.amber800 }}>{providerTitle}</div>
<div style={{ fontSize: 14 }}>{displayAddress}</div> <div style={{ fontSize: 14 }}>{displayAddress}</div>
</div> </div>
<div style={{ borderLeft: '1px solid #E0E0E0', marginLeft: 17, paddingTop: 1 }} className="px2"> <div
<i style={{ fontSize: 30, color: '#E0E0E0' }} className="zmdi zmdi zmdi-chevron-down" /> style={{ borderLeft: `1px solid ${colors.grey300}`, marginLeft: 17, paddingTop: 1 }}
className="px2"
>
<i style={{ fontSize: 30, color: colors.grey300 }} className="zmdi zmdi zmdi-chevron-down" />
</div> </div>
</div> </div>
); );

View File

@ -9,11 +9,11 @@ import { DropDown } from 'ts/components/ui/drop_down';
import { Identicon } from 'ts/components/ui/identicon'; import { Identicon } from 'ts/components/ui/identicon';
import { Dispatcher } from 'ts/redux/dispatcher'; import { Dispatcher } from 'ts/redux/dispatcher';
import { ProviderType } from 'ts/types'; import { ProviderType } from 'ts/types';
import { colors } from 'ts/utils/colors';
import { constants } from 'ts/utils/constants'; import { constants } from 'ts/utils/constants';
import { utils } from 'ts/utils/utils'; import { utils } from 'ts/utils/utils';
const IDENTICON_DIAMETER = 32; const IDENTICON_DIAMETER = 32;
const SELECTED_BG_COLOR = '#F7F7F7';
interface ProviderPickerProps { interface ProviderPickerProps {
networkId: number; networkId: number;
@ -43,12 +43,12 @@ export class ProviderPicker extends React.Component<ProviderPickerProps, Provide
onChange={this._onProviderRadioChanged.bind(this)} onChange={this._onProviderRadioChanged.bind(this)}
> >
<RadioButton <RadioButton
style={{ ...menuStyle, backgroundColor: !isLedgerSelected && SELECTED_BG_COLOR }} style={{ ...menuStyle, backgroundColor: !isLedgerSelected && colors.grey50 }}
value={ProviderType.Injected} value={ProviderType.Injected}
label={this._renderLabel(this.props.injectedProviderName, !isLedgerSelected)} label={this._renderLabel(this.props.injectedProviderName, !isLedgerSelected)}
/> />
<RadioButton <RadioButton
style={{ ...menuStyle, backgroundColor: isLedgerSelected && SELECTED_BG_COLOR }} style={{ ...menuStyle, backgroundColor: isLedgerSelected && colors.grey50 }}
value={ProviderType.Ledger} value={ProviderType.Ledger}
label={this._renderLabel('Ledger Nano S', isLedgerSelected)} label={this._renderLabel('Ledger Nano S', isLedgerSelected)}
/> />
@ -76,7 +76,7 @@ export class ProviderPicker extends React.Component<ProviderPickerProps, Provide
style={{ top: 6, width: 10 }} style={{ top: 6, width: 10 }}
/> />
</div> </div>
<div style={{ color: '#BBBBBB', fontSize: 11 }}>{networkName}</div> <div style={{ color: colors.lightGrey, fontSize: 11 }}>{networkName}</div>
</div> </div>
); );
} }