diff --git a/explorer/src/components/Nav.tsx b/explorer/src/components/Nav.tsx index fbfe4b7ee5..c4d065aea6 100644 --- a/explorer/src/components/Nav.tsx +++ b/explorer/src/components/Nav.tsx @@ -22,6 +22,7 @@ import { useMainContext } from '../context/main'; import { MobileDrawerClose } from '../icons/MobileDrawerClose'; import { Socials } from './Socials'; import { Footer } from './Footer'; +import { NymVpnIcon } from '../icons/NymVpn'; import { DarkLightSwitchDesktop } from './Switch'; import { NavOptionType } from '../context/nav'; @@ -341,6 +342,9 @@ export const Nav: FCWithChildren = ({ children }) => { alignItems: 'center', }} > + + + diff --git a/explorer/src/icons/NymVpn.tsx b/explorer/src/icons/NymVpn.tsx new file mode 100644 index 0000000000..6cd67deb29 --- /dev/null +++ b/explorer/src/icons/NymVpn.tsx @@ -0,0 +1,63 @@ +import * as React from 'react'; +import { useTheme } from '@mui/material/styles'; + +interface DiscordIconProps { + size?: { width: number; height: number }; + color?: string; +} + +export const NymVpnIcon: FCWithChildren = ({ size, color: colorProp }) => { + const theme = useTheme(); + const color = colorProp || theme.palette.text.primary; + return ( + + + + + + + + + + + + ); +}; + +NymVpnIcon.defaultProps = { + size: { width: 80, height: 12 }, + color: undefined, +};