3pp-mirror/docusaurus
1
0
Fork 0
mirror of https://github.com/facebook/docusaurus.git synced 2025-08-06 02:08:55 +02:00
Code Issues Projects Releases Packages Wiki Activity

refactor: better external link icon positioning (#6994)

Browse source
This commit is contained in:
Alexey Pyltsyn 2022-03-25 13:06:47 +03:00 • committed by GitHub
parent 87592bca03
commit e606e62a6a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 14 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

15
packages/docusaurus-theme-classic/src/theme/DocSidebarItem/index.tsx
View file

@ -250,6 +250,7 @@ function DocSidebarItemLink({
}: Props & {item: PropSidebarItemLink}) { }: Props & {item: PropSidebarItemLink}) {
const {href, label, className} = item; const {href, label, className} = item;
const isActive = isActiveSidebarItem(item, activePath); const isActive = isActiveSidebarItem(item, activePath);
const isInternalLink = isInternalUrl(href);
return ( return (
<li <li
className={clsx( className={clsx(
@ -260,17 +261,21 @@ function DocSidebarItemLink({
)} )}
key={label}> key={label}>
<Link <Link
className={clsx('menu__link', { className={clsx(
'menu__link--active': isActive, 'menu__link',
})} !isInternalLink && styles.menuExternalLink,
{
'menu__link--active': isActive,
},
)}
aria-current={isActive ? 'page' : undefined} aria-current={isActive ? 'page' : undefined}
to={href} to={href}
{...(isInternalUrl(href) && { {...(isInternalLink && {
onClick: onItemClick ? () => onItemClick(item) : undefined, onClick: onItemClick ? () => onItemClick(item) : undefined,
})} })}
{...props}> {...props}>
{label} {label}
{!isInternalUrl(href) && <IconExternalLink />} {!isInternalLink && <IconExternalLink />}
</Link> </Link>
</li> </li>
); );

4
packages/docusaurus-theme-classic/src/theme/DocSidebarItem/styles.module.css
View file

@ -11,3 +11,7 @@
var(--ifm-menu-link-padding-horizontal); var(--ifm-menu-link-padding-horizontal);
} }
} }
.menuExternalLink {
align-items: center;
}

2
packages/docusaurus-theme-classic/src/theme/IconExternalLink/styles.module.css
View file

@ -7,6 +7,4 @@
.iconExternalLink { .iconExternalLink {
margin-left: 0.3rem; margin-left: 0.3rem;
position: relative;
top: 1px;
} }