3pp-mirror/docusaurus
1
0
Fork 0
mirror of https://github.com/facebook/docusaurus.git synced 2025-07-25 20:48:50 +02:00
Code Issues Projects Releases Packages Wiki Activity

fix(v2): add thin scrollbar to proper element in TOC (#3726)

Browse source
This commit is contained in:
Alexey Pyltsyn 2020-11-12 14:45:47 +03:00 • committed by GitHub
parent 049634a927
commit 6cccbf5f7a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 3 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

8
packages/docusaurus-theme-classic/src/theme/TOC/index.tsx
View file

@ -6,7 +6,7 @@
*/ */
import React from 'react'; import React from 'react';
import clsx from 'clsx';
import useTOCHighlight from '@theme/hooks/useTOCHighlight'; import useTOCHighlight from '@theme/hooks/useTOCHighlight';
import type {TOCProps} from '@theme/TOC'; import type {TOCProps} from '@theme/TOC';
import styles from './styles.module.css'; import styles from './styles.module.css';
@ -23,9 +23,7 @@ function Headings({headings, isChild}: TOCProps & {isChild?: boolean}) {
return ( return (
<ul <ul
className={ className={
isChild isChild ? '' : 'table-of-contents table-of-contents__left-border'
? ''
: 'table-of-contents table-of-contents__left-border thin-scrollbar'
}> }>
{headings.map((heading) => ( {headings.map((heading) => (
<li key={heading.id}> <li key={heading.id}>
@ -46,7 +44,7 @@ function Headings({headings, isChild}: TOCProps & {isChild?: boolean}) {
function TOC({headings}: TOCProps): JSX.Element { function TOC({headings}: TOCProps): JSX.Element {
useTOCHighlight(LINK_CLASS_NAME, ACTIVE_LINK_CLASS_NAME, TOP_OFFSET); useTOCHighlight(LINK_CLASS_NAME, ACTIVE_LINK_CLASS_NAME, TOP_OFFSET);
return ( return (
<div className={styles.tableOfContents}> <div className={clsx(styles.tableOfContents, 'thin-scrollbar')}>
<Headings headings={headings} /> <Headings headings={headings} />
</div> </div>
); );