1
- import React from 'react' ;
2
- import clsx from 'clsx' ;
3
- import styles from './styles.module.css' ;
1
+ /* eslint-disable import/no-unresolved */
2
+ /* eslint-disable @typescript-eslint/no-var-requires */
3
+ /* eslint-disable global-require */
4
+ import React from 'react'
5
+ import clsx from 'clsx'
6
+ import styles from './styles.module.css'
4
7
5
8
type FeatureItem = {
6
- title : string ;
7
- Svg : React . ComponentType < React . ComponentProps < 'svg' > > ;
8
- description : JSX . Element ;
9
- } ;
9
+ title : string
10
+ Svg : React . ComponentType < React . ComponentProps < 'svg' > >
11
+ description : JSX . Element
12
+ }
10
13
11
14
const FeatureList : FeatureItem [ ] = [
12
15
{
13
16
title : 'Easy to Use' ,
14
- Svg : require ( '@site/static/img/undraw_docusaurus_mountain .svg' ) . default ,
17
+ Svg : require ( '@site/static/img/only-tooltip-top .svg' ) . default ,
15
18
description : (
16
- < >
17
- Docusaurus was designed from the ground up to be easily installed and
18
- used to get your website up and running quickly.
19
- </ >
19
+ < > ReactTooltip was designed with love from the ground up to be easily installed and used.</ >
20
20
) ,
21
21
} ,
22
22
{
23
- title : 'Focus on What Matters ' ,
24
- Svg : require ( '@site/static/img/undraw_docusaurus_tree .svg' ) . default ,
23
+ title : 'Open Source ' ,
24
+ Svg : require ( '@site/static/img/github .svg' ) . default ,
25
25
description : (
26
26
< >
27
- Docusaurus lets you focus on your docs, and we'll do the chores. Go
28
- ahead and move your docs into the < code > docs </ code > directory .
27
+ An Open Source project built by developers to developers, we work together with the
28
+ community to always try to improve ReactTooltip .
29
29
</ >
30
30
) ,
31
31
} ,
32
32
{
33
- title : 'Powered by React ' ,
34
- Svg : require ( '@site/static/img/undraw_docusaurus_react .svg' ) . default ,
33
+ title : 'Focus on What Matters ' ,
34
+ Svg : require ( '@site/static/img/happy-face-tooltip .svg' ) . default ,
35
35
description : (
36
36
< >
37
- Extend or customize your website layout by reusing React. Docusaurus can
38
- be extended while reusing the same header and footer .
37
+ Don’t waste your time building a tooltip component from scratch, just use ReactTooltip
38
+ and focus on new features or bug fixes .
39
39
</ >
40
40
) ,
41
41
} ,
42
- ] ;
42
+ ]
43
43
44
- function Feature ( { title, Svg, description} : FeatureItem ) {
44
+ function Feature ( { title, Svg, description } : FeatureItem ) {
45
45
return (
46
46
< div className = { clsx ( 'col col--4' ) } >
47
47
< div className = "text--center" >
@@ -52,7 +52,7 @@ function Feature({title, Svg, description}: FeatureItem) {
52
52
< p > { description } </ p >
53
53
</ div >
54
54
</ div >
55
- ) ;
55
+ )
56
56
}
57
57
58
58
export default function HomepageFeatures ( ) : JSX . Element {
@@ -61,10 +61,11 @@ export default function HomepageFeatures(): JSX.Element {
61
61
< div className = "container" >
62
62
< div className = "row" >
63
63
{ FeatureList . map ( ( props , idx ) => (
64
+ // eslint-disable-next-line react/no-array-index-key
64
65
< Feature key = { idx } { ...props } />
65
66
) ) }
66
67
</ div >
67
68
</ div >
68
69
</ section >
69
- ) ;
70
+ )
70
71
}
0 commit comments