You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: ReadMe.md
+27-20Lines changed: 27 additions & 20 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -5,16 +5,16 @@
5
5
6
6
Generating CSS patches (just like a diff).
7
7
8
-
## Reasons to use
8
+
## Use cases
9
9
10
10
### Themes generation
11
11
12
-
The easiest way to make a new theme is just copy the file and change some stuff
13
-
or if you use preprocessor (such as SCSS, Less, etc.) you can just change some
14
-
variables and get a new style.
12
+
The easiest way to make a new theme is to copy the file and change some stuff
13
+
or, if you use a preprocessor (such as SCSS, Less, etc.), change some
14
+
variables and get a new stylesheet.
15
15
16
-
But serving files with big amount of literally the same code is not a good idea,
17
-
so this is when css-patch can help you.
16
+
But serving files with big amount of the same code is not a good idea, so this
17
+
is when css-patch can help you.
18
18
19
19
You can pass 2 stylesheets (`original`/`base` and `expected`) to `generateCSSPatch`
20
20
and get a new stylesheet. This new stylesheet is intended to be applied after
@@ -24,9 +24,9 @@ the `original` one.
24
24
25
25
### Extracting difference
26
26
27
-
Imagine if you have two versions of the same CSS.
27
+
Imagine that you have two versions of the same CSS stylesheet.
28
28
29
-
You can use this module to get the "difference" between them.
29
+
By using this module you can get the difference between them.
30
30
31
31
## Install
32
32
@@ -46,26 +46,26 @@ npm i css-patch
46
46
47
47
[Read the docs on GitHub pages.](https://zekfad.github.io/css-patch/)
48
48
49
-
For advanced usage see the docs for [`transformCSS`](https://zekfad.github.io/css-patch/global.html#transformCSS) function and [`CSSTransformerBase`](https://zekfad.github.io/css-patch/CSSTransformerBase.html) class.
49
+
For advanced usage see the docs for [`transformCSS`](https://zekfad.github.io/css-patch/global.html#transformCSS) function and [`CSSTransformerBase`](https://zekfad.github.io/css-patch/CSSTransformers.CSSTransformerBase.html) class.
50
50
51
51
## Possible caveats
52
52
53
-
### `unset`
53
+
### `unset`
54
54
55
-
If something existed in `original` stylesheet missing in `expected` one,
56
-
will result of being transformed to `<something>: unset;`.
55
+
Declarations missing in `expected` stylesheet, but present in `original` one,
56
+
will be set to `unset`.
57
57
58
58
### Combined rule orders
59
59
60
-
Logically the same but with a different order combined rules (e.g.`.a,.b` and `.b,.a`)
60
+
Logically the same but with a different order combined rules (e.g.`.a,.b` and `.b,.a`)
61
61
will be considered as a different rules.
62
62
63
63
### Merged rules
64
64
65
-
If rules have exact the same name their declarations would be merged (later appeared
66
-
declarations will be a higher priority).
65
+
Rules with the same name will have their declarations merged with each other,
66
+
overriding previous declarations in the order they appear.
67
67
68
-
For example `.a{a:1;c:3;}.a{a:2;b:2;}` will be threat as `.a{a:2;b:2;c;3}`.
68
+
For example `.a{a:1;c:3;}.a{a:2;b:2;}` will be treated as `.a{a:2;b:2;c;3}`.
69
69
70
70
### Sorting
71
71
@@ -91,9 +91,16 @@ import { generateCSSPatch, } from 'css-patch';
0 commit comments