mirror of
https://github.com/wavetermdev/docusaurus-og.git
synced 2026-08-05 13:46:35 -07:00
fix: update the external link icon
This commit is contained in:
@@ -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 => (
|
||||
<FullscreenExitSvg />
|
||||
</Icon>
|
||||
)
|
||||
|
||||
export const IconExternalLink = (props: TIconProps): JSX.Element => (
|
||||
<Icon {...props}>
|
||||
<ExternalLinkSvg />
|
||||
</Icon>
|
||||
)
|
||||
|
||||
@@ -0,0 +1,3 @@
|
||||
<svg width="6" height="7" viewBox="0 0 6 7" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M0.5 6L5.5 1M5.5 1C5.5 1 2.45262 1 0.5 1M5.5 1V6" stroke="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 175 B |
@@ -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 && <PickIcon color="primary" />}
|
||||
{isExternalLink && (
|
||||
<IconExternalLink className={styles.externalLinkIcon} />
|
||||
)}
|
||||
</Typography>
|
||||
),
|
||||
}
|
||||
|
||||
+9
@@ -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;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user