diff --git a/apps/token/src/components/nav/nav.tsx b/apps/token/src/components/nav/nav.tsx index 245e119f0..fda02c54f 100644 --- a/apps/token/src/components/nav/nav.tsx +++ b/apps/token/src/components/nav/nav.tsx @@ -105,7 +105,6 @@ interface AppNavLinkProps { path: string; navbarTheme: NavbarTheme; testId?: string; - alignRight?: boolean; target?: HTMLAttributeAnchorTarget; } @@ -113,7 +112,6 @@ const AppNavLink = ({ name, path, navbarTheme, - alignRight, target, testId = name, }: AppNavLinkProps) => { @@ -125,7 +123,7 @@ const AppNavLink = ({ diff --git a/apps/trading/components/navbar/navbar.tsx b/apps/trading/components/navbar/navbar.tsx index 182993404..4914d0ba7 100644 --- a/apps/trading/components/navbar/navbar.tsx +++ b/apps/trading/components/navbar/navbar.tsx @@ -4,7 +4,7 @@ import { NetworkSwitcher, useEnvironment } from '@vegaprotocol/environment'; import { t } from '@vegaprotocol/react-helpers'; import { useGlobalStore } from '../../stores/global'; import { VegaWalletConnectButton } from '../vega-wallet-connect-button'; -import { ThemeSwitcher } from '@vegaprotocol/ui-toolkit'; +import { NewTab, ThemeSwitcher } from '@vegaprotocol/ui-toolkit'; import { Vega } from '../icons/vega'; import type { HTMLAttributeAnchorTarget } from 'react'; import { Routes } from '../../pages/client-router'; @@ -52,15 +52,18 @@ export const Navbar = ({ path={Routes.PORTFOLIO} navbarTheme={navbarTheme} /> -
- + + {t('Governance')} - + + + +
@@ -73,7 +76,6 @@ interface AppNavLinkProps { path: string; navbarTheme: NavbarTheme; testId?: string; - alignRight?: boolean; target?: HTMLAttributeAnchorTarget; } @@ -81,7 +83,6 @@ const AppNavLink = ({ name, path, navbarTheme, - alignRight, target, testId = name, }: AppNavLinkProps) => { @@ -93,7 +94,7 @@ const AppNavLink = ({ {({ isActive }) => { diff --git a/libs/ui-toolkit/src/components/nav/nav.tsx b/libs/ui-toolkit/src/components/nav/nav.tsx index c4dec8f75..fc2c904c6 100644 --- a/libs/ui-toolkit/src/components/nav/nav.tsx +++ b/libs/ui-toolkit/src/components/nav/nav.tsx @@ -2,25 +2,22 @@ import classNames from 'classnames'; import type { ReactNode } from 'react'; export function getNavLinkClassNames( - navbarTheme: string, - alignRight = false + navbarTheme: string ): (props: { isActive?: boolean }) => string | undefined { return ({ isActive = false }) => { - return getActiveNavLinkClassNames(isActive, navbarTheme, alignRight); + return getActiveNavLinkClassNames(isActive, navbarTheme); }; } export const getActiveNavLinkClassNames = ( isActive: boolean, - navbarTheme: string, - alignRight = false + navbarTheme: string ): string | undefined => { return classNames('mx-2 py-3 self-end relative', { 'cursor-default': isActive, 'text-black dark:text-white': isActive && navbarTheme !== 'yellow', 'text-neutral-500 dark:text-neutral-400 hover:text-black dark:hover:text-neutral-300': !isActive && navbarTheme !== 'yellow', - 'ml-auto': alignRight, 'text-black': isActive && navbarTheme === 'yellow', 'text-black/60 hover:text-black': !isActive && navbarTheme === 'yellow', }); diff --git a/libs/ui-toolkit/src/components/vega-icons/index.ts b/libs/ui-toolkit/src/components/vega-icons/index.ts index a4ea9c46c..f10a16514 100644 --- a/libs/ui-toolkit/src/components/vega-icons/index.ts +++ b/libs/ui-toolkit/src/components/vega-icons/index.ts @@ -1,3 +1,4 @@ export * from './cross'; export * from './diamond'; +export * from './new-tab'; export * from './tick'; diff --git a/libs/ui-toolkit/src/components/vega-icons/new-tab.tsx b/libs/ui-toolkit/src/components/vega-icons/new-tab.tsx new file mode 100644 index 000000000..7ec400a1d --- /dev/null +++ b/libs/ui-toolkit/src/components/vega-icons/new-tab.tsx @@ -0,0 +1,7 @@ +export const NewTab = () => { + return ( + + + + ); +};