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

refactor(theme-classic): little breadcrumbs improvements (#6932)

Browse source
This commit is contained in:
Alexey Pyltsyn 2022-03-17 21:48:04 +03:00 • committed by GitHub
parent cc0bceab9c
commit 9b4ba78f45
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 5 additions and 19 deletions
Download patch file Download diff file Expand all files Collapse all files

5
packages/docusaurus-theme-classic/src/theme/DocBreadcrumbs/index.tsx
View file

@ -24,7 +24,7 @@ function BreadcrumbsItemLink({
children: ReactNode; children: ReactNode;
href?: string; href?: string;
}): JSX.Element { }): JSX.Element {
const className = clsx('breadcrumbs__link', styles.breadcrumbsItemLink); const className = 'breadcrumbs__link';
return href ? ( return href ? (
<Link className={className} href={href} itemProp="item"> <Link className={className} href={href} itemProp="item">
<span itemProp="name">{children}</span> <span itemProp="name">{children}</span>
@ -98,7 +98,8 @@ export default function DocBreadcrumbs(): JSX.Element | null {
key={idx} key={idx}
active={idx === breadcrumbs.length - 1} active={idx === breadcrumbs.length - 1}
index={idx}> index={idx}>
<BreadcrumbsItemLink href={item.href}> <BreadcrumbsItemLink
href={idx < breadcrumbs.length - 1 ? item.href : undefined}>
{item.label} {item.label}
</BreadcrumbsItemLink> </BreadcrumbsItemLink>
</BreadcrumbsItem> </BreadcrumbsItem>

19
packages/docusaurus-theme-classic/src/theme/DocBreadcrumbs/styles.module.css
View file

@ -6,21 +6,6 @@
*/ */
.breadcrumbsContainer { .breadcrumbsContainer {
margin-bottom: 0.4rem; --ifm-breadcrumb-size-multiplier: 0.8;
} margin-bottom: 0.8rem;
.breadcrumbsItemLink {
--ifm-breadcrumb-size-multiplier: 0.7 !important;
margin-bottom: 0.4rem;
background: var(--ifm-color-gray-100);
}
html[data-theme='dark'] .breadcrumbsItemLink {
background-color: var(--ifm-color-gray-900);
}
@media (min-width: 997px) {
.breadcrumbsItemLink {
--ifm-breadcrumb-size-multiplier: 0.8;
}
} }