Skip to content

Commit 2c228ee

Browse files
Updated README
1 parent bde1a00 commit 2c228ee

File tree

1 file changed

+29
-27
lines changed

1 file changed

+29
-27
lines changed

README.md

+29-27
Original file line numberDiff line numberDiff line change
@@ -27,18 +27,23 @@ It converts this:
2727

2828
```css
2929
section#some-id {
30-
--text: 'This is text!';
30+
/* {{ This is text inside }} */
3131
--attr-title: 'Title';
32+
3233
background: red;
3334
color: aliceblue;
3435
}
3536
section#some-id header[data-attribute='v'] {
36-
--text: 'This is the header text';
37+
/* {{ This is the header text }} */
38+
3739
color: blue;
3840
}
3941
section#some-id span {
40-
--text: 'Text of span';
41-
--text-after: 'Text after';
42+
/*
43+
{{ Text of span }}
44+
Text after
45+
*/
46+
4247
color: peru;
4348
}
4449
```
@@ -47,9 +52,10 @@ To this:
4752

4853
```html
4954
<section id="some-id" title="Title">
50-
This is text!
55+
This is text inside
5156
<header data-attribute="v">This is the header text</header>
52-
<span> Text of span </span>Text after
57+
<span>Text of span</span>
58+
Text after
5359
</section>
5460
```
5561

@@ -137,35 +143,31 @@ a[title='Title!'] {
137143
</a>
138144
```
139145

140-
You can also add **text** to the tag via `--text` property:
141-
142-
```css
143-
div {
144-
--text: 'The battle continues again';
145-
}
146-
```
147-
148-
```html
149-
<div>The battle continues again</div>
150-
```
151-
152-
In order to insert a tag _between the text_, you will definitely need special properties that allow you to enter text before and after the tag: `--text-before` and `--text-after`
146+
You can add text inside the tag using **comments** or **variables**:
153147

154148
```css
149+
/* The old way is not recommended for use */
155150
div {
156-
--text: 'The text inside the div';
151+
--text-before: 'The battle ';
152+
--text: 'continues';
153+
--text-after: ' again';
157154
}
158-
div span {
159-
--text: ' The text inside span';
160-
--text-before: '| before';
161-
--text-after: ' after';
155+
/* New way, recommended for use. Curly braces are required! */
156+
section {
157+
/*
158+
The battle
159+
{{ continues }}
160+
again
161+
*/
162162
}
163163
```
164164

165165
```html
166-
<div>
167-
The text inside the div | before<span> The text inside span</span> after
168-
</div>
166+
The battle <div>continues</div> again
167+
168+
The battle
169+
<section> continues </section>
170+
again
169171
```
170172

171173
## API

0 commit comments

Comments
 (0)