diff --git a/packages/logos-docusaurus-theme/src/client/components/Icon/Icon.tsx b/packages/logos-docusaurus-theme/src/client/components/Icon/Icon.tsx
index d295671..5b09ad1 100644
--- a/packages/logos-docusaurus-theme/src/client/components/Icon/Icon.tsx
+++ b/packages/logos-docusaurus-theme/src/client/components/Icon/Icon.tsx
@@ -1,6 +1,6 @@
import { useColorMode } from '@docusaurus/theme-common'
import { clsx } from 'clsx'
-import React from 'react'
+import React, { CSSProperties } from 'react'
import styles from './style.module.scss'
@@ -14,7 +14,11 @@ import DiscordSvg from '../../static/icons/discord.svg'
import DiscourseSvg from '../../static/icons/discourse.svg'
import DotSvg from '../../static/icons/dot.svg'
import DropdownSvg from '../../static/icons/dropdown.svg'
+import EditSvg from '../../static/icons/edit.svg'
+import ExternalLinkSvg from '../../static/icons/external-link.svg'
import FolderSvg from '../../static/icons/folder.svg'
+import FullscreenExitSvg from '../../static/icons/fullscreen-exit.svg'
+import FullscreenSvg from '../../static/icons/fullscreen.svg'
import GithubSvg from '../../static/icons/github.svg'
import GScholarSvg from '../../static/icons/gscholar.svg'
import HistorySvg from '../../static/icons/history.svg'
@@ -23,9 +27,6 @@ import SearchSvg from '../../static/icons/search.svg'
import StatusSvg from '../../static/icons/status.svg'
import TelegramSvg from '../../static/icons/telegram.svg'
import TwitterSvg from '../../static/icons/twitter.svg'
-import EditSvg from '../../static/icons/edit.svg'
-import FullscreenSvg from '../../static/icons/fullscreen.svg'
-import FullscreenExitSvg from '../../static/icons/fullscreen-exit.svg'
type TIconProps = {
size?: 's' | 'm' | 'l'
@@ -192,3 +193,9 @@ export const IconFullscreenExit = (props: TIconProps): JSX.Element => (
)
+
+export const IconExternalLink = (props: TIconProps): JSX.Element => (
+
+
+
+)
diff --git a/packages/logos-docusaurus-theme/src/client/static/icons/external-link.svg b/packages/logos-docusaurus-theme/src/client/static/icons/external-link.svg
new file mode 100644
index 0000000..01d903e
--- /dev/null
+++ b/packages/logos-docusaurus-theme/src/client/static/icons/external-link.svg
@@ -0,0 +1,3 @@
+
diff --git a/packages/logos-docusaurus-theme/src/client/theme/NavbarItem/NavbarNavLink/index.tsx b/packages/logos-docusaurus-theme/src/client/theme/NavbarItem/NavbarNavLink/index.tsx
index fd41632..1414faf 100644
--- a/packages/logos-docusaurus-theme/src/client/theme/NavbarItem/NavbarNavLink/index.tsx
+++ b/packages/logos-docusaurus-theme/src/client/theme/NavbarItem/NavbarNavLink/index.tsx
@@ -1,9 +1,10 @@
-import React from 'react'
-import Link from '@docusaurus/Link'
-import useBaseUrl from '@docusaurus/useBaseUrl'
+import { Typography } from '@acid-info/lsd-react'
import isInternalUrl from '@docusaurus/isInternalUrl'
+import Link from '@docusaurus/Link'
import { isRegexpStringMatch } from '@docusaurus/theme-common'
-import { PickIcon, Typography } from '@acid-info/lsd-react'
+import useBaseUrl from '@docusaurus/useBaseUrl'
+import React from 'react'
+import { IconExternalLink } from '../../../components/Icon/Icon'
import styles from './styles.module.css'
export default function NavbarNavLink({
@@ -35,7 +36,9 @@ export default function NavbarNavLink({
className={styles.linkContent}
>
{label}
- {isExternalLink && }
+ {isExternalLink && (
+
+ )}
),
}
diff --git a/packages/logos-docusaurus-theme/src/client/theme/NavbarItem/NavbarNavLink/styles.module.css b/packages/logos-docusaurus-theme/src/client/theme/NavbarItem/NavbarNavLink/styles.module.css
index 23a6519..a9c5a88 100644
--- a/packages/logos-docusaurus-theme/src/client/theme/NavbarItem/NavbarNavLink/styles.module.css
+++ b/packages/logos-docusaurus-theme/src/client/theme/NavbarItem/NavbarNavLink/styles.module.css
@@ -10,3 +10,12 @@
text-underline-offset: 0.3rem;
text-decoration-color: rgba(var(--lsd-text-primary), 0.6);
}
+
+.externalLinkIcon {
+ width: 8px;
+}
+
+.externalLinkIcon svg {
+ width: 100%;
+ height: auto;
+}