crowetic/protocol
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add blog to topBar and as a consequence support external links in topBar menu items

Browse Source
This commit is contained in:
Fabio Berger
2018-02-08 17:36:17 -08:00
parent 4153d57849
commit ddf4437fb6
2 changed files with 25 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
packages/website/ts/components/top_bar/top_bar.tsx
View File

@@ -169,12 +169,21 @@ export class TopBar extends React.Component<TopBarProps, TopBarState> {
path={`${WebsitePaths.Wiki}`}
style={styles.menuItem}
isNightVersion={isNightVersion}
isExternal={false}
/>
<TopBarMenuItem
title="Blog"
path={constants.URL_BLOG}
style={styles.menuItem}
isNightVersion={isNightVersion}
isExternal={true}
/>
<TopBarMenuItem
title="About"
path={`${WebsitePaths.About}`}
style={styles.menuItem}
isNightVersion={isNightVersion}
isExternal={false}
/>
<TopBarMenuItem
title="Portal DApp"
@@ -183,6 +192,7 @@ export class TopBar extends React.Component<TopBarProps, TopBarState> {
style={styles.menuItem}
className={`${isFullWidthPage && 'md-hide'}`}
isNightVersion={isNightVersion}
isExternal={false}
/>
</div>
</div>

18
packages/website/ts/components/top_bar/top_bar_menu_item.tsx
View File

@@ -11,6 +11,7 @@ interface TopBarMenuItemProps {
title: string;
path?: string;
isPrimary?: boolean;
isExternal: boolean;
style?: React.CSSProperties;
className?: string;
isNightVersion?: boolean;
@@ -43,9 +44,20 @@ export class TopBarMenuItem extends React.Component<TopBarMenuItemProps, TopBarM
className={`center ${this.props.className}`}
style={{ ...this.props.style, ...primaryStyles, color: menuItemColor }}
>
<Link to={this.props.path} className="text-decoration-none" style={{ color: linkColor }}>
{this.props.title}
</Link>
{this.props.isExternal ? (
<a
className="text-decoration-none"
style={{ color: linkColor }}
target="_blank"
href={this.props.path}
>
{this.props.title}
</a>
) : (
<Link to={this.props.path} className="text-decoration-none" style={{ color: linkColor }}>
{this.props.title}
</Link>
)}
</div>
);
}