.not(<fn>)
now uses the same syntax as creation.
&.not(_.Visited)
you now use &.not(_.visited)
boolStyle
has been replaced with styleF.bool
.intStyle
has been replaced with styleF.int
."<string>.color"
removed due to addition of compiler-checked colour literals. (see below)&(cond)
and &(mediaQuery)
removed as styles can now be applied directly.
# Migration aid
find . -type f -name '*.scala' -exec perl -pi -e 's/(?<!\w)boolStyle\(/styleF.bool(/g' {} +
find . -type f -name '*.scala' -exec perl -pi -e 's/(?<!\w)intStyle\(/styleF.int(/g' {} +
find . -type f -name '*.scala' -exec perl -pi -e 's/(".+?").color/c$1/g' {} +
Styles are now automatically named according to their variable name.
object AdminPage extends StyleSheet.Inline {
import dsl._
val header = style(display.block)
val hasError =
styleF.bool(ok => styleS(
backgroundColor(if (ok) green else red)))
}
will generate
.AdminPage-header { display: block }
.AdminPage-hasError-t { background-color: green }
.AdminPage-hasError-f { background-color: red }
Note: Class names are still overridable, same as before.
Note: ProdDefaults
favours short, meaningless names and so disables this behaviour.
New option in Defaults
called registerMacroName
.
Typically either MacroName.Use
or MacroName.Ignore
.
Colour literals are now checked at compile-time. Instead of
backgroundColor("#fc9")
you must now prefix colour literals with a c
, like this:
backgroundColor(c"#fc9")
An invalid colour literal will result an a compiler error, example:
backgroundColor(c"#ffcc99") // ok
backgroundColor(c"#ffcc9") // 5 digits = compiler error
This works for colour functions too, even though we have Scala DSL for that. These are also valid if you prefer this representation:
backgroundColor(c"hsl(200, 20%, 10%)")
backgroundColor(c"rgb(0%, 20%, 10%)")
backgroundColor(c"rgba(0, 0, 0, 0.5)")
backgroundColor(c"rgb(30, 30, 300)") // 300 is too large = compiler error
// etc
If you want to bypass colour literal validation, you can use Color()
:
backgroundColor(Color("i break you css!"))
DSL: grey(int)
for greyscale colours.
Style functions (styleF
) can now have manually-specified names; they will be suffixed as required.
val s = styleF("manual").bool(b => ...)
Conditions can be applied to anything usable in a style, including mixins and unsafeChild
.
Resolution unit: dppx
(dots-per-px).
Inline stylesheets: new helper initInnerObjects()
. From the scaladoc:
Objects in Scala are lazy. If you put styles in inner objects you need to make sure they're initialised before your styles are rendered. To do so, call this at the end of your stylesheet with one style from each inner object.
There is an example in Gotchas.
React module: Add GlobalRegistry.addToDocumentOnRegistration()
to workaround an
IE limitation.