diff options
| -rw-r--r-- | packages/website/ts/components/top_bar/provider_display.tsx | 9 | ||||
| -rw-r--r-- | packages/website/ts/components/top_bar/provider_picker.tsx | 8 |
2 files changed, 10 insertions, 7 deletions
diff --git a/packages/website/ts/components/top_bar/provider_display.tsx b/packages/website/ts/components/top_bar/provider_display.tsx index c7b6a4743..e132f9cee 100644 --- a/packages/website/ts/components/top_bar/provider_display.tsx +++ b/packages/website/ts/components/top_bar/provider_display.tsx @@ -49,11 +49,14 @@ export class ProviderDisplay extends React.Component<ProviderDisplayProps, Provi <Identicon address={this.props.userAddress} diameter={IDENTICON_DIAMETER} /> </div> <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> - <div style={{ borderLeft: '1px solid #E0E0E0', marginLeft: 17, paddingTop: 1 }} className="px2"> - <i style={{ fontSize: 30, color: '#E0E0E0' }} className="zmdi zmdi zmdi-chevron-down" /> + <div + 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> ); diff --git a/packages/website/ts/components/top_bar/provider_picker.tsx b/packages/website/ts/components/top_bar/provider_picker.tsx index 4dc8ff0bd..75261ab94 100644 --- a/packages/website/ts/components/top_bar/provider_picker.tsx +++ b/packages/website/ts/components/top_bar/provider_picker.tsx @@ -9,11 +9,11 @@ import { DropDown } from 'ts/components/ui/drop_down'; import { Identicon } from 'ts/components/ui/identicon'; import { Dispatcher } from 'ts/redux/dispatcher'; import { ProviderType } from 'ts/types'; +import { colors } from 'ts/utils/colors'; import { constants } from 'ts/utils/constants'; import { utils } from 'ts/utils/utils'; const IDENTICON_DIAMETER = 32; -const SELECTED_BG_COLOR = '#F7F7F7'; interface ProviderPickerProps { networkId: number; @@ -43,12 +43,12 @@ export class ProviderPicker extends React.Component<ProviderPickerProps, Provide onChange={this._onProviderRadioChanged.bind(this)} > <RadioButton - style={{ ...menuStyle, backgroundColor: !isLedgerSelected && SELECTED_BG_COLOR }} + style={{ ...menuStyle, backgroundColor: !isLedgerSelected && colors.grey50 }} value={ProviderType.Injected} label={this._renderLabel(this.props.injectedProviderName, !isLedgerSelected)} /> <RadioButton - style={{ ...menuStyle, backgroundColor: isLedgerSelected && SELECTED_BG_COLOR }} + style={{ ...menuStyle, backgroundColor: isLedgerSelected && colors.grey50 }} value={ProviderType.Ledger} label={this._renderLabel('Ledger Nano S', isLedgerSelected)} /> @@ -76,7 +76,7 @@ export class ProviderPicker extends React.Component<ProviderPickerProps, Provide style={{ top: 6, width: 10 }} /> </div> - <div style={{ color: '#BBBBBB', fontSize: 11 }}>{networkName}</div> + <div style={{ color: colors.lightGrey, fontSize: 11 }}>{networkName}</div> </div> ); } |