Skip to content

Commit 1e9f1d9

Browse files
committed
Docs.
1 parent 3c894bf commit 1e9f1d9

File tree

1 file changed

+7
-7
lines changed

1 file changed

+7
-7
lines changed

README.md

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ Seamless CSS modules for React.
77

88
## What's the Problem?
99

10-
[CSS modules](https://github.com/css-modules/css-modules) are awesome. If you are not familiar with CSS modules, it is a concept of using a module bundler such as webpack to load CSS scoped to a particular document. CSS modules loader will generate a unique name for a each CSS class at the time of loading the CSS. Refer to [webpack-demo](https://css-modules.github.io/webpack-demo/) for a full example.
10+
[CSS modules](https://github.com/css-modules/css-modules) are awesome. If you are not familiar with CSS modules, it is a concept of using a module bundler such as [webpack](http://webpack.github.io/docs/) to load CSS scoped to a particular document. CSS modules loader will generate a unique name for a each CSS class at the time of loading the CSS. Refer to [webpack-demo](https://css-modules.github.io/webpack-demo/) for a full example.
1111

1212
In the context of React, this looks like this:
1313

@@ -27,10 +27,10 @@ export default class Car extends React.Component {
2727

2828
Awesome!
2929

30-
However, there are a several disadvantages of this approach:
30+
However, this approach has several disadvantages:
3131

3232
* You have to use `camelCael` CSS class names.
33-
* You have to use `styles` object whenever assigning a class.
33+
* You have to use `styles` object whenever constructing a `className`.
3434

3535
React CSS Modules enables seamless CSS modules for React, e.g.
3636

@@ -51,6 +51,10 @@ class Car extends React.Component {
5151
export default CSSModules(Car, styles);
5252
```
5353

54+
`CSSModules` extends `Car` `render` method. It will look for CSS classes in `./car.css` that match CSS class names in `ReactElement` `className` and will replace/append the matching unique class names to `className` declaration.
55+
56+
Refer to the [react-css-modules-examples](https://github.com/gajus/react-css-modules-examples) repository for a complete usage example.
57+
5458
Awesome!
5559

5660
## Usage
@@ -94,10 +98,6 @@ export default CSSModules(Car, styles);
9498

9599
Thats it!
96100

97-
`CSSModules` extends `Car` `render` method. It will look for CSS classes in `./car.css` that match `ReactElement` `className` and will append the matching unique class names to `className` declaration.
98-
99-
Refer to the [react-css-modules-examples](https://github.com/gajus/react-css-modules-examples) repository for a complete usage example.
100-
101101
## Multiple CSS Classes
102102

103103
CSS modules promote composition pattern, i.e. every CSS class should define all properties required to describe the element, e.g.

0 commit comments

Comments
 (0)