Skip to content

Commit 4ecc71a

Browse files
author
Raphael Schweikert
committed
added second example to readme
1 parent b0318cb commit 4ecc71a

File tree

1 file changed

+194
-8
lines changed

1 file changed

+194
-8
lines changed

‎README.md‎

Lines changed: 194 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -112,21 +112,83 @@ To output the entire CSS document into a variable, just use `->__toString()`:
112112

113113
## Examples
114114

115-
### Parsed structure
115+
### Example 1 (At-Rules)
116116

117117
#### Input
118118

119+
@charset "utf-8";
120+
121+
@font-face {
122+
font-family: "CrassRoots";
123+
src: url("../media/cr.ttf")
124+
}
125+
119126
html, body {
120127
font-size: 1.6em
121128
}
122129

123-
#### Structure (var_dump flavoured)
130+
#### Structure (`var_dump()`)
124131

125132
object(CSSDocument)#2 (1) {
126133
["aContents":"CSSList":private]=>
127-
array(1) {
134+
array(3) {
128135
[0]=>
129-
object(CSSSelector)#3 (2) {
136+
object(CSSCharset)#4 (1) {
137+
["sCharset":"CSSCharset":private]=>
138+
object(CSSString)#3 (1) {
139+
["sString":"CSSString":private]=>
140+
string(5) "utf-8"
141+
}
142+
}
143+
[1]=>
144+
object(CSSAtRule)#5 (2) {
145+
["sType":"CSSAtRule":private]=>
146+
string(9) "font-face"
147+
["aRules":"CSSRuleSet":private]=>
148+
array(2) {
149+
["font-family"]=>
150+
object(CSSRule)#6 (3) {
151+
["sRule":"CSSRule":private]=>
152+
string(11) "font-family"
153+
["aValues":"CSSRule":private]=>
154+
array(1) {
155+
[0]=>
156+
array(1) {
157+
[0]=>
158+
object(CSSString)#7 (1) {
159+
["sString":"CSSString":private]=>
160+
string(10) "CrassRoots"
161+
}
162+
}
163+
}
164+
["bIsImportant":"CSSRule":private]=>
165+
bool(false)
166+
}
167+
["src"]=>
168+
object(CSSRule)#8 (3) {
169+
["sRule":"CSSRule":private]=>
170+
string(3) "src"
171+
["aValues":"CSSRule":private]=>
172+
array(1) {
173+
[0]=>
174+
array(1) {
175+
[0]=>
176+
object(CSSURL)#9 (1) {
177+
["oURL":"CSSURL":private]=>
178+
object(CSSString)#10 (1) {
179+
["sString":"CSSString":private]=>
180+
string(15) "../media/cr.ttf"
181+
}
182+
}
183+
}
184+
}
185+
["bIsImportant":"CSSRule":private]=>
186+
bool(false)
187+
}
188+
}
189+
}
190+
[2]=>
191+
object(CSSSelector)#11 (2) {
130192
["aSelector":"CSSSelector":private]=>
131193
array(2) {
132194
[0]=>
@@ -137,15 +199,15 @@ To output the entire CSS document into a variable, just use `->__toString()`:
137199
["aRules":"CSSRuleSet":private]=>
138200
array(1) {
139201
["font-size"]=>
140-
object(CSSRule)#4 (3) {
202+
object(CSSRule)#12 (3) {
141203
["sRule":"CSSRule":private]=>
142204
string(9) "font-size"
143205
["aValues":"CSSRule":private]=>
144206
array(1) {
145207
[0]=>
146208
array(1) {
147209
[0]=>
148-
object(CSSSize)#5 (2) {
210+
object(CSSSize)#13 (2) {
149211
["fSize":"CSSSize":private]=>
150212
float(1.6)
151213
["sUnit":"CSSSize":private]=>
@@ -161,14 +223,138 @@ To output the entire CSS document into a variable, just use `->__toString()`:
161223
}
162224
}
163225

164-
#### `__toString()` output
226+
#### Output (`__toString()`)
227+
228+
@charset "utf-8";@font-face {font-family: "CrassRoots";src: url("../media/cr.ttf");}html, body {font-size: 1.6em;}
229+
230+
### Example 2 (Values)
231+
232+
#### Input
233+
234+
#header {
235+
margin: 10px 2em 1cm 2%;
236+
font-family: Verdana, Helvetica, "Gill Sans", sans-serif;
237+
color: red !important;
238+
}
239+
240+
#### Structure (`var_dump()`)
241+
242+
object(CSSDocument)#2 (1) {
243+
["aContents":"CSSList":private]=>
244+
array(1) {
245+
[0]=>
246+
object(CSSSelector)#3 (2) {
247+
["aSelector":"CSSSelector":private]=>
248+
array(1) {
249+
[0]=>
250+
string(7) "#header"
251+
}
252+
["aRules":"CSSRuleSet":private]=>
253+
array(3) {
254+
["margin"]=>
255+
object(CSSRule)#4 (3) {
256+
["sRule":"CSSRule":private]=>
257+
string(6) "margin"
258+
["aValues":"CSSRule":private]=>
259+
array(4) {
260+
[0]=>
261+
array(1) {
262+
[0]=>
263+
object(CSSSize)#5 (2) {
264+
["fSize":"CSSSize":private]=>
265+
float(10)
266+
["sUnit":"CSSSize":private]=>
267+
string(2) "px"
268+
}
269+
}
270+
[1]=>
271+
array(1) {
272+
[0]=>
273+
object(CSSSize)#6 (2) {
274+
["fSize":"CSSSize":private]=>
275+
float(2)
276+
["sUnit":"CSSSize":private]=>
277+
string(2) "em"
278+
}
279+
}
280+
[2]=>
281+
array(1) {
282+
[0]=>
283+
object(CSSSize)#7 (2) {
284+
["fSize":"CSSSize":private]=>
285+
float(1)
286+
["sUnit":"CSSSize":private]=>
287+
string(2) "cm"
288+
}
289+
}
290+
[3]=>
291+
array(1) {
292+
[0]=>
293+
object(CSSSize)#8 (2) {
294+
["fSize":"CSSSize":private]=>
295+
float(2)
296+
["sUnit":"CSSSize":private]=>
297+
string(1) "%"
298+
}
299+
}
300+
}
301+
["bIsImportant":"CSSRule":private]=>
302+
bool(false)
303+
}
304+
["font-family"]=>
305+
object(CSSRule)#9 (3) {
306+
["sRule":"CSSRule":private]=>
307+
string(11) "font-family"
308+
["aValues":"CSSRule":private]=>
309+
array(1) {
310+
[0]=>
311+
array(4) {
312+
[0]=>
313+
string(7) "Verdana"
314+
[1]=>
315+
string(9) "Helvetica"
316+
[2]=>
317+
object(CSSString)#10 (1) {
318+
["sString":"CSSString":private]=>
319+
string(9) "Gill Sans"
320+
}
321+
[3]=>
322+
string(10) "sans-serif"
323+
}
324+
}
325+
["bIsImportant":"CSSRule":private]=>
326+
bool(false)
327+
}
328+
["color"]=>
329+
object(CSSRule)#11 (3) {
330+
["sRule":"CSSRule":private]=>
331+
string(5) "color"
332+
["aValues":"CSSRule":private]=>
333+
array(1) {
334+
[0]=>
335+
array(1) {
336+
[0]=>
337+
string(3) "red"
338+
}
339+
}
340+
["bIsImportant":"CSSRule":private]=>
341+
bool(true)
342+
}
343+
}
344+
}
345+
}
346+
}
165347

166-
html, body {font-size: 1.6em;}
348+
#### Output (`__toString()`)
167349

350+
#header {margin: 10px 2em 1cm 2%;font-family: Verdana, Helvetica, "Gill Sans", sans-serif;color: red !important;}
168351

169352
## To-Do
170353

171354
* More convenience methods [like `selectorsWithElement($sId/Class/TagName)`, `removeSelector($oSelector)`, `attributesOfType($sType)`, `removeAttributesOfType($sType)`]
172355
* Options for output (compact, verbose, etc.)
173356
* Support for @namespace
357+
* Named color support (using `CSSColor` instead of an anonymous string literal)
358+
* Allow for function-like property values other than hsl(), rgb(), rgba(), and url() (like -moz-linear-gradient(), for example).
174359
* Test suite
360+
* Adopt lenient parsing rules

0 commit comments

Comments
 (0)