diff --git a/packages/docusaurus-init/templates/classic/package.json b/packages/docusaurus-init/templates/classic/package.json index 6420af2cbb..c2d09a5b02 100644 --- a/packages/docusaurus-init/templates/classic/package.json +++ b/packages/docusaurus-init/templates/classic/package.json @@ -11,7 +11,7 @@ "dependencies": { "@docusaurus/core": "^2.0.0-alpha.56", "@docusaurus/preset-classic": "^2.0.0-alpha.56", - "classnames": "^2.2.6", + "clsx": "^1.1.1", "react": "^16.8.4", "react-dom": "^16.8.4" }, diff --git a/packages/docusaurus-init/templates/classic/src/pages/index.js b/packages/docusaurus-init/templates/classic/src/pages/index.js index f24bc96214..de04f5c846 100644 --- a/packages/docusaurus-init/templates/classic/src/pages/index.js +++ b/packages/docusaurus-init/templates/classic/src/pages/index.js @@ -1,5 +1,5 @@ import React from 'react'; -import classnames from 'classnames'; +import clsx from 'clsx'; import Layout from '@theme/Layout'; import Link from '@docusaurus/Link'; import useDocusaurusContext from '@docusaurus/useDocusaurusContext'; @@ -42,7 +42,7 @@ const features = [ function Feature({imageUrl, title, description}) { const imgUrl = useBaseUrl(imageUrl); return ( -
+
{imgUrl && (
{title} @@ -61,13 +61,13 @@ function Home() { -
+

{siteConfig.title}

{siteConfig.tagline}

+
{imgUrl && (
{title} @@ -70,13 +70,13 @@ function Home() { -
+

{siteConfig.title}

{siteConfig.tagline}

+ className={clsx('margin-bottom--sm', styles.blogPostTitle)}> {isBlogPostPage ? title : {title}}
diff --git a/packages/docusaurus-theme-classic/src/theme/CodeBlock/index.js b/packages/docusaurus-theme-classic/src/theme/CodeBlock/index.js index 4aea707bb6..3cd64a3327 100644 --- a/packages/docusaurus-theme-classic/src/theme/CodeBlock/index.js +++ b/packages/docusaurus-theme-classic/src/theme/CodeBlock/index.js @@ -8,7 +8,7 @@ /* eslint-disable jsx-a11y/no-noninteractive-tabindex */ import React, {useEffect, useState, useRef} from 'react'; -import classnames from 'classnames'; +import clsx from 'clsx'; import Highlight, {defaultProps} from 'prism-react-renderer'; import Clipboard from 'clipboard'; import rangeParser from 'parse-numeric-range'; @@ -221,7 +221,7 @@ export default ({children, className: languageClassName, metastring}) => { ref={button} type="button" aria-label="Copy code to clipboard" - className={classnames(styles.copyButton, { + className={clsx(styles.copyButton, { [styles.copyButtonWithTitle]: codeBlockTitle, })} onClick={handleCopyCode}> @@ -229,7 +229,7 @@ export default ({children, className: languageClassName, metastring}) => {
diff --git a/packages/docusaurus-theme-classic/src/theme/DocItem/index.js b/packages/docusaurus-theme-classic/src/theme/DocItem/index.js index b14ccf2a3b..8d0c4c880f 100644 --- a/packages/docusaurus-theme-classic/src/theme/DocItem/index.js +++ b/packages/docusaurus-theme-classic/src/theme/DocItem/index.js @@ -13,7 +13,7 @@ import useBaseUrl from '@docusaurus/useBaseUrl'; import DocPaginator from '@theme/DocPaginator'; import useTOCHighlight from '@theme/hooks/useTOCHighlight'; -import classnames from 'classnames'; +import clsx from 'clsx'; import styles from './styles.module.css'; const LINK_CLASS_NAME = 'table-of-contents__link'; @@ -102,13 +102,10 @@ function DocItem(props) { {permalink && }
+ className={clsx('container padding-vert--lg', styles.docItemWrapper)}>
diff --git a/packages/docusaurus-theme-classic/src/theme/DocSidebar/index.js b/packages/docusaurus-theme-classic/src/theme/DocSidebar/index.js index 387c33a4fb..68e710db04 100644 --- a/packages/docusaurus-theme-classic/src/theme/DocSidebar/index.js +++ b/packages/docusaurus-theme-classic/src/theme/DocSidebar/index.js @@ -6,7 +6,7 @@ */ import React, {useState, useCallback, useEffect, useRef} from 'react'; -import classnames from 'classnames'; +import clsx from 'clsx'; import useDocusaurusContext from '@docusaurus/useDocusaurusContext'; import useUserPreferencesContext from '@theme/hooks/useUserPreferencesContext'; import useLockBodyScroll from '@theme/hooks/useLockBodyScroll'; @@ -82,12 +82,12 @@ function DocSidebarItemCategory({ return (
  • {hideOnScroll && ( @@ -207,7 +207,7 @@ function DocSidebar(props) { )}
    {showResponsiveSidebar ? ( diff --git a/packages/docusaurus-theme-classic/src/theme/Footer/index.js b/packages/docusaurus-theme-classic/src/theme/Footer/index.js index 8adcf20ca2..a680051a69 100644 --- a/packages/docusaurus-theme-classic/src/theme/Footer/index.js +++ b/packages/docusaurus-theme-classic/src/theme/Footer/index.js @@ -6,7 +6,7 @@ */ import React from 'react'; -import classnames from 'classnames'; +import clsx from 'clsx'; import Link from '@docusaurus/Link'; import useDocusaurusContext from '@docusaurus/useDocusaurusContext'; @@ -54,7 +54,7 @@ function Footer() { return (