Ind.ie is now Small Technology Foundation.
Commit caab251a authored by Oskar Kalbag's avatar Oskar Kalbag

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

parent 337ca76b
......@@ -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 */
}
......@@ -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