chore(v2): replace classnames with clsx (#2895)

This commit is contained in:
Alexey Pyltsyn 2020-06-07 08:40:06 +03:00 committed by GitHub
parent 600ef7ae28
commit afe9ff91a4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
26 changed files with 76 additions and 80 deletions

View file

@ -9,7 +9,7 @@ import React, {useEffect} from 'react';
import Layout from '@theme/Layout';
import canny from '../../scripts/canny';
import classnames from 'classnames';
import clsx from 'clsx';
import styles from './styles.module.css';
const BOARD_TOKEN = '054e0e53-d951-b14c-7e74-9eb8f9ed2f91';
@ -30,7 +30,7 @@ function Feedback() {
title="Feedback"
description="Docusaurus 2 Feedback page">
<main
className={classnames(
className={clsx(
'container',
'margin-vert--xl',
styles.feedbackBackground,

View file

@ -13,7 +13,7 @@ import useBaseUrl from '@docusaurus/useBaseUrl';
import Image from '@theme/IdealImage';
import Layout from '@theme/Layout';
import classnames from 'classnames';
import clsx from 'clsx';
import styles from './styles.module.css';
@ -69,8 +69,7 @@ function Home() {
title={tagline}
description={customFields.description}>
<main>
<div
className={classnames(styles.announcement, styles.announcementDark)}>
<div className={clsx(styles.announcement, styles.announcementDark)}>
<div className={styles.announcementInner}>
Black Lives Matter.{' '}
<Link to="https://support.eji.org/give/153413/#!/donation/checkout">
@ -112,8 +111,7 @@ function Home() {
</div>
</div>
</div>
<div
className={classnames(styles.announcement, styles.announcementDark)}>
<div className={clsx(styles.announcement, styles.announcementDark)}>
<div className={styles.announcementInner}>
Coming from v1? Check out our{' '}
<Link to={useBaseUrl('/docs/migrating-from-v1-to-v2')}>
@ -131,7 +129,7 @@ function Home() {
alt="Powered by MDX"
src={useBaseUrl('img/undraw_typewriter.svg')}
/>
<h2 className={classnames(styles.featureHeading)}>
<h2 className={clsx(styles.featureHeading)}>
Powered by Markdown
</h2>
<p className="padding-horiz--md">
@ -148,7 +146,7 @@ function Home() {
className={styles.featureImage}
src={useBaseUrl('img/undraw_react.svg')}
/>
<h2 className={classnames(styles.featureHeading)}>
<h2 className={clsx(styles.featureHeading)}>
Built Using React
</h2>
<p className="padding-horiz--md">
@ -163,7 +161,7 @@ function Home() {
className={styles.featureImage}
src={useBaseUrl('img/undraw_around_the_world.svg')}
/>
<h2 className={classnames(styles.featureHeading)}>
<h2 className={clsx(styles.featureHeading)}>
Ready for Translations
</h2>
<p className="padding-horiz--md">
@ -181,7 +179,7 @@ function Home() {
className={styles.featureImage}
src={useBaseUrl('img/undraw_version_control.svg')}
/>
<h2 className={classnames(styles.featureHeading)}>
<h2 className={clsx(styles.featureHeading)}>
Document Versioning
</h2>
<p className="padding-horiz--md">
@ -196,9 +194,7 @@ function Home() {
className={styles.featureImage}
src={useBaseUrl('img/undraw_algolia.svg')}
/>
<h2 className={classnames(styles.featureHeading)}>
Content Search
</h2>
<h2 className={clsx(styles.featureHeading)}>Content Search</h2>
<p className="padding-horiz--md">
Make it easy for your community to find what they need in your
documentation. We proudly support Algolia documentation
@ -208,7 +204,7 @@ function Home() {
</div>
</div>
</div>
<div className={classnames(styles.section, styles.sectionAlt)}>
<div className={clsx(styles.section, styles.sectionAlt)}>
<div className="container">
<div className="row">
{QUOTES.map((quote) => (

View file

@ -10,7 +10,7 @@ import React, {useEffect} from 'react';
import Image from '@theme/IdealImage';
import Layout from '@theme/Layout';
import classnames from 'classnames';
import clsx from 'clsx';
import styles from './styles.module.css';
import users from '../../data/users';
@ -29,7 +29,7 @@ function Showcase() {
<div className="row">
{users.map((user) => (
<div key={user.title} className="col col--4 margin-bottom--lg">
<div className={classnames('card', styles.showcaseUser)}>
<div className={clsx('card', styles.showcaseUser)}>
<div className="card__image">
<Image img={user.preview} alt={user.title} />
</div>