diff options
author | Steve Klebanoff <steve.klebanoff@gmail.com> | 2018-12-18 06:17:36 +0800 |
---|---|---|
committer | Steve Klebanoff <steve.klebanoff@gmail.com> | 2018-12-18 06:17:36 +0800 |
commit | 6e0d622a1559937d8867216d571156564c666c77 (patch) | |
tree | b51eb39415e3cc1b69a87fb90fe3b0d03ae4c322 /packages/website/ts/@next/components/link.tsx | |
parent | 0e8f0d1d53c5ecc4d7c88457c21ec423d86b2293 (diff) | |
download | dexon-0x-contracts-6e0d622a1559937d8867216d571156564c666c77.tar.gz dexon-0x-contracts-6e0d622a1559937d8867216d571156564c666c77.tar.zst dexon-0x-contracts-6e0d622a1559937d8867216d571156564c666c77.zip |
Open all new instant links in new window
Diffstat (limited to 'packages/website/ts/@next/components/link.tsx')
-rw-r--r-- | packages/website/ts/@next/components/link.tsx | 21 |
1 files changed, 14 insertions, 7 deletions
diff --git a/packages/website/ts/@next/components/link.tsx b/packages/website/ts/@next/components/link.tsx index c3633987a..0976a57a8 100644 --- a/packages/website/ts/@next/components/link.tsx +++ b/packages/website/ts/@next/components/link.tsx @@ -13,19 +13,23 @@ interface LinkInterface { theme?: { textColor: string; }; + target?: string; } export const Link = (props: LinkInterface) => { - const { - children, - isNoArrow, - href, - } = props; + const { children, isNoArrow, href, target } = props; return ( <StyledLink to={href} {...props}> {children} - {!isNoArrow && <svg width="25" height="25" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M8.484 5.246l.023 1.411 8.147.053L4.817 18.547l.996.996L17.65 7.706l.052 8.146 1.411.024-.068-10.561-10.561-.069z" fill="currentColor"/></svg>} + {!isNoArrow && ( + <svg width="25" height="25" fill="none" xmlns="http://www.w3.org/2000/svg"> + <path + d="M8.484 5.246l.023 1.411 8.147.053L4.817 18.547l.996.996L17.65 7.706l.052 8.146 1.411.024-.068-10.561-10.561-.069z" + fill="currentColor" + /> + </svg> + )} </StyledLink> ); }; @@ -39,7 +43,10 @@ export const LinkWrap = styled.div` } `; -const StyledLink = styled(ReactRouterLink)<LinkInterface>` +const StyledLink = + styled(ReactRouterLink) < + LinkInterface > + ` display: ${props => !props.isBlock && 'inline-flex'}; color: ${props => props.color || props.theme.linkColor}; text-align: center; |