Changeset View
Changeset View
Standalone View
Standalone View
autotests/reference/highlight.scss.ref
Show First 20 Lines • Show All 356 Lines • ▼ Show 20 Line(s) | |||||
357 | <Normal Text> </Normal Text><Property>width</Property><Normal Text>: </Normal Text><Variable>$width</Variable><Separator Symbol>;</Separator Symbol><br/> | 357 | <Normal Text> </Normal Text><Property>width</Property><Normal Text>: </Normal Text><Variable>$width</Variable><Separator Symbol>;</Separator Symbol><br/> | ||
358 | <Normal Text>}</Normal Text><br/> | 358 | <Normal Text>}</Normal Text><br/> | ||
359 | <Normal Text></Normal Text><br/> | 359 | <Normal Text></Normal Text><br/> | ||
360 | <Selector Id>#sidebar</Selector Id><Normal Text> {</Normal Text><br/> | 360 | <Selector Id>#sidebar</Selector Id><Normal Text> {</Normal Text><br/> | ||
361 | <Normal Text> </Normal Text><Property>width</Property><Normal Text>: </Normal Text><Variable>$width</Variable><Separator Symbol>;</Separator Symbol><br/> | 361 | <Normal Text> </Normal Text><Property>width</Property><Normal Text>: </Normal Text><Variable>$width</Variable><Separator Symbol>;</Separator Symbol><br/> | ||
362 | <Normal Text>}</Normal Text><br/> | 362 | <Normal Text>}</Normal Text><br/> | ||
363 | <Normal Text></Normal Text><br/> | 363 | <Normal Text></Normal Text><br/> | ||
364 | <At Rule>@mixin</At Rule><Normal Text> </Normal Text><Function>firefox-message</Function><Normal Text>(</Normal Text><Variable>$selector</Variable><Normal Text>) {</Normal Text><br/> | 364 | <At Rule>@mixin</At Rule><Normal Text> </Normal Text><Function>firefox-message</Function><Normal Text>(</Normal Text><Variable>$selector</Variable><Normal Text>) {</Normal Text><br/> | ||
365 | <Normal Text> </Normal Text><Selector Tag>body</Selector Tag><Selector Class>.firefox</Selector Class><Normal Text> </Normal Text><Variable>#{$selector}</Variable><Selector Pseudo>:before</Selector Pseudo><Normal Text> {</Normal Text><br/> | 365 | <Normal Text> </Normal Text><Selector Tag>body</Selector Tag><Selector Class>.firefox</Selector Class><Normal Text> </Normal Text><Interpolation>#{</Interpolation><Variable>$selector</Variable><Interpolation>}</Interpolation><Selector Pseudo>:before</Selector Pseudo><Normal Text> {</Normal Text><br/> | ||
366 | <Normal Text> </Normal Text><Property>content</Property><Normal Text>: </Normal Text><String>"Hi, Firefox users!"</String><Separator Symbol>;</Separator Symbol><br/> | 366 | <Normal Text> </Normal Text><Property>content</Property><Normal Text>: </Normal Text><String>"Hi, Firefox users!"</String><Separator Symbol>;</Separator Symbol><br/> | ||
367 | <Normal Text> }</Normal Text><br/> | 367 | <Normal Text> }</Normal Text><br/> | ||
368 | <Normal Text>}</Normal Text><br/> | 368 | <Normal Text>}</Normal Text><br/> | ||
369 | <Normal Text></Normal Text><br/> | 369 | <Normal Text></Normal Text><br/> | ||
370 | <At Rule>@include</At Rule><Normal Text> </Normal Text><Function>firefox-message(</Function><String>".header"</String><Function>)</Function><Separator Symbol>;</Separator Symbol><br/> | 370 | <At Rule>@include</At Rule><Normal Text> </Normal Text><Function>firefox-message(</Function><String>".header"</String><Function>)</Function><Separator Symbol>;</Separator Symbol><br/> | ||
371 | <Normal Text></Normal Text><br/> | 371 | <Normal Text></Normal Text><br/> | ||
372 | <Variable>$map</Variable><Normal Text>: (key1: value1</Normal Text><Separator Symbol>,</Separator Symbol><Normal Text> key2: value2</Normal Text><Separator Symbol>,</Separator Symbol><Normal Text> key3: value3)</Normal Text><Separator Symbol>;</Separator Symbol><br/> | 372 | <Variable>$map</Variable><Normal Text>: (key1: value1</Normal Text><Separator Symbol>,</Separator Symbol><Normal Text> key2: value2</Normal Text><Separator Symbol>,</Separator Symbol><Normal Text> key3: value3)</Normal Text><Separator Symbol>;</Separator Symbol><br/> | ||
373 | <Normal Text></Normal Text><br/> | 373 | <Normal Text></Normal Text><br/> | ||
374 | <Selector Tag>p</Selector Tag><Normal Text> {</Normal Text><br/> | 374 | <Selector Tag>p</Selector Tag><Normal Text> {</Normal Text><br/> | ||
375 | <Normal Text> </Normal Text><Property>font</Property><Normal Text>: </Normal Text><Number>10</Number><Unit>px</Unit><Operator>/</Operator><Number>8</Number><Unit>px</Unit><Separator Symbol>;</Separator Symbol><Normal Text> </Normal Text><Comment>// Plain CSS, no division</Comment><br/> | 375 | <Normal Text> </Normal Text><Property>font</Property><Normal Text>: </Normal Text><Number>10</Number><Unit>px</Unit><Operator>/</Operator><Number>8</Number><Unit>px</Unit><Separator Symbol>;</Separator Symbol><Normal Text> </Normal Text><Comment>// Plain CSS, no division</Comment><br/> | ||
376 | <Normal Text> </Normal Text><Variable>$width</Variable><Normal Text>: </Normal Text><Number>1000</Number><Unit>px</Unit><Separator Symbol>;</Separator Symbol><br/> | 376 | <Normal Text> </Normal Text><Variable>$width</Variable><Normal Text>: </Normal Text><Number>1000</Number><Unit>px</Unit><Separator Symbol>;</Separator Symbol><br/> | ||
377 | <Normal Text> </Normal Text><Property>width</Property><Normal Text>: </Normal Text><Variable>$width</Variable><Operator>/</Operator><Number>2</Number><Separator Symbol>;</Separator Symbol><Normal Text> </Normal Text><Comment>// Uses a variable, does division</Comment><br/> | 377 | <Normal Text> </Normal Text><Property>width</Property><Normal Text>: </Normal Text><Variable>$width</Variable><Operator>/</Operator><Number>2</Number><Separator Symbol>;</Separator Symbol><Normal Text> </Normal Text><Comment>// Uses a variable, does division</Comment><br/> | ||
378 | <Normal Text> </Normal Text><Property>width</Property><Normal Text>: </Normal Text><Function>round(</Function><Number>1.5</Number><Function>)</Function><Operator>/</Operator><Number>2</Number><Separator Symbol>;</Separator Symbol><Normal Text> </Normal Text><Comment>// Uses a function, does division</Comment><br/> | 378 | <Normal Text> </Normal Text><Property>width</Property><Normal Text>: </Normal Text><Function>round(</Function><Number>1.5</Number><Function>)</Function><Operator>/</Operator><Number>2</Number><Separator Symbol>;</Separator Symbol><Normal Text> </Normal Text><Comment>// Uses a function, does division</Comment><br/> | ||
379 | <Normal Text> </Normal Text><Property>height</Property><Normal Text>: (</Normal Text><Number>500</Number><Unit>px</Unit><Operator>/</Operator><Number>2</Number><Normal Text>)</Normal Text><Separator Symbol>;</Separator Symbol><Normal Text> </Normal Text><Comment>// Uses parentheses, does division</Comment><br/> | 379 | <Normal Text> </Normal Text><Property>height</Property><Normal Text>: (</Normal Text><Number>500</Number><Unit>px</Unit><Operator>/</Operator><Number>2</Number><Normal Text>)</Normal Text><Separator Symbol>;</Separator Symbol><Normal Text> </Normal Text><Comment>// Uses parentheses, does division</Comment><br/> | ||
380 | <Normal Text> </Normal Text><Property>margin-left</Property><Normal Text>: </Normal Text><Number>5</Number><Unit>px</Unit><Normal Text> </Normal Text><Operator>+</Operator><Normal Text> </Normal Text><Number>8</Number><Unit>px</Unit><Operator>/</Operator><Number>2</Number><Unit>px</Unit><Separator Symbol>;</Separator Symbol><Normal Text> </Normal Text><Comment>// Uses +, does division</Comment><br/> | 380 | <Normal Text> </Normal Text><Property>margin-left</Property><Normal Text>: </Normal Text><Number>5</Number><Unit>px</Unit><Normal Text> </Normal Text><Operator>+</Operator><Normal Text> </Normal Text><Number>8</Number><Unit>px</Unit><Operator>/</Operator><Number>2</Number><Unit>px</Unit><Separator Symbol>;</Separator Symbol><Normal Text> </Normal Text><Comment>// Uses +, does division</Comment><br/> | ||
381 | <Normal Text> </Normal Text><Property>font</Property><Normal Text>: (</Normal Text><Value>italic</Value><Normal Text> </Normal Text><Value>bold</Value><Normal Text> </Normal Text><Number>10</Number><Unit>px</Unit><Operator>/</Operator><Number>8</Number><Unit>px</Unit><Normal Text>)</Normal Text><Separator Symbol>;</Separator Symbol><Normal Text> </Normal Text><Comment>// In a list, parentheses don't count</Comment><br/> | 381 | <Normal Text> </Normal Text><Property>font</Property><Normal Text>: (</Normal Text><Value>italic</Value><Normal Text> </Normal Text><Value>bold</Value><Normal Text> </Normal Text><Number>10</Number><Unit>px</Unit><Operator>/</Operator><Number>8</Number><Unit>px</Unit><Normal Text>)</Normal Text><Separator Symbol>;</Separator Symbol><Normal Text> </Normal Text><Comment>// In a list, parentheses don't count</Comment><br/> | ||
382 | <Normal Text>}</Normal Text><br/> | 382 | <Normal Text>}</Normal Text><br/> | ||
383 | <Normal Text></Normal Text><br/> | 383 | <Normal Text></Normal Text><br/> | ||
384 | <Selector Tag>p</Selector Tag><Normal Text> {</Normal Text><br/> | 384 | <Selector Tag>p</Selector Tag><Normal Text> {</Normal Text><br/> | ||
385 | <Normal Text> </Normal Text><Variable>$font-size</Variable><Normal Text>: </Normal Text><Number>12</Number><Unit>px</Unit><Separator Symbol>;</Separator Symbol><br/> | 385 | <Normal Text> </Normal Text><Variable>$font-size</Variable><Normal Text>: </Normal Text><Number>12</Number><Unit>px</Unit><Separator Symbol>;</Separator Symbol><br/> | ||
386 | <Normal Text> </Normal Text><Variable>$line-height</Variable><Normal Text>: </Normal Text><Number>30</Number><Unit>px</Unit><Separator Symbol>;</Separator Symbol><br/> | 386 | <Normal Text> </Normal Text><Variable>$line-height</Variable><Normal Text>: </Normal Text><Number>30</Number><Unit>px</Unit><Separator Symbol>;</Separator Symbol><br/> | ||
387 | <Normal Text> </Normal Text><Property>font</Property><Normal Text>: </Normal Text><Variable>#{$font-size}</Variable><Operator>/</Operator><Variable>#{$line-height}</Variable><Separator Symbol>;</Separator Symbol><br/> | 387 | <Normal Text> </Normal Text><Property>font</Property><Normal Text>: </Normal Text><Interpolation>#{</Interpolation><Variable>$font-size</Variable><Interpolation>}</Interpolation><Operator>/</Operator><Interpolation>#{</Interpolation><Variable>$line-height</Variable><Interpolation>}</Interpolation><Separator Symbol>;</Separator Symbol><br/> | ||
388 | <Normal Text>}</Normal Text><br/> | 388 | <Normal Text>}</Normal Text><br/> | ||
389 | <Normal Text></Normal Text><br/> | 389 | <Normal Text></Normal Text><br/> | ||
390 | <Selector Tag>p</Selector Tag><Normal Text> {</Normal Text><br/> | 390 | <Selector Tag>p</Selector Tag><Normal Text> {</Normal Text><br/> | ||
391 | <Normal Text> </Normal Text><Property>color</Property><Normal Text>: </Normal Text><Color>#010203</Color><Normal Text> </Normal Text><Operator>+</Operator><Normal Text> </Normal Text><Color>#040506</Color><Separator Symbol>;</Separator Symbol><br/> | 391 | <Normal Text> </Normal Text><Property>color</Property><Normal Text>: </Normal Text><Color>#010203</Color><Normal Text> </Normal Text><Operator>+</Operator><Normal Text> </Normal Text><Color>#040506</Color><Separator Symbol>;</Separator Symbol><br/> | ||
392 | <Normal Text> </Normal Text><Property>color</Property><Normal Text>: </Normal Text><Function>rgba(</Function><Number>255</Number><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Number>0</Number><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Number>0</Number><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Number>0.75</Number><Function>)</Function><Normal Text> </Normal Text><Operator>+</Operator><Normal Text> </Normal Text><Function>rgba(</Function><Number>0</Number><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Number>255</Number><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Number>0</Number><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Number>0.75</Number><Function>)</Function><Separator Symbol>;</Separator Symbol><br/> | 392 | <Normal Text> </Normal Text><Property>color</Property><Normal Text>: </Normal Text><Function>rgba(</Function><Number>255</Number><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Number>0</Number><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Number>0</Number><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Number>0.75</Number><Function>)</Function><Normal Text> </Normal Text><Operator>+</Operator><Normal Text> </Normal Text><Function>rgba(</Function><Number>0</Number><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Number>255</Number><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Number>0</Number><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Number>0.75</Number><Function>)</Function><Separator Symbol>;</Separator Symbol><br/> | ||
393 | <Normal Text>}</Normal Text><br/> | 393 | <Normal Text>}</Normal Text><br/> | ||
394 | <Normal Text></Normal Text><br/> | 394 | <Normal Text></Normal Text><br/> | ||
395 | <Variable>$translucent-red</Variable><Normal Text>: </Normal Text><Function>rgba(</Function><Number>255</Number><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Number>0</Number><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Number>0</Number><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Number>0.5</Number><Function>)</Function><Separator Symbol>;</Separator Symbol><br/> | 395 | <Variable>$translucent-red</Variable><Normal Text>: </Normal Text><Function>rgba(</Function><Number>255</Number><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Number>0</Number><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Number>0</Number><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Number>0.5</Number><Function>)</Function><Separator Symbol>;</Separator Symbol><br/> | ||
396 | <Selector Tag>p</Selector Tag><Normal Text> {</Normal Text><br/> | 396 | <Selector Tag>p</Selector Tag><Normal Text> {</Normal Text><br/> | ||
397 | <Normal Text> </Normal Text><Property>color</Property><Normal Text>: </Normal Text><Function>opacify(</Function><Variable>$translucent-red</Variable><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Number>0.3</Number><Function>)</Function><Separator Symbol>;</Separator Symbol><br/> | 397 | <Normal Text> </Normal Text><Property>color</Property><Normal Text>: </Normal Text><Function>opacify(</Function><Variable>$translucent-red</Variable><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Number>0.3</Number><Function>)</Function><Separator Symbol>;</Separator Symbol><br/> | ||
398 | <Normal Text> </Normal Text><Property>background-color</Property><Normal Text>: </Normal Text><Function>transparentize(</Function><Variable>$translucent-red</Variable><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Number>0.25</Number><Function>)</Function><Separator Symbol>;</Separator Symbol><br/> | 398 | <Normal Text> </Normal Text><Property>background-color</Property><Normal Text>: </Normal Text><Function>transparentize(</Function><Variable>$translucent-red</Variable><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Number>0.25</Number><Function>)</Function><Separator Symbol>;</Separator Symbol><br/> | ||
399 | <Normal Text>}</Normal Text><br/> | 399 | <Normal Text>}</Normal Text><br/> | ||
400 | <Normal Text></Normal Text><br/> | 400 | <Normal Text></Normal Text><br/> | ||
401 | <Variable>$translucent-red</Variable><Normal Text>: </Normal Text><Function>rgba(</Function><Number>255</Number><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Number>0</Number><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Number>0</Number><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Number>0.5</Number><Function>)</Function><Separator Symbol>;</Separator Symbol><br/> | 401 | <Variable>$translucent-red</Variable><Normal Text>: </Normal Text><Function>rgba(</Function><Number>255</Number><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Number>0</Number><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Number>0</Number><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Number>0.5</Number><Function>)</Function><Separator Symbol>;</Separator Symbol><br/> | ||
402 | <Variable>$green</Variable><Normal Text>: </Normal Text><Color>#00ff00</Color><Separator Symbol>;</Separator Symbol><br/> | 402 | <Variable>$green</Variable><Normal Text>: </Normal Text><Color>#00ff00</Color><Separator Symbol>;</Separator Symbol><br/> | ||
403 | <Selector Tag>div</Selector Tag><Normal Text> {</Normal Text><br/> | 403 | <Selector Tag>div</Selector Tag><Normal Text> {</Normal Text><br/> | ||
404 | <Normal Text> </Normal Text><Property>filter</Property><Normal Text>: progid:DXImageTransform</Normal Text><Number>.</Number><Normal Text>Microsoft</Normal Text><Number>.</Number><Function>gradient(</Function><Normal Text>enabled=</Normal Text><String>'false'</String><Separator Symbol>,</Separator Symbol><Normal Text> startColorstr=</Normal Text><String>'</String><SpecialChar>#{</SpecialChar><Function>ie-hex-str(</Function><Variable>$green</Variable><Function>)</Function><SpecialChar>}</SpecialChar><String>'</String><Separator Symbol>,</Separator Symbol><Normal Text> endColorstr=</Normal Text><String>'</String><SpecialChar>#{</SpecialChar><Function>ie-hex-str(</Function><Variable>$translucent-red</Variable><Function>)</Function><SpecialChar>}</SpecialChar><String>'</String><Function>)</Function><Separator Symbol>;</Separator Symbol><br/> | 404 | <Normal Text> </Normal Text><Property>filter</Property><Normal Text>: progid:DXImageTransform</Normal Text><Number>.</Number><Normal Text>Microsoft</Normal Text><Number>.</Number><Function>gradient(</Function><Normal Text>enabled=</Normal Text><String>'false'</String><Separator Symbol>,</Separator Symbol><Normal Text> startColorstr=</Normal Text><String>'</String><Interpolation>#{</Interpolation><Function>ie-hex-str(</Function><Variable>$green</Variable><Function>)</Function><Interpolation>}</Interpolation><String>'</String><Separator Symbol>,</Separator Symbol><Normal Text> endColorstr=</Normal Text><String>'</String><Interpolation>#{</Interpolation><Function>ie-hex-str(</Function><Variable>$translucent-red</Variable><Function>)</Function><Interpolation>}</Interpolation><String>'</String><Function>)</Function><Separator Symbol>;</Separator Symbol><br/> | ||
405 | <Normal Text>}</Normal Text><br/> | 405 | <Normal Text>}</Normal Text><br/> | ||
406 | <Selector Tag>p</Selector Tag><Normal Text> {</Normal Text><br/> | 406 | <Selector Tag>p</Selector Tag><Normal Text> {</Normal Text><br/> | ||
407 | <Normal Text> </Normal Text><Property>cursor</Property><Normal Text>: e </Normal Text><Operator>+</Operator><Normal Text> -resize</Normal Text><Separator Symbol>;</Separator Symbol><br/> | 407 | <Normal Text> </Normal Text><Property>cursor</Property><Normal Text>: e </Normal Text><Operator>+</Operator><Normal Text> -resize</Normal Text><Separator Symbol>;</Separator Symbol><br/> | ||
408 | <Normal Text>}</Normal Text><br/> | 408 | <Normal Text>}</Normal Text><br/> | ||
409 | <Selector Tag>p</Selector Tag><Selector Pseudo>:before</Selector Pseudo><Normal Text> {</Normal Text><br/> | 409 | <Selector Tag>p</Selector Tag><Selector Pseudo>:before</Selector Pseudo><Normal Text> {</Normal Text><br/> | ||
410 | <Normal Text> </Normal Text><Property>content</Property><Normal Text>: </Normal Text><String>"Foo "</String><Normal Text> </Normal Text><Operator>+</Operator><Normal Text> Bar</Normal Text><Separator Symbol>;</Separator Symbol><br/> | 410 | <Normal Text> </Normal Text><Property>content</Property><Normal Text>: </Normal Text><String>"Foo "</String><Normal Text> </Normal Text><Operator>+</Operator><Normal Text> Bar</Normal Text><Separator Symbol>;</Separator Symbol><br/> | ||
411 | <Normal Text> </Normal Text><Property>font-family</Property><Normal Text>: sans- </Normal Text><Operator>+</Operator><Normal Text> </Normal Text><String>"serif"</String><Separator Symbol>;</Separator Symbol><br/> | 411 | <Normal Text> </Normal Text><Property>font-family</Property><Normal Text>: sans- </Normal Text><Operator>+</Operator><Normal Text> </Normal Text><String>"serif"</String><Separator Symbol>;</Separator Symbol><br/> | ||
412 | <Normal Text>}</Normal Text><br/> | 412 | <Normal Text>}</Normal Text><br/> | ||
413 | <Selector Tag>p</Selector Tag><Selector Pseudo>:before</Selector Pseudo><Normal Text> {</Normal Text><br/> | 413 | <Selector Tag>p</Selector Tag><Selector Pseudo>:before</Selector Pseudo><Normal Text> {</Normal Text><br/> | ||
414 | <Normal Text> </Normal Text><Property>content</Property><Normal Text>: </Normal Text><String>"I ate #{5 + 10} pies!"</String><Separator Symbol>;</Separator Symbol><br/> | 414 | <Normal Text> </Normal Text><Property>content</Property><Normal Text>: </Normal Text><String>"I ate </String><Interpolation>#{</Interpolation><Number>5</Number><Normal Text> </Normal Text><Operator>+</Operator><Normal Text> </Normal Text><Number>10</Number><Interpolation>}</Interpolation><String> pies!"</String><Separator Symbol>;</Separator Symbol><br/> | ||
415 | <Normal Text>}</Normal Text><br/> | 415 | <Normal Text>}</Normal Text><br/> | ||
416 | <Variable>$value</Variable><Normal Text>: null</Normal Text><Separator Symbol>;</Separator Symbol><br/> | 416 | <Variable>$value</Variable><Normal Text>: null</Normal Text><Separator Symbol>;</Separator Symbol><br/> | ||
417 | <Selector Tag>p</Selector Tag><Selector Pseudo>:before</Selector Pseudo><Normal Text> {</Normal Text><br/> | 417 | <Selector Tag>p</Selector Tag><Selector Pseudo>:before</Selector Pseudo><Normal Text> {</Normal Text><br/> | ||
418 | <Normal Text> </Normal Text><Property>content</Property><Normal Text>: </Normal Text><String>"I ate #{$value} pies!"</String><Separator Symbol>;</Separator Symbol><br/> | 418 | <Normal Text> </Normal Text><Property>content</Property><Normal Text>: </Normal Text><String>"I ate </String><Interpolation>#{</Interpolation><Variable>$value</Variable><Interpolation>}</Interpolation><String> pies!"</String><Separator Symbol>;</Separator Symbol><br/> | ||
419 | <Normal Text>}</Normal Text><br/> | 419 | <Normal Text>}</Normal Text><br/> | ||
420 | <Selector Tag>p</Selector Tag><Normal Text> {</Normal Text><br/> | 420 | <Selector Tag>p</Selector Tag><Normal Text> {</Normal Text><br/> | ||
421 | <Normal Text> </Normal Text><Property>width</Property><Normal Text>: </Normal Text><Number>1</Number><Unit>em</Unit><Normal Text> </Normal Text><Operator>+</Operator><Normal Text> (</Normal Text><Number>2</Number><Unit>em</Unit><Normal Text> </Normal Text><Operator>*</Operator><Normal Text> </Normal Text><Number>3</Number><Normal Text>)</Normal Text><Separator Symbol>;</Separator Symbol><br/> | 421 | <Normal Text> </Normal Text><Property>width</Property><Normal Text>: </Normal Text><Number>1</Number><Unit>em</Unit><Normal Text> </Normal Text><Operator>+</Operator><Normal Text> (</Normal Text><Number>2</Number><Unit>em</Unit><Normal Text> </Normal Text><Operator>*</Operator><Normal Text> </Normal Text><Number>3</Number><Normal Text>)</Normal Text><Separator Symbol>;</Separator Symbol><br/> | ||
422 | <Normal Text>}</Normal Text><br/> | 422 | <Normal Text>}</Normal Text><br/> | ||
423 | <Selector Tag>p</Selector Tag><Normal Text> {</Normal Text><br/> | 423 | <Selector Tag>p</Selector Tag><Normal Text> {</Normal Text><br/> | ||
424 | <Normal Text> </Normal Text><Property>color</Property><Normal Text>: </Normal Text><Function>hsl(</Function><Variable>$hue</Variable><Normal Text>: </Normal Text><Number>0</Number><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Variable>$saturation</Variable><Normal Text>: </Normal Text><Number>100</Number><Unit>%</Unit><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Variable>$lightness</Variable><Normal Text>: </Normal Text><Number>50</Number><Unit>%</Unit><Function>)</Function><Separator Symbol>;</Separator Symbol><br/> | 424 | <Normal Text> </Normal Text><Property>color</Property><Normal Text>: </Normal Text><Function>hsl(</Function><Variable>$hue</Variable><Normal Text>: </Normal Text><Number>0</Number><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Variable>$saturation</Variable><Normal Text>: </Normal Text><Number>100</Number><Unit>%</Unit><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Variable>$lightness</Variable><Normal Text>: </Normal Text><Number>50</Number><Unit>%</Unit><Function>)</Function><Separator Symbol>;</Separator Symbol><br/> | ||
425 | <Normal Text>}</Normal Text><br/> | 425 | <Normal Text>}</Normal Text><br/> | ||
426 | <Variable>$name</Variable><Normal Text>: foo</Normal Text><Separator Symbol>;</Separator Symbol><br/> | 426 | <Variable>$name</Variable><Normal Text>: foo</Normal Text><Separator Symbol>;</Separator Symbol><br/> | ||
427 | <Variable>$attr</Variable><Normal Text>: border</Normal Text><Separator Symbol>;</Separator Symbol><br/> | 427 | <Variable>$attr</Variable><Normal Text>: border</Normal Text><Separator Symbol>;</Separator Symbol><br/> | ||
428 | <Selector Tag>p</Selector Tag><Selector Class>.</Selector Class><Variable>#{$name}</Variable><Normal Text> {</Normal Text><br/> | 428 | <Selector Tag>p</Selector Tag><Selector Class>.</Selector Class><Interpolation>#{</Interpolation><Variable>$name</Variable><Interpolation>}</Interpolation><Normal Text> {</Normal Text><br/> | ||
429 | <Normal Text> </Normal Text><Variable>#{$attr}</Variable><Unknown Property>-color</Unknown Property><Normal Text>: </Normal Text><Color>blue</Color><Separator Symbol>;</Separator Symbol><br/> | 429 | <Normal Text> </Normal Text><Interpolation>#{</Interpolation><Variable>$attr</Variable><Interpolation>}</Interpolation><Unknown Property>-color</Unknown Property><Normal Text>: </Normal Text><Color>blue</Color><Separator Symbol>;</Separator Symbol><br/> | ||
430 | <Normal Text>}</Normal Text><br/> | 430 | <Normal Text>}</Normal Text><br/> | ||
431 | <Selector Tag>p</Selector Tag><Normal Text> {</Normal Text><br/> | 431 | <Selector Tag>p</Selector Tag><Normal Text> {</Normal Text><br/> | ||
432 | <Normal Text> </Normal Text><Variable>$font-size</Variable><Normal Text>: </Normal Text><Number>12</Number><Unit>px</Unit><Separator Symbol>;</Separator Symbol><br/> | 432 | <Normal Text> </Normal Text><Variable>$font-size</Variable><Normal Text>: </Normal Text><Number>12</Number><Unit>px</Unit><Separator Symbol>;</Separator Symbol><br/> | ||
433 | <Normal Text> </Normal Text><Variable>$line-height</Variable><Normal Text>: </Normal Text><Number>30</Number><Unit>px</Unit><Separator Symbol>;</Separator Symbol><br/> | 433 | <Normal Text> </Normal Text><Variable>$line-height</Variable><Normal Text>: </Normal Text><Number>30</Number><Unit>px</Unit><Separator Symbol>;</Separator Symbol><br/> | ||
434 | <Normal Text> </Normal Text><Property>font</Property><Normal Text>: </Normal Text><Variable>#{$font-size}</Variable><Operator>/</Operator><Variable>#{$line-height}</Variable><Separator Symbol>;</Separator Symbol><br/> | 434 | <Normal Text> </Normal Text><Property>font</Property><Normal Text>: </Normal Text><Interpolation>#{</Interpolation><Variable>$font-size</Variable><Interpolation>}</Interpolation><Operator>/</Operator><Interpolation>#{</Interpolation><Variable>$line-height</Variable><Interpolation>}</Interpolation><Separator Symbol>;</Separator Symbol><br/> | ||
435 | <Normal Text>}</Normal Text><br/> | 435 | <Normal Text>}</Normal Text><br/> | ||
436 | <Normal Text></Normal Text><br/> | 436 | <Normal Text></Normal Text><br/> | ||
437 | <Selector Class>.foo.bar</Selector Class><Normal Text> </Normal Text><Selector Class>.baz.bang</Selector Class><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Selector Class>.bip.qux</Selector Class><Normal Text> {</Normal Text><br/> | 437 | <Selector Class>.foo.bar</Selector Class><Normal Text> </Normal Text><Selector Class>.baz.bang</Selector Class><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Selector Class>.bip.qux</Selector Class><Normal Text> {</Normal Text><br/> | ||
438 | <Normal Text> </Normal Text><Variable>$selector</Variable><Normal Text>: &</Normal Text><Separator Symbol>;</Separator Symbol><br/> | 438 | <Normal Text> </Normal Text><Variable>$selector</Variable><Normal Text>: &</Normal Text><Separator Symbol>;</Separator Symbol><br/> | ||
439 | <Normal Text>}</Normal Text><br/> | 439 | <Normal Text>}</Normal Text><br/> | ||
440 | <Normal Text></Normal Text><br/> | 440 | <Normal Text></Normal Text><br/> | ||
441 | <At Rule>@mixin</At Rule><Normal Text> </Normal Text><Function>does-parent-exist</Function><Normal Text> {</Normal Text><br/> | 441 | <At Rule>@mixin</At Rule><Normal Text> </Normal Text><Function>does-parent-exist</Function><Normal Text> {</Normal Text><br/> | ||
442 | <Normal Text> </Normal Text><At Rule>@if</At Rule><Normal Text> & {</Normal Text><br/> | 442 | <Normal Text> </Normal Text><At Rule>@if</At Rule><Normal Text> & {</Normal Text><br/> | ||
Show All 17 Lines | |||||
460 | <Normal Text>}</Normal Text><br/> | 460 | <Normal Text>}</Normal Text><br/> | ||
461 | <Normal Text></Normal Text><br/> | 461 | <Normal Text></Normal Text><br/> | ||
462 | <At Rule>@import</At Rule><Normal Text> </Normal Text><String>"foo.css"</String><Separator Symbol>;</Separator Symbol><br/> | 462 | <At Rule>@import</At Rule><Normal Text> </Normal Text><String>"foo.css"</String><Separator Symbol>;</Separator Symbol><br/> | ||
463 | <At Rule>@import</At Rule><Normal Text> </Normal Text><String>"foo"</String><Normal Text> </Normal Text><Value>screen</Value><Separator Symbol>;</Separator Symbol><br/> | 463 | <At Rule>@import</At Rule><Normal Text> </Normal Text><String>"foo"</String><Normal Text> </Normal Text><Value>screen</Value><Separator Symbol>;</Separator Symbol><br/> | ||
464 | <At Rule>@import</At Rule><Normal Text> </Normal Text><String>"http://foo.com/bar"</String><Separator Symbol>;</Separator Symbol><br/> | 464 | <At Rule>@import</At Rule><Normal Text> </Normal Text><String>"http://foo.com/bar"</String><Separator Symbol>;</Separator Symbol><br/> | ||
465 | <At Rule>@import</At Rule><Normal Text> </Normal Text><Function>url(</Function><String>foo</String><Function>)</Function><Separator Symbol>;</Separator Symbol><br/> | 465 | <At Rule>@import</At Rule><Normal Text> </Normal Text><Function>url(</Function><String>foo</String><Function>)</Function><Separator Symbol>;</Separator Symbol><br/> | ||
466 | <Normal Text></Normal Text><br/> | 466 | <Normal Text></Normal Text><br/> | ||
467 | <Variable>$family</Variable><Normal Text>: </Normal Text><Function>unquote(</Function><String>"Droid+Sans"</String><Function>)</Function><Separator Symbol>;</Separator Symbol><br/> | 467 | <Variable>$family</Variable><Normal Text>: </Normal Text><Function>unquote(</Function><String>"Droid+Sans"</String><Function>)</Function><Separator Symbol>;</Separator Symbol><br/> | ||
468 | <At Rule>@import</At Rule><Normal Text> </Normal Text><Function>url(</Function><String>"http://fonts.googleapis.com/css?family=#{$family}"</String><Function>)</Function><Separator Symbol>;</Separator Symbol><br/> | 468 | <At Rule>@import</At Rule><Normal Text> </Normal Text><Function>url(</Function><String>"http://fonts.googleapis.com/css?family=</String><Interpolation>#{</Interpolation><Variable>$family</Variable><Interpolation>}</Interpolation><String>"</String><Function>)</Function><Separator Symbol>;</Separator Symbol><br/> | ||
469 | <Selector Id>#main</Selector Id><Normal Text> {</Normal Text><br/> | 469 | <Selector Id>#main</Selector Id><Normal Text> {</Normal Text><br/> | ||
470 | <Normal Text> </Normal Text><At Rule>@import</At Rule><Normal Text> </Normal Text><String>"example"</String><Separator Symbol>;</Separator Symbol><br/> | 470 | <Normal Text> </Normal Text><At Rule>@import</At Rule><Normal Text> </Normal Text><String>"example"</String><Separator Symbol>;</Separator Symbol><br/> | ||
471 | <Normal Text>}</Normal Text><br/> | 471 | <Normal Text>}</Normal Text><br/> | ||
472 | <Normal Text></Normal Text><br/> | 472 | <Normal Text></Normal Text><br/> | ||
473 | <Selector Class>.sidebar</Selector Class><Normal Text> {</Normal Text><br/> | 473 | <Selector Class>.sidebar</Selector Class><Normal Text> {</Normal Text><br/> | ||
474 | <Normal Text> </Normal Text><Property>width</Property><Normal Text>: </Normal Text><Number>300</Number><Unit>px</Unit><Separator Symbol>;</Separator Symbol><br/> | 474 | <Normal Text> </Normal Text><Property>width</Property><Normal Text>: </Normal Text><Number>300</Number><Unit>px</Unit><Separator Symbol>;</Separator Symbol><br/> | ||
475 | <Normal Text> </Normal Text><At Rule>@media</At Rule><Normal Text> </Normal Text><Value>screen</Value><Normal Text> </Normal Text><Keyword>and</Keyword><Normal Text> (</Normal Text><Property>orientation</Property><Normal Text>: </Normal Text><Value>landscape</Value><Normal Text>) {</Normal Text><br/> | 475 | <Normal Text> </Normal Text><At Rule>@media</At Rule><Normal Text> </Normal Text><Value>screen</Value><Normal Text> </Normal Text><Keyword>and</Keyword><Normal Text> (</Normal Text><Property>orientation</Property><Normal Text>: </Normal Text><Value>landscape</Value><Normal Text>) {</Normal Text><br/> | ||
476 | <Normal Text> </Normal Text><Property>width</Property><Normal Text>: </Normal Text><Number>500</Number><Unit>px</Unit><Separator Symbol>;</Separator Symbol><br/> | 476 | <Normal Text> </Normal Text><Property>width</Property><Normal Text>: </Normal Text><Number>500</Number><Unit>px</Unit><Separator Symbol>;</Separator Symbol><br/> | ||
477 | <Normal Text> }</Normal Text><br/> | 477 | <Normal Text> }</Normal Text><br/> | ||
478 | <Normal Text>}</Normal Text><br/> | 478 | <Normal Text>}</Normal Text><br/> | ||
479 | <At Rule>@media</At Rule><Normal Text> </Normal Text><Value>screen</Value><Normal Text> {</Normal Text><br/> | 479 | <At Rule>@media</At Rule><Normal Text> </Normal Text><Value>screen</Value><Normal Text> {</Normal Text><br/> | ||
480 | <Normal Text> </Normal Text><Selector Class>.sidebar</Selector Class><Normal Text> {</Normal Text><br/> | 480 | <Normal Text> </Normal Text><Selector Class>.sidebar</Selector Class><Normal Text> {</Normal Text><br/> | ||
481 | <Normal Text> </Normal Text><At Rule>@media</At Rule><Normal Text> (</Normal Text><Property>orientation</Property><Normal Text>: </Normal Text><Value>landscape</Value><Normal Text>) {</Normal Text><br/> | 481 | <Normal Text> </Normal Text><At Rule>@media</At Rule><Normal Text> (</Normal Text><Property>orientation</Property><Normal Text>: </Normal Text><Value>landscape</Value><Normal Text>) {</Normal Text><br/> | ||
482 | <Normal Text> </Normal Text><Property>width</Property><Normal Text>: </Normal Text><Number>500</Number><Unit>px</Unit><Separator Symbol>;</Separator Symbol><br/> | 482 | <Normal Text> </Normal Text><Property>width</Property><Normal Text>: </Normal Text><Number>500</Number><Unit>px</Unit><Separator Symbol>;</Separator Symbol><br/> | ||
483 | <Normal Text> }</Normal Text><br/> | 483 | <Normal Text> }</Normal Text><br/> | ||
484 | <Normal Text> }</Normal Text><br/> | 484 | <Normal Text> }</Normal Text><br/> | ||
485 | <Normal Text>}</Normal Text><br/> | 485 | <Normal Text>}</Normal Text><br/> | ||
486 | <Normal Text></Normal Text><br/> | 486 | <Normal Text></Normal Text><br/> | ||
487 | <Variable>$media</Variable><Normal Text>: screen</Normal Text><Separator Symbol>;</Separator Symbol><br/> | 487 | <Variable>$media</Variable><Normal Text>: screen</Normal Text><Separator Symbol>;</Separator Symbol><br/> | ||
488 | <Variable>$feature</Variable><Normal Text>: -webkit-min-device-pixel-ratio</Normal Text><Separator Symbol>;</Separator Symbol><br/> | 488 | <Variable>$feature</Variable><Normal Text>: -webkit-min-device-pixel-ratio</Normal Text><Separator Symbol>;</Separator Symbol><br/> | ||
489 | <Variable>$value</Variable><Normal Text>: </Normal Text><Number>1.5</Number><Separator Symbol>;</Separator Symbol><br/> | 489 | <Variable>$value</Variable><Normal Text>: </Normal Text><Number>1.5</Number><Separator Symbol>;</Separator Symbol><br/> | ||
490 | <Normal Text></Normal Text><br/> | 490 | <Normal Text></Normal Text><br/> | ||
491 | <At Rule>@media</At Rule><Normal Text> </Normal Text><Variable>#{$media}</Variable><Normal Text> </Normal Text><Keyword>and</Keyword><Normal Text> (</Normal Text><Variable>$feature</Variable><Normal Text>: </Normal Text><Variable>$value</Variable><Normal Text>) {</Normal Text><br/> | 491 | <At Rule>@media</At Rule><Normal Text> </Normal Text><Interpolation>#{</Interpolation><Variable>$media</Variable><Interpolation>}</Interpolation><Normal Text> </Normal Text><Keyword>and</Keyword><Normal Text> (</Normal Text><Variable>$feature</Variable><Normal Text>: </Normal Text><Variable>$value</Variable><Normal Text>) {</Normal Text><br/> | ||
492 | <Normal Text> </Normal Text><Selector Class>.sidebar</Selector Class><Normal Text> {</Normal Text><br/> | 492 | <Normal Text> </Normal Text><Selector Class>.sidebar</Selector Class><Normal Text> {</Normal Text><br/> | ||
493 | <Normal Text> </Normal Text><Property>width</Property><Normal Text>: </Normal Text><Number>500</Number><Unit>px</Unit><Separator Symbol>;</Separator Symbol><br/> | 493 | <Normal Text> </Normal Text><Property>width</Property><Normal Text>: </Normal Text><Number>500</Number><Unit>px</Unit><Separator Symbol>;</Separator Symbol><br/> | ||
494 | <Normal Text> }</Normal Text><br/> | 494 | <Normal Text> }</Normal Text><br/> | ||
495 | <Normal Text>}</Normal Text><br/> | 495 | <Normal Text>}</Normal Text><br/> | ||
496 | <Normal Text></Normal Text><br/> | 496 | <Normal Text></Normal Text><br/> | ||
497 | <Selector Class>.error</Selector Class><Normal Text> {</Normal Text><br/> | 497 | <Selector Class>.error</Selector Class><Normal Text> {</Normal Text><br/> | ||
498 | <Normal Text> </Normal Text><Property>border</Property><Normal Text>: </Normal Text><Number>1</Number><Unit>px</Unit><Normal Text> </Normal Text><Color>#f00</Color><Separator Symbol>;</Separator Symbol><br/> | 498 | <Normal Text> </Normal Text><Property>border</Property><Normal Text>: </Normal Text><Number>1</Number><Unit>px</Unit><Normal Text> </Normal Text><Color>#f00</Color><Separator Symbol>;</Separator Symbol><br/> | ||
499 | <Normal Text> </Normal Text><Property>background-color</Property><Normal Text>: </Normal Text><Color>#fdd</Color><Separator Symbol>;</Separator Symbol><br/> | 499 | <Normal Text> </Normal Text><Property>background-color</Property><Normal Text>: </Normal Text><Color>#fdd</Color><Separator Symbol>;</Separator Symbol><br/> | ||
Show All 31 Lines | |||||
531 | <Normal Text> }</Normal Text><br/> | 531 | <Normal Text> }</Normal Text><br/> | ||
532 | <Normal Text> }</Normal Text><br/> | 532 | <Normal Text> }</Normal Text><br/> | ||
533 | <Normal Text>}</Normal Text><br/> | 533 | <Normal Text>}</Normal Text><br/> | ||
534 | <Normal Text></Normal Text><br/> | 534 | <Normal Text></Normal Text><br/> | ||
535 | <At Rule>@debug</At Rule><Normal Text> </Normal Text><Number>10</Number><Unit>em</Unit><Normal Text> </Normal Text><Operator>+</Operator><Normal Text> </Normal Text><Number>12</Number><Unit>em</Unit><Separator Symbol>;</Separator Symbol><br/> | 535 | <At Rule>@debug</At Rule><Normal Text> </Normal Text><Number>10</Number><Unit>em</Unit><Normal Text> </Normal Text><Operator>+</Operator><Normal Text> </Normal Text><Number>12</Number><Unit>em</Unit><Separator Symbol>;</Separator Symbol><br/> | ||
536 | <Normal Text></Normal Text><br/> | 536 | <Normal Text></Normal Text><br/> | ||
537 | <At Rule>@mixin</At Rule><Normal Text> </Normal Text><Function>adjust-location</Function><Normal Text>(</Normal Text><Variable>$x</Variable><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Variable>$y</Variable><Normal Text>) {</Normal Text><br/> | 537 | <At Rule>@mixin</At Rule><Normal Text> </Normal Text><Function>adjust-location</Function><Normal Text>(</Normal Text><Variable>$x</Variable><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Variable>$y</Variable><Normal Text>) {</Normal Text><br/> | ||
538 | <Normal Text> </Normal Text><At Rule>@if</At Rule><Normal Text> </Normal Text><Function>unitless(</Function><Variable>$x</Variable><Function>)</Function><Normal Text> {</Normal Text><br/> | 538 | <Normal Text> </Normal Text><At Rule>@if</At Rule><Normal Text> </Normal Text><Function>unitless(</Function><Variable>$x</Variable><Function>)</Function><Normal Text> {</Normal Text><br/> | ||
539 | <Normal Text> </Normal Text><At Rule>@warn</At Rule><Normal Text> </Normal Text><String>"Assuming #{$x} to be in pixels"</String><Separator Symbol>;</Separator Symbol><br/> | 539 | <Normal Text> </Normal Text><At Rule>@warn</At Rule><Normal Text> </Normal Text><String>"Assuming </String><Interpolation>#{</Interpolation><Variable>$x</Variable><Interpolation>}</Interpolation><String> to be in pixels"</String><Separator Symbol>;</Separator Symbol><br/> | ||
540 | <Normal Text> </Normal Text><Variable>$x</Variable><Normal Text>: </Normal Text><Number>1</Number><Unit>px</Unit><Normal Text> </Normal Text><Operator>*</Operator><Normal Text> </Normal Text><Variable>$x</Variable><Separator Symbol>;</Separator Symbol><br/> | 540 | <Normal Text> </Normal Text><Variable>$x</Variable><Normal Text>: </Normal Text><Number>1</Number><Unit>px</Unit><Normal Text> </Normal Text><Operator>*</Operator><Normal Text> </Normal Text><Variable>$x</Variable><Separator Symbol>;</Separator Symbol><br/> | ||
541 | <Normal Text> }</Normal Text><br/> | 541 | <Normal Text> }</Normal Text><br/> | ||
542 | <Normal Text> </Normal Text><At Rule>@if</At Rule><Normal Text> </Normal Text><Function>unitless(</Function><Variable>$y</Variable><Function>)</Function><Normal Text> {</Normal Text><br/> | 542 | <Normal Text> </Normal Text><At Rule>@if</At Rule><Normal Text> </Normal Text><Function>unitless(</Function><Variable>$y</Variable><Function>)</Function><Normal Text> {</Normal Text><br/> | ||
543 | <Normal Text> </Normal Text><At Rule>@warn</At Rule><Normal Text> </Normal Text><String>"Assuming #{$y} to be in pixels"</String><Separator Symbol>;</Separator Symbol><br/> | 543 | <Normal Text> </Normal Text><At Rule>@warn</At Rule><Normal Text> </Normal Text><String>"Assuming </String><Interpolation>#{</Interpolation><Variable>$y</Variable><Interpolation>}</Interpolation><String> to be in pixels"</String><Separator Symbol>;</Separator Symbol><br/> | ||
544 | <Normal Text> </Normal Text><Variable>$y</Variable><Normal Text>: </Normal Text><Number>1</Number><Unit>px</Unit><Normal Text> </Normal Text><Operator>*</Operator><Normal Text> </Normal Text><Variable>$y</Variable><Separator Symbol>;</Separator Symbol><br/> | 544 | <Normal Text> </Normal Text><Variable>$y</Variable><Normal Text>: </Normal Text><Number>1</Number><Unit>px</Unit><Normal Text> </Normal Text><Operator>*</Operator><Normal Text> </Normal Text><Variable>$y</Variable><Separator Symbol>;</Separator Symbol><br/> | ||
545 | <Normal Text> }</Normal Text><br/> | 545 | <Normal Text> }</Normal Text><br/> | ||
546 | <Normal Text> </Normal Text><Property>position</Property><Normal Text>: </Normal Text><Value>relative</Value><Separator Symbol>;</Separator Symbol><Normal Text> </Normal Text><Property>left</Property><Normal Text>: </Normal Text><Variable>$x</Variable><Separator Symbol>;</Separator Symbol><Normal Text> </Normal Text><Property>top</Property><Normal Text>: </Normal Text><Variable>$y</Variable><Separator Symbol>;</Separator Symbol><br/> | 546 | <Normal Text> </Normal Text><Property>position</Property><Normal Text>: </Normal Text><Value>relative</Value><Separator Symbol>;</Separator Symbol><Normal Text> </Normal Text><Property>left</Property><Normal Text>: </Normal Text><Variable>$x</Variable><Separator Symbol>;</Separator Symbol><Normal Text> </Normal Text><Property>top</Property><Normal Text>: </Normal Text><Variable>$y</Variable><Separator Symbol>;</Separator Symbol><br/> | ||
547 | <Normal Text>}</Normal Text><br/> | 547 | <Normal Text>}</Normal Text><br/> | ||
548 | <Normal Text></Normal Text><br/> | 548 | <Normal Text></Normal Text><br/> | ||
549 | <At Rule>@mixin</At Rule><Normal Text> </Normal Text><Function>adjust-location</Function><Normal Text>(</Normal Text><Variable>$x</Variable><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Variable>$y</Variable><Normal Text>) {</Normal Text><br/> | 549 | <At Rule>@mixin</At Rule><Normal Text> </Normal Text><Function>adjust-location</Function><Normal Text>(</Normal Text><Variable>$x</Variable><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Variable>$y</Variable><Normal Text>) {</Normal Text><br/> | ||
550 | <Normal Text> </Normal Text><At Rule>@if</At Rule><Normal Text> </Normal Text><Function>unitless(</Function><Variable>$x</Variable><Function>)</Function><Normal Text> {</Normal Text><br/> | 550 | <Normal Text> </Normal Text><At Rule>@if</At Rule><Normal Text> </Normal Text><Function>unitless(</Function><Variable>$x</Variable><Function>)</Function><Normal Text> {</Normal Text><br/> | ||
551 | <Normal Text> </Normal Text><At Rule>@error</At Rule><Normal Text> </Normal Text><String>"$x may not be unitless, was #{$x}."</String><Separator Symbol>;</Separator Symbol><br/> | 551 | <Normal Text> </Normal Text><At Rule>@error</At Rule><Normal Text> </Normal Text><String>"$x may not be unitless, was </String><Interpolation>#{</Interpolation><Variable>$x</Variable><Interpolation>}</Interpolation><String>."</String><Separator Symbol>;</Separator Symbol><br/> | ||
552 | <Normal Text> }</Normal Text><br/> | 552 | <Normal Text> }</Normal Text><br/> | ||
553 | <Normal Text> </Normal Text><At Rule>@if</At Rule><Normal Text> </Normal Text><Function>unitless(</Function><Variable>$y</Variable><Function>)</Function><Normal Text> {</Normal Text><br/> | 553 | <Normal Text> </Normal Text><At Rule>@if</At Rule><Normal Text> </Normal Text><Function>unitless(</Function><Variable>$y</Variable><Function>)</Function><Normal Text> {</Normal Text><br/> | ||
554 | <Normal Text> </Normal Text><At Rule>@error</At Rule><Normal Text> </Normal Text><String>"$y may not be unitless, was #{$y}."</String><Separator Symbol>;</Separator Symbol><br/> | 554 | <Normal Text> </Normal Text><At Rule>@error</At Rule><Normal Text> </Normal Text><String>"$y may not be unitless, was </String><Interpolation>#{</Interpolation><Variable>$y</Variable><Interpolation>}</Interpolation><String>."</String><Separator Symbol>;</Separator Symbol><br/> | ||
555 | <Normal Text> }</Normal Text><br/> | 555 | <Normal Text> }</Normal Text><br/> | ||
556 | <Normal Text> </Normal Text><Property>position</Property><Normal Text>: </Normal Text><Value>relative</Value><Separator Symbol>;</Separator Symbol><Normal Text> </Normal Text><Property>left</Property><Normal Text>: </Normal Text><Variable>$x</Variable><Separator Symbol>;</Separator Symbol><Normal Text> </Normal Text><Property>top</Property><Normal Text>: </Normal Text><Variable>$y</Variable><Separator Symbol>;</Separator Symbol><br/> | 556 | <Normal Text> </Normal Text><Property>position</Property><Normal Text>: </Normal Text><Value>relative</Value><Separator Symbol>;</Separator Symbol><Normal Text> </Normal Text><Property>left</Property><Normal Text>: </Normal Text><Variable>$x</Variable><Separator Symbol>;</Separator Symbol><Normal Text> </Normal Text><Property>top</Property><Normal Text>: </Normal Text><Variable>$y</Variable><Separator Symbol>;</Separator Symbol><br/> | ||
557 | <Normal Text>}</Normal Text><br/> | 557 | <Normal Text>}</Normal Text><br/> | ||
558 | <Normal Text></Normal Text><br/> | 558 | <Normal Text></Normal Text><br/> | ||
559 | <Selector Tag>p</Selector Tag><Normal Text> {</Normal Text><br/> | 559 | <Selector Tag>p</Selector Tag><Normal Text> {</Normal Text><br/> | ||
560 | <Normal Text> </Normal Text><At Rule>@if</At Rule><Normal Text> </Normal Text><Number>1</Number><Normal Text> </Normal Text><Operator>+</Operator><Normal Text> </Normal Text><Number>1</Number><Normal Text> </Normal Text><Operator>==</Operator><Normal Text> </Normal Text><Number>2</Number><Normal Text> { </Normal Text><Property>border</Property><Normal Text>: </Normal Text><Number>1</Number><Unit>px</Unit><Normal Text> </Normal Text><Value>solid</Value><Separator Symbol>;</Separator Symbol><Normal Text> }</Normal Text><br/> | 560 | <Normal Text> </Normal Text><At Rule>@if</At Rule><Normal Text> </Normal Text><Number>1</Number><Normal Text> </Normal Text><Operator>+</Operator><Normal Text> </Normal Text><Number>1</Number><Normal Text> </Normal Text><Operator>==</Operator><Normal Text> </Normal Text><Number>2</Number><Normal Text> { </Normal Text><Property>border</Property><Normal Text>: </Normal Text><Number>1</Number><Unit>px</Unit><Normal Text> </Normal Text><Value>solid</Value><Separator Symbol>;</Separator Symbol><Normal Text> }</Normal Text><br/> | ||
561 | <Normal Text> </Normal Text><At Rule>@if</At Rule><Normal Text> </Normal Text><Number>5</Number><Normal Text> </Normal Text><Operator><</Operator><Normal Text> </Normal Text><Number>3</Number><Normal Text> { </Normal Text><Property>border</Property><Normal Text>: </Normal Text><Number>2</Number><Unit>px</Unit><Normal Text> </Normal Text><Value>dotted</Value><Separator Symbol>;</Separator Symbol><Normal Text> }</Normal Text><br/> | 561 | <Normal Text> </Normal Text><At Rule>@if</At Rule><Normal Text> </Normal Text><Number>5</Number><Normal Text> </Normal Text><Operator><</Operator><Normal Text> </Normal Text><Number>3</Number><Normal Text> { </Normal Text><Property>border</Property><Normal Text>: </Normal Text><Number>2</Number><Unit>px</Unit><Normal Text> </Normal Text><Value>dotted</Value><Separator Symbol>;</Separator Symbol><Normal Text> }</Normal Text><br/> | ||
562 | <Normal Text> </Normal Text><At Rule>@if</At Rule><Normal Text> </Normal Text><Value Keyword>null</Value Keyword><Normal Text> { </Normal Text><Property>border</Property><Normal Text>: </Normal Text><Number>3</Number><Unit>px</Unit><Normal Text> </Normal Text><Value>double</Value><Separator Symbol>;</Separator Symbol><Normal Text> }</Normal Text><br/> | 562 | <Normal Text> </Normal Text><At Rule>@if</At Rule><Normal Text> </Normal Text><Value Keyword>null</Value Keyword><Normal Text> { </Normal Text><Property>border</Property><Normal Text>: </Normal Text><Number>3</Number><Unit>px</Unit><Normal Text> </Normal Text><Value>double</Value><Separator Symbol>;</Separator Symbol><Normal Text> }</Normal Text><br/> | ||
563 | <Normal Text>}</Normal Text><br/> | 563 | <Normal Text>}</Normal Text><br/> | ||
564 | <Normal Text></Normal Text><br/> | 564 | <Normal Text></Normal Text><br/> | ||
565 | <Variable>$type</Variable><Normal Text>: monster</Normal Text><Separator Symbol>;</Separator Symbol><br/> | 565 | <Variable>$type</Variable><Normal Text>: monster</Normal Text><Separator Symbol>;</Separator Symbol><br/> | ||
566 | <Selector Tag>p</Selector Tag><Normal Text> {</Normal Text><br/> | 566 | <Selector Tag>p</Selector Tag><Normal Text> {</Normal Text><br/> | ||
567 | <Normal Text> </Normal Text><At Rule>@if</At Rule><Normal Text> </Normal Text><Variable>$type</Variable><Normal Text> </Normal Text><Operator>==</Operator><Normal Text> ocean {</Normal Text><br/> | 567 | <Normal Text> </Normal Text><At Rule>@if</At Rule><Normal Text> </Normal Text><Variable>$type</Variable><Normal Text> </Normal Text><Operator>==</Operator><Normal Text> ocean {</Normal Text><br/> | ||
568 | <Normal Text> </Normal Text><Property>color</Property><Normal Text>: </Normal Text><Color>blue</Color><Separator Symbol>;</Separator Symbol><br/> | 568 | <Normal Text> </Normal Text><Property>color</Property><Normal Text>: </Normal Text><Color>blue</Color><Separator Symbol>;</Separator Symbol><br/> | ||
569 | <Normal Text> } </Normal Text><At Rule>@else</At Rule><Normal Text> </Normal Text><At Rule>if</At Rule><Normal Text> </Normal Text><Variable>$type</Variable><Normal Text> </Normal Text><Operator>==</Operator><Normal Text> matador {</Normal Text><br/> | 569 | <Normal Text> } </Normal Text><At Rule>@else</At Rule><Normal Text> </Normal Text><At Rule>if</At Rule><Normal Text> </Normal Text><Variable>$type</Variable><Normal Text> </Normal Text><Operator>==</Operator><Normal Text> matador {</Normal Text><br/> | ||
570 | <Normal Text> </Normal Text><Property>color</Property><Normal Text>: </Normal Text><Color>red</Color><Separator Symbol>;</Separator Symbol><br/> | 570 | <Normal Text> </Normal Text><Property>color</Property><Normal Text>: </Normal Text><Color>red</Color><Separator Symbol>;</Separator Symbol><br/> | ||
571 | <Normal Text> } </Normal Text><At Rule>@else</At Rule><Normal Text> </Normal Text><At Rule>if</At Rule><Normal Text> </Normal Text><Variable>$type</Variable><Normal Text> </Normal Text><Operator>==</Operator><Normal Text> monster {</Normal Text><br/> | 571 | <Normal Text> } </Normal Text><At Rule>@else</At Rule><Normal Text> </Normal Text><At Rule>if</At Rule><Normal Text> </Normal Text><Variable>$type</Variable><Normal Text> </Normal Text><Operator>==</Operator><Normal Text> monster {</Normal Text><br/> | ||
572 | <Normal Text> </Normal Text><Property>color</Property><Normal Text>: </Normal Text><Color>green</Color><Separator Symbol>;</Separator Symbol><br/> | 572 | <Normal Text> </Normal Text><Property>color</Property><Normal Text>: </Normal Text><Color>green</Color><Separator Symbol>;</Separator Symbol><br/> | ||
573 | <Normal Text> } </Normal Text><At Rule>@else</At Rule><Normal Text> {</Normal Text><br/> | 573 | <Normal Text> } </Normal Text><At Rule>@else</At Rule><Normal Text> {</Normal Text><br/> | ||
574 | <Normal Text> </Normal Text><Property>color</Property><Normal Text>: </Normal Text><Color>black</Color><Separator Symbol>;</Separator Symbol><br/> | 574 | <Normal Text> </Normal Text><Property>color</Property><Normal Text>: </Normal Text><Color>black</Color><Separator Symbol>;</Separator Symbol><br/> | ||
575 | <Normal Text> }</Normal Text><br/> | 575 | <Normal Text> }</Normal Text><br/> | ||
576 | <Normal Text>}</Normal Text><br/> | 576 | <Normal Text>}</Normal Text><br/> | ||
577 | <Normal Text></Normal Text><br/> | 577 | <Normal Text></Normal Text><br/> | ||
578 | <At Rule>@for</At Rule><Normal Text> </Normal Text><Variable>$i</Variable><Normal Text> from </Normal Text><Number>1</Number><Normal Text> through </Normal Text><Number>3</Number><Normal Text> {</Normal Text><br/> | 578 | <At Rule>@for</At Rule><Normal Text> </Normal Text><Variable>$i</Variable><Normal Text> from </Normal Text><Number>1</Number><Normal Text> through </Normal Text><Number>3</Number><Normal Text> {</Normal Text><br/> | ||
579 | <Normal Text> </Normal Text><Selector Class>.item-</Selector Class><Variable>#{$i}</Variable><Normal Text> { </Normal Text><Property>width</Property><Normal Text>: </Normal Text><Number>2</Number><Unit>em</Unit><Normal Text> </Normal Text><Operator>*</Operator><Normal Text> </Normal Text><Variable>$i</Variable><Separator Symbol>;</Separator Symbol><Normal Text> }</Normal Text><br/> | 579 | <Normal Text> </Normal Text><Selector Class>.item-</Selector Class><Interpolation>#{</Interpolation><Variable>$i</Variable><Interpolation>}</Interpolation><Normal Text> { </Normal Text><Property>width</Property><Normal Text>: </Normal Text><Number>2</Number><Unit>em</Unit><Normal Text> </Normal Text><Operator>*</Operator><Normal Text> </Normal Text><Variable>$i</Variable><Separator Symbol>;</Separator Symbol><Normal Text> }</Normal Text><br/> | ||
580 | <Normal Text>}</Normal Text><br/> | 580 | <Normal Text>}</Normal Text><br/> | ||
581 | <Normal Text></Normal Text><br/> | 581 | <Normal Text></Normal Text><br/> | ||
582 | <At Rule>@each</At Rule><Normal Text> </Normal Text><Variable>$animal</Variable><Normal Text> in puma, sea-slug, egret, salamander {</Normal Text><br/> | 582 | <At Rule>@each</At Rule><Normal Text> </Normal Text><Variable>$animal</Variable><Normal Text> in puma, sea-slug, egret, salamander {</Normal Text><br/> | ||
583 | <Normal Text> </Normal Text><Selector Class>.</Selector Class><Variable>#{$animal}</Variable><Selector Tag>-icon</Selector Tag><Normal Text> {</Normal Text><br/> | 583 | <Normal Text> </Normal Text><Selector Class>.</Selector Class><Interpolation>#{</Interpolation><Variable>$animal</Variable><Interpolation>}</Interpolation><Selector Tag>-icon</Selector Tag><Normal Text> {</Normal Text><br/> | ||
584 | <Normal Text> </Normal Text><Property>background-image</Property><Normal Text>: </Normal Text><Function>url(</Function><String>'/images/#{$animal}.png'</String><Function>)</Function><Separator Symbol>;</Separator Symbol><br/> | 584 | <Normal Text> </Normal Text><Property>background-image</Property><Normal Text>: </Normal Text><Function>url(</Function><String>'/images/</String><Interpolation>#{</Interpolation><Variable>$animal</Variable><Interpolation>}</Interpolation><String>.png'</String><Function>)</Function><Separator Symbol>;</Separator Symbol><br/> | ||
585 | <Normal Text> }</Normal Text><br/> | 585 | <Normal Text> }</Normal Text><br/> | ||
586 | <Normal Text>}</Normal Text><br/> | 586 | <Normal Text>}</Normal Text><br/> | ||
587 | <Normal Text></Normal Text><br/> | 587 | <Normal Text></Normal Text><br/> | ||
588 | <At Rule>@each</At Rule><Normal Text> </Normal Text><Variable>$animal</Variable><Normal Text>, </Normal Text><Variable>$color</Variable><Normal Text>, </Normal Text><Variable>$cursor</Variable><Normal Text> in (puma, </Normal Text><Color>black</Color><Normal Text>, </Normal Text><Value>default</Value><Normal Text>),</Normal Text><br/> | 588 | <At Rule>@each</At Rule><Normal Text> </Normal Text><Variable>$animal</Variable><Normal Text>, </Normal Text><Variable>$color</Variable><Normal Text>, </Normal Text><Variable>$cursor</Variable><Normal Text> in (puma, </Normal Text><Color>black</Color><Normal Text>, </Normal Text><Value>default</Value><Normal Text>),</Normal Text><br/> | ||
589 | <Normal Text> (sea-slug, </Normal Text><Color>blue</Color><Normal Text>, </Normal Text><Value>pointer</Value><Normal Text>),</Normal Text><br/> | 589 | <Normal Text> (sea-slug, </Normal Text><Color>blue</Color><Normal Text>, </Normal Text><Value>pointer</Value><Normal Text>),</Normal Text><br/> | ||
590 | <Normal Text> (egret, </Normal Text><Color>white</Color><Normal Text>, </Normal Text><Value>move</Value><Normal Text>) {</Normal Text><br/> | 590 | <Normal Text> (egret, </Normal Text><Color>white</Color><Normal Text>, </Normal Text><Value>move</Value><Normal Text>) {</Normal Text><br/> | ||
591 | <Normal Text> </Normal Text><Selector Class>.</Selector Class><Variable>#{$animal}</Variable><Selector Tag>-icon</Selector Tag><Normal Text> {</Normal Text><br/> | 591 | <Normal Text> </Normal Text><Selector Class>.</Selector Class><Interpolation>#{</Interpolation><Variable>$animal</Variable><Interpolation>}</Interpolation><Selector Tag>-icon</Selector Tag><Normal Text> {</Normal Text><br/> | ||
592 | <Normal Text> </Normal Text><Property>background-image</Property><Normal Text>: </Normal Text><Function>url(</Function><String>'/images/#{$animal}.png'</String><Function>)</Function><Separator Symbol>;</Separator Symbol><br/> | 592 | <Normal Text> </Normal Text><Property>background-image</Property><Normal Text>: </Normal Text><Function>url(</Function><String>'/images/</String><Interpolation>#{</Interpolation><Variable>$animal</Variable><Interpolation>}</Interpolation><String>.png'</String><Function>)</Function><Separator Symbol>;</Separator Symbol><br/> | ||
593 | <Normal Text> </Normal Text><Property>border</Property><Normal Text>: </Normal Text><Number>2</Number><Unit>px</Unit><Normal Text> </Normal Text><Value>solid</Value><Normal Text> </Normal Text><Variable>$color</Variable><Separator Symbol>;</Separator Symbol><br/> | 593 | <Normal Text> </Normal Text><Property>border</Property><Normal Text>: </Normal Text><Number>2</Number><Unit>px</Unit><Normal Text> </Normal Text><Value>solid</Value><Normal Text> </Normal Text><Variable>$color</Variable><Separator Symbol>;</Separator Symbol><br/> | ||
594 | <Normal Text> </Normal Text><Property>cursor</Property><Normal Text>: </Normal Text><Variable>$cursor</Variable><Separator Symbol>;</Separator Symbol><br/> | 594 | <Normal Text> </Normal Text><Property>cursor</Property><Normal Text>: </Normal Text><Variable>$cursor</Variable><Separator Symbol>;</Separator Symbol><br/> | ||
595 | <Normal Text> }</Normal Text><br/> | 595 | <Normal Text> }</Normal Text><br/> | ||
596 | <Normal Text>}</Normal Text><br/> | 596 | <Normal Text>}</Normal Text><br/> | ||
597 | <Normal Text></Normal Text><br/> | 597 | <Normal Text></Normal Text><br/> | ||
598 | <At Rule>@each</At Rule><Normal Text> </Normal Text><Variable>$header</Variable><Normal Text>, </Normal Text><Variable>$size</Variable><Normal Text> in (h1: </Normal Text><Number>2</Number><Unit>em</Unit><Normal Text>, h2: </Normal Text><Number>1.5</Number><Unit>em</Unit><Normal Text>, h3: </Normal Text><Number>1.2</Number><Unit>em</Unit><Normal Text>) {</Normal Text><br/> | 598 | <At Rule>@each</At Rule><Normal Text> </Normal Text><Variable>$header</Variable><Normal Text>, </Normal Text><Variable>$size</Variable><Normal Text> in (h1: </Normal Text><Number>2</Number><Unit>em</Unit><Normal Text>, h2: </Normal Text><Number>1.5</Number><Unit>em</Unit><Normal Text>, h3: </Normal Text><Number>1.2</Number><Unit>em</Unit><Normal Text>) {</Normal Text><br/> | ||
599 | <Normal Text> </Normal Text><Variable>#{$header}</Variable><Normal Text> {</Normal Text><br/> | 599 | <Normal Text> </Normal Text><Interpolation>#{</Interpolation><Variable>$header</Variable><Interpolation>}</Interpolation><Normal Text> {</Normal Text><br/> | ||
600 | <Normal Text> </Normal Text><Property>font-size</Property><Normal Text>: </Normal Text><Variable>$size</Variable><Separator Symbol>;</Separator Symbol><br/> | 600 | <Normal Text> </Normal Text><Property>font-size</Property><Normal Text>: </Normal Text><Variable>$size</Variable><Separator Symbol>;</Separator Symbol><br/> | ||
601 | <Normal Text> }</Normal Text><br/> | 601 | <Normal Text> }</Normal Text><br/> | ||
602 | <Normal Text>}</Normal Text><br/> | 602 | <Normal Text>}</Normal Text><br/> | ||
603 | <Normal Text></Normal Text><br/> | 603 | <Normal Text></Normal Text><br/> | ||
604 | <Variable>$i</Variable><Normal Text>: </Normal Text><Number>6</Number><Separator Symbol>;</Separator Symbol><br/> | 604 | <Variable>$i</Variable><Normal Text>: </Normal Text><Number>6</Number><Separator Symbol>;</Separator Symbol><br/> | ||
605 | <At Rule>@while</At Rule><Normal Text> </Normal Text><Variable>$i</Variable><Normal Text> > </Normal Text><Number>0</Number><Normal Text> {</Normal Text><br/> | 605 | <At Rule>@while</At Rule><Normal Text> </Normal Text><Variable>$i</Variable><Normal Text> > </Normal Text><Number>0</Number><Normal Text> {</Normal Text><br/> | ||
606 | <Normal Text> </Normal Text><Selector Class>.item-</Selector Class><Variable>#{$i}</Variable><Normal Text> { </Normal Text><Property>width</Property><Normal Text>: </Normal Text><Number>2</Number><Unit>em</Unit><Normal Text> </Normal Text><Operator>*</Operator><Normal Text> </Normal Text><Variable>$i</Variable><Separator Symbol>;</Separator Symbol><Normal Text> }</Normal Text><br/> | 606 | <Normal Text> </Normal Text><Selector Class>.item-</Selector Class><Interpolation>#{</Interpolation><Variable>$i</Variable><Interpolation>}</Interpolation><Normal Text> { </Normal Text><Property>width</Property><Normal Text>: </Normal Text><Number>2</Number><Unit>em</Unit><Normal Text> </Normal Text><Operator>*</Operator><Normal Text> </Normal Text><Variable>$i</Variable><Separator Symbol>;</Separator Symbol><Normal Text> }</Normal Text><br/> | ||
607 | <Normal Text> </Normal Text><Variable>$i</Variable><Normal Text>: </Normal Text><Variable>$i</Variable><Normal Text> </Normal Text><Operator>-</Operator><Normal Text> </Normal Text><Number>2</Number><Separator Symbol>;</Separator Symbol><br/> | 607 | <Normal Text> </Normal Text><Variable>$i</Variable><Normal Text>: </Normal Text><Variable>$i</Variable><Normal Text> </Normal Text><Operator>-</Operator><Normal Text> </Normal Text><Number>2</Number><Separator Symbol>;</Separator Symbol><br/> | ||
608 | <Normal Text>}</Normal Text><br/> | 608 | <Normal Text>}</Normal Text><br/> | ||
609 | <Normal Text></Normal Text><br/> | 609 | <Normal Text></Normal Text><br/> | ||
610 | <At Rule>@mixin</At Rule><Normal Text> </Normal Text><Function>large-text</Function><Normal Text> {</Normal Text><br/> | 610 | <At Rule>@mixin</At Rule><Normal Text> </Normal Text><Function>large-text</Function><Normal Text> {</Normal Text><br/> | ||
611 | <Normal Text> </Normal Text><Property>font</Property><Normal Text>: {</Normal Text><br/> | 611 | <Normal Text> </Normal Text><Property>font</Property><Normal Text>: {</Normal Text><br/> | ||
612 | <Normal Text> </Normal Text><Property>family</Property><Normal Text>: Arial</Normal Text><Separator Symbol>;</Separator Symbol><br/> | 612 | <Normal Text> </Normal Text><Property>family</Property><Normal Text>: Arial</Normal Text><Separator Symbol>;</Separator Symbol><br/> | ||
613 | <Normal Text> </Normal Text><Property>size</Property><Normal Text>: </Normal Text><Number>20</Number><Unit>px</Unit><Separator Symbol>;</Separator Symbol><br/> | 613 | <Normal Text> </Normal Text><Property>size</Property><Normal Text>: </Normal Text><Number>20</Number><Unit>px</Unit><Separator Symbol>;</Separator Symbol><br/> | ||
614 | <Normal Text> </Normal Text><Property>weight</Property><Normal Text>: </Normal Text><Value>bold</Value><Separator Symbol>;</Separator Symbol><br/> | 614 | <Normal Text> </Normal Text><Property>weight</Property><Normal Text>: </Normal Text><Value>bold</Value><Separator Symbol>;</Separator Symbol><br/> | ||
▲ Show 20 Lines • Show All 71 Lines • ▼ Show 20 Line(s) | |||||
686 | <Variable>$grid-width</Variable><Normal Text>: </Normal Text><Number>40</Number><Unit>px</Unit><Separator Symbol>;</Separator Symbol><br/> | 686 | <Variable>$grid-width</Variable><Normal Text>: </Normal Text><Number>40</Number><Unit>px</Unit><Separator Symbol>;</Separator Symbol><br/> | ||
687 | <Variable>$gutter-width</Variable><Normal Text>: </Normal Text><Number>10</Number><Unit>px</Unit><Separator Symbol>;</Separator Symbol><br/> | 687 | <Variable>$gutter-width</Variable><Normal Text>: </Normal Text><Number>10</Number><Unit>px</Unit><Separator Symbol>;</Separator Symbol><br/> | ||
688 | <Normal Text></Normal Text><br/> | 688 | <Normal Text></Normal Text><br/> | ||
689 | <At Rule>@function</At Rule><Normal Text> </Normal Text><Function>grid-width</Function><Normal Text>(</Normal Text><Variable>$n</Variable><Normal Text>) {</Normal Text><br/> | 689 | <At Rule>@function</At Rule><Normal Text> </Normal Text><Function>grid-width</Function><Normal Text>(</Normal Text><Variable>$n</Variable><Normal Text>) {</Normal Text><br/> | ||
690 | <Normal Text> </Normal Text><At Rule>@return</At Rule><Normal Text> </Normal Text><Variable>$n</Variable><Normal Text> </Normal Text><Operator>*</Operator><Normal Text> </Normal Text><Variable>$grid-width</Variable><Normal Text> </Normal Text><Operator>+</Operator><Normal Text> (</Normal Text><Variable>$n</Variable><Normal Text> </Normal Text><Operator>-</Operator><Normal Text> </Normal Text><Number>1</Number><Normal Text>) </Normal Text><Operator>*</Operator><Normal Text> </Normal Text><Variable>$gutter-width</Variable><Separator Symbol>;</Separator Symbol><br/> | 690 | <Normal Text> </Normal Text><At Rule>@return</At Rule><Normal Text> </Normal Text><Variable>$n</Variable><Normal Text> </Normal Text><Operator>*</Operator><Normal Text> </Normal Text><Variable>$grid-width</Variable><Normal Text> </Normal Text><Operator>+</Operator><Normal Text> (</Normal Text><Variable>$n</Variable><Normal Text> </Normal Text><Operator>-</Operator><Normal Text> </Normal Text><Number>1</Number><Normal Text>) </Normal Text><Operator>*</Operator><Normal Text> </Normal Text><Variable>$gutter-width</Variable><Separator Symbol>;</Separator Symbol><br/> | ||
691 | <Normal Text>}</Normal Text><br/> | 691 | <Normal Text>}</Normal Text><br/> | ||
692 | <Normal Text></Normal Text><br/> | 692 | <Normal Text></Normal Text><br/> | ||
693 | <Selector Id>#sidebar</Selector Id><Normal Text> { </Normal Text><Property>width</Property><Normal Text>: </Normal Text><Function>grid-width(</Function><Number>5</Number><Function>)</Function><Separator Symbol>;</Separator Symbol><Normal Text> }</Normal Text><br/> | 693 | <Selector Id>#sidebar</Selector Id><Normal Text> { </Normal Text><Property>width</Property><Normal Text>: </Normal Text><Function>grid-width(</Function><Number>5</Number><Function>)</Function><Separator Symbol>;</Separator Symbol><Normal Text> }</Normal Text><br/> | ||
694 | <Normal Text></Normal Text><br/> | ||||
695 | <At Rule>@mixin</At Rule><Normal Text> </Normal Text><Function>unify-parent</Function><Normal Text>(</Normal Text><Variable>$child</Variable><Normal Text>) {</Normal Text><br/> | ||||
696 | <Normal Text> </Normal Text><At Rule>@at-root</At Rule><Normal Text> </Normal Text><Interpolation>#{</Interpolation><Function>selector-unify(</Function><Normal Text>&</Normal Text><Separator Symbol>,</Separator Symbol><Normal Text> </Normal Text><Variable>$child</Variable><Function>)</Function><Interpolation>}</Interpolation><Normal Text> {</Normal Text><br/> | ||||
697 | <Normal Text> </Normal Text><At Rule>@content</At Rule><Separator Symbol>;</Separator Symbol><br/> | ||||
698 | <Normal Text> }</Normal Text><br/> | ||||
699 | <Normal Text>}</Normal Text><br/> | ||||
700 | <Normal Text></Normal Text><br/> | ||||
701 | <Selector Pseudo>:root</Selector Pseudo><Normal Text> {</Normal Text><br/> | ||||
702 | <Normal Text> </Normal Text><Variable>--font-family-sans-serif</Variable><Normal Text>: </Normal Text><Interpolation>#{</Interpolation><Function>inspect(</Function><Variable>$font-family-sans-serif</Variable><Function>)</Function><Interpolation>}</Interpolation><Separator Symbol>;</Separator Symbol><br/> | ||||
703 | <Normal Text> </Normal Text><Variable>--font-family-monospace</Variable><Normal Text>: </Normal Text><Interpolation>#{</Interpolation><Function>inspect(</Function><Variable>$font-family-monospace</Variable><Function>)</Function><Interpolation>}</Interpolation><Separator Symbol>;</Separator Symbol><br/> | ||||
704 | <Normal Text>}</Normal Text><br/> | ||||
705 | <Normal Text></Normal Text><br/> | ||||
706 | <Selector Tag>div</Selector Tag><Normal Text> {</Normal Text><br/> | ||||
707 | <Normal Text> </Normal Text><Property>background-image</Property><Normal Text>: </Normal Text><Function>url(</Function><String>"/icons/</String><Interpolation>#{</Interpolation><Variable>$name</Variable><Interpolation>}</Interpolation><String>.svg"</String><Function>)</Function><Separator Symbol>;</Separator Symbol><br/> | ||||
708 | <Normal Text> </Normal Text><Property>font</Property><Normal Text>: </Normal Text><Interpolation>#{</Interpolation><String>"string"</String><Interpolation>}</Interpolation><Separator Symbol>;</Separator Symbol><br/> | ||||
709 | <Normal Text>}</Normal Text><br/> |