Skip to content
GitLab
Menu
Projects
Groups
Snippets
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
Ind.ie Projects
Responsive Pixels
Commits
caab251a
Commit
caab251a
authored
Jul 15, 2013
by
Oskar Kalbag
Browse files
Rules are now written out only once if there is no REM substitution.
parent
337ca76b
Changes
2
Hide whitespace changes
Inline
Side-by-side
css/tests.css
View file @
caab251a
...
...
@@ -3,20 +3,21 @@ body {
border
:
0.0625rem
solid
#000
;
width
:
1000px
;
/* Note: nested if on purpose. Otherwise Stylus runs all conditionals, causing an error (doesn’t break on first false one) */
/* Make sure that the rule is written out only once in case there is no rem substitution */
width
:
62.5rem
;
margin
:
24px
;
margin
:
1.5rem
;
padding
:
48px
;
padding
:
3rem
;
line-height
:
24px
;
line-height
:
1.5rem
;
font-size
:
18px
;
/* Note: nested if on purpose. Otherwise Stylus runs all conditionals, causing an error (doesn’t break on first false one) */
/* Make sure that the rule is written out only once in case there is no rem substitution */
font-size
:
1.125rem
;
}
div
{
width
:
500px
;
/* Note: nested if on purpose. Otherwise Stylus runs all conditionals, causing an error (doesn’t break on first false one) */
/* Make sure that the rule is written out only once in case there is no rem substitution */
width
:
31.25rem
;
margin
:
24px
0
;
margin
:
1.5rem
0
;
...
...
@@ -25,6 +26,7 @@ div {
h1
{
font-size
:
48px
;
/* Note: nested if on purpose. Otherwise Stylus runs all conditionals, causing an error (doesn’t break on first false one) */
/* Make sure that the rule is written out only once in case there is no rem substitution */
font-size
:
3rem
;
line-height
:
72px
;
line-height
:
4.5rem
;
...
...
@@ -32,35 +34,34 @@ h1 {
h2
{
font-size
:
24px
;
/* Note: nested if on purpose. Otherwise Stylus runs all conditionals, causing an error (doesn’t break on first false one) */
/* Make sure that the rule is written out only once in case there is no rem substitution */
font-size
:
1.5rem
;
line-height
:
36px
;
line-height
:
2.25rem
;
margin-top
:
36px
;
/* Note: nested if on purpose. Otherwise Stylus runs all conditionals, causing an error (doesn’t break on first false one) */
/* Make sure that the rule is written out only once in case there is no rem substitution */
margin-top
:
2.25rem
;
margin-bottom
:
24px
;
/* Note: nested if on purpose. Otherwise Stylus runs all conditionals, causing an error (doesn’t break on first false one) */
/* Make sure that the rule is written out only once in case there is no rem substitution */
margin-bottom
:
1.5rem
;
border-bottom
:
1px
solid
#000
;
border-bottom
:
0.0625rem
solid
#000
;
}
#test-margin-inherit-parent-element
{
margin
:
42px
;
margin
:
2.625rem
;
border
:
1px
dashed
;
border
:
0.0625rem
dashed
;
}
#test-margin-inherit
{
margin
:
inherit
;
margin
:
inherit
;
}
#test-margin-horizontal-centering
{
margin
:
0
auto
;
margin
:
0
auto
;
}
#test-margin-one-argument
{
margin
:
10px
;
margin
:
0.625rem
;
}
#test-margin-two-arguments
{
margin
:
10px
20px
;
...
...
@@ -76,31 +77,35 @@ h2 {
}
#test-margin-four-arguments
{
margin
:
10px
20px
30px
40px
;
/* Make sure that the rule is written out only once in case there is no rem substitution */
margin
:
0.625rem
1.25rem
1.875rem
2.5rem
;
}
#test-margin-top
{
margin-top
:
10px
;
/* Note: nested if on purpose. Otherwise Stylus runs all conditionals, causing an error (doesn’t break on first false one) */
/* Make sure that the rule is written out only once in case there is no rem substitution */
margin-top
:
0.625rem
;
}
#test-margin-right
{
margin-right
:
20px
;
/* Note: nested if on purpose. Otherwise Stylus runs all conditionals, causing an error (doesn’t break on first false one) */
/* Make sure that the rule is written out only once in case there is no rem substitution */
margin-right
:
1.25rem
;
}
#test-margin-bottom
{
margin-bottom
:
30px
;
/* Note: nested if on purpose. Otherwise Stylus runs all conditionals, causing an error (doesn’t break on first false one) */
/* Make sure that the rule is written out only once in case there is no rem substitution */
margin-bottom
:
1.875rem
;
}
#test-margin-left
{
margin-left
:
40px
;
/* Note: nested if on purpose. Otherwise Stylus runs all conditionals, causing an error (doesn’t break on first false one) */
/* Make sure that the rule is written out only once in case there is no rem substitution */
margin-left
:
2.5rem
;
}
#test-padding-one-argument
{
padding
:
10px
;
padding
:
0.625rem
;
}
#test-padding-two-arguments
{
padding
:
10px
20px
;
...
...
@@ -112,35 +117,42 @@ h2 {
}
#test-padding-four-arguments
{
padding
:
10px
20px
30px
40px
;
/* Make sure that the rule is written out only once in case there is no rem substitution */
padding
:
0.625rem
1.25rem
1.875rem
2.5rem
;
}
#test-padding-top
{
padding-top
:
10px
;
/* Note: nested if on purpose. Otherwise Stylus runs all conditionals, causing an error (doesn’t break on first false one) */
/* Make sure that the rule is written out only once in case there is no rem substitution */
padding-top
:
0.625rem
;
}
#test-padding-right
{
padding-right
:
20px
;
/* Note: nested if on purpose. Otherwise Stylus runs all conditionals, causing an error (doesn’t break on first false one) */
/* Make sure that the rule is written out only once in case there is no rem substitution */
padding-right
:
1.25rem
;
}
#test-padding-bottom
{
padding-bottom
:
30px
;
/* Note: nested if on purpose. Otherwise Stylus runs all conditionals, causing an error (doesn’t break on first false one) */
/* Make sure that the rule is written out only once in case there is no rem substitution */
padding-bottom
:
1.875rem
;
}
#test-padding-left
{
padding-left
:
40px
;
/* Note: nested if on purpose. Otherwise Stylus runs all conditionals, causing an error (doesn’t break on first false one) */
/* Make sure that the rule is written out only once in case there is no rem substitution */
padding-left
:
2.5rem
;
}
#test-font-size-inherit
{
font-size
:
inherit
;
/* Note: nested if on purpose. Otherwise Stylus runs all conditionals, causing an error (doesn’t break on first false one) */
/* Make sure that the rule is written out only once in case there is no rem substitution */
}
#test-font-size
{
font-size
:
42px
;
/* Note: nested if on purpose. Otherwise Stylus runs all conditionals, causing an error (doesn’t break on first false one) */
/* Make sure that the rule is written out only once in case there is no rem substitution */
font-size
:
2.625rem
;
line-height
:
63px
;
line-height
:
3.9375rem
;
...
...
@@ -148,7 +160,9 @@ h2 {
#test-width-hundred-percent
{
width
:
50px
;
/* Note: nested if on purpose. Otherwise Stylus runs all conditionals, causing an error (doesn’t break on first false one) */
/* Make sure that the rule is written out only once in case there is no rem substitution */
width
:
3.125rem
;
width
:
100%
;
/* Note: nested if on purpose. Otherwise Stylus runs all conditionals, causing an error (doesn’t break on first false one) */
/* Make sure that the rule is written out only once in case there is no rem substitution */
}
index.styl
View file @
caab251a
...
...
@@ -153,7 +153,7 @@ line-height(h)
/* Convert unit if pixel */
fallbackify(value)
if value == 'inherit' || value == 'auto' || value == 0
if value == 'inherit' || value == 'auto' || value == 0
|| value == null
value
else if unit(value) == 'px'
unit(value, 'px')
...
...
@@ -161,7 +161,7 @@ fallbackify(value)
unit(value, unit(value))
remify(value)
if value == 'inherit' || value == 'auto' || value == 0
if value == 'inherit' || value == 'auto' || value == 0
|| value == null
value
else if unit(value) == 'px'
unit(value/16, 'rem')
...
...
@@ -178,18 +178,33 @@ abstract-shorthand(attr, originalArguments)
b = originalArguments[2]
l = originalArguments[3]
fT = fallbackify(t)
fR = fallbackify(r)
fB = fallbackify(b)
fL = fallbackify(l)
rT = remify(t)
rR = remify(r)
rB = remify(b)
rL = remify(l)
if l || l == 0
{attr} fallbackify(t) fallbackify(r) fallbackify(b) fallbackify(l)
{attr} remify(t) remify(r) remify(b) remify(l)
{attr} fT fR fB fL
/* Make sure that the rule is written out only once in case there is no rem substitution */
if !(fT == rT && fR == rR && fB == rB && fL == rL)
{attr} rT rR rB rL
else if b || b == 0
{attr} fallbackify(t) fallbackify(r) fallbackify(b)
{attr} remify(t) remify(r) remify(b)
{attr} fT fR fB
if !(fT == rT && fR == rR && fB == rB)
{attr} rT rR rB
else if r || r == 0
{attr} fallbackify(t) fallbackify(r)
{attr} remify(t) remify(r)
{attr} fT fR
if !(fT == rT && fR == rR)
{attr} remify(t) remify(r)
else if t || t == 0
{attr} fallbackify(t)
{attr} remify(t)
{attr} fT
if !(fT = rT)
{attr} remify(t)
/* Abstract longhand for attributes that take a single value */
...
...
@@ -201,6 +216,7 @@ abstract-longhand(attr, originalArguments)
{attr} fallbackifyValue
/* Note: nested if on purpose. Otherwise Stylus runs all conditionals, causing an error (doesn’t break on first false one) */
/* Make sure that the rule is written out only once in case there is no rem substitution */
if fallbackifyValue != 'inherit'
if fallbackifyValue != 'auto'
if fallbackifyValue != 0
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment