aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website/ts/components/top_bar_menu_item.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'packages/website/ts/components/top_bar_menu_item.tsx')
-rw-r--r--packages/website/ts/components/top_bar_menu_item.tsx33
1 files changed, 16 insertions, 17 deletions
diff --git a/packages/website/ts/components/top_bar_menu_item.tsx b/packages/website/ts/components/top_bar_menu_item.tsx
index de429fba6..96ee86142 100644
--- a/packages/website/ts/components/top_bar_menu_item.tsx
+++ b/packages/website/ts/components/top_bar_menu_item.tsx
@@ -1,11 +1,10 @@
import * as _ from 'lodash';
import * as React from 'react';
-import {Link} from 'react-router-dom';
-import {Styles} from 'ts/types';
+import { Link } from 'react-router-dom';
+import { colors } from 'ts/utils/colors';
-const CUSTOM_DARK_GRAY = '#231F20';
const DEFAULT_STYLE = {
- color: CUSTOM_DARK_GRAY,
+ color: colors.darkestGrey,
};
interface TopBarMenuItemProps {
@@ -27,24 +26,24 @@ export class TopBarMenuItem extends React.Component<TopBarMenuItemProps, TopBarM
isNightVersion: false,
};
public render() {
- const primaryStyles = this.props.isPrimary ? {
- borderRadius: 4,
- border: `1px solid ${this.props.isNightVersion ? '#979797' : 'rgb(230, 229, 229)'}`,
- marginTop: 15,
- paddingLeft: 9,
- paddingRight: 9,
- width: 77,
- } : {};
+ const primaryStyles = this.props.isPrimary
+ ? {
+ borderRadius: 4,
+ border: `1px solid ${this.props.isNightVersion ? colors.grey : colors.greyishPink}`,
+ marginTop: 15,
+ paddingLeft: 9,
+ paddingRight: 9,
+ width: 77,
+ }
+ : {};
const menuItemColor = this.props.isNightVersion ? 'white' : this.props.style.color;
- const linkColor = _.isUndefined(menuItemColor) ?
- CUSTOM_DARK_GRAY :
- menuItemColor;
+ const linkColor = _.isUndefined(menuItemColor) ? colors.darkestGrey : menuItemColor;
return (
<div
className={`center ${this.props.className}`}
- style={{...this.props.style, ...primaryStyles, color: menuItemColor}}
+ style={{ ...this.props.style, ...primaryStyles, color: menuItemColor }}
>
- <Link to={this.props.path} className="text-decoration-none" style={{color: linkColor}}>
+ <Link to={this.props.path} className="text-decoration-none" style={{ color: linkColor }}>
{this.props.title}
</Link>
</div>