Skip to content

GitLab

Commit caab251a authored by Oskar Kalbag's avatar Oskar Kalbag
Browse files

Rules are now written out only once if there is no REM substitution.

parent 337ca76b
Hide whitespace changes
Inline Side-by-side
Showing with 47 additions and 17 deletions
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
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment

Like this? Fund us! Your patronage helps keep us independent and going.