More properties, val i.o. fun

build.gradle.kts

@@ -1,5 +1,5 @@
 plugins {
-    kotlin("multiplatform") version "1.3.70-eap-184"
+    kotlin("multiplatform") version "1.4-M1"
 }
 
 group = "nl.astraeus"
@@ -10,14 +10,21 @@ repositories {
     mavenCentral()
 }
 
-apply(plugin = "kotlin-dce-js")
+//apply(plugin = "kotlin-dce-js")
 
 kotlin {
     /* Targets configuration omitted. 
     *  To find out how to configure the targets, please follow the link:
     *  https://kotlinlang.org/docs/reference/building-mpp-with-gradle.html#setting-up-targets */
     jvm()
-    js()
+    js {
+        produceExecutable()
+        browser {
+            distribution {
+                directory = File("$projectDir/web/")
+            }
+        }
+    }
 
     sourceSets {
         val commonMain by getting {

src/commonMain/kotlin/nl/astraeus/css/CssBuilder.kt

@@ -1,12 +1,14 @@
 package nl.astraeus.css
 
+import nl.astraeus.css.style.ConditionalCss
+import nl.astraeus.css.style.ConditionalStyle
 import nl.astraeus.css.style.Css
 import nl.astraeus.css.style.Style
 
 fun css(definition: Css) = definition
 
-fun style(definition: Css): Style {
+fun style(definition: ConditionalCss): ConditionalStyle {
-    val css = Style()
+    val css = ConditionalStyle()
 
     definition(css)
 

src/commonMain/kotlin/nl/astraeus/css/properties/AlignContent.kt

@@ -1,26 +1,17 @@
 package nl.astraeus.css.properties
 
-enum class AlignContentValue(
-    val value: String
-): CssValue {
-    STRETCH("stretch"),
-    ;
-
-    override fun css() = value
-}
-
 class AlignContent(
     value: String
 ) : CssProperty(value) {
 
     companion object {
-        fun stretch() = AlignContent("stretch")
+        val stretch = AlignContent("stretch")
-        fun center() = AlignContent("center")
+        val center = AlignContent("center")
-        fun flexStart() = AlignContent("flex-start")
+        val flexStart = AlignContent("flex-start")
-        fun flexEnd() = AlignContent("flex-end")
+        val flexEnd = AlignContent("flex-end")
-        fun spaceBetween() = AlignContent("space-between")
+        val spaceBetween = AlignContent("space-between")
-        fun spaceAround() = AlignContent("space-around")
+        val spaceAround = AlignContent("space-around")
-        fun initial() = AlignContent("initial")
+        val initial = AlignContent("initial")
-        fun inherit() = AlignContent("inherit")
+        val inherit = AlignContent("inherit")
     }
 }

src/commonMain/kotlin/nl/astraeus/css/properties/AlignItems.kt

@@ -1,16 +1,17 @@
 package nl.astraeus.css.properties
 
-enum class AlignItems(
+class AlignItems(
-    val value: String
+    value: String
-): CssValue {
+): CssProperty(value) {
-    STRETCH("stretch"),
+
-    CENTER("center"),
+    companion object {
-    FLEX_START("flex-start"),
+        val stretch = AlignItems("stretch")
-    FLEX_END("flex-end"),
+        val center = AlignItems("center")
-    BASELINE("baseline"),
+        val flexStart = AlignItems("flex-start")
-    INITIAL("initial"),
+        val flexEnd = AlignItems("flex-end")
-    INHERIT("inherit"),
+        val baseline = AlignItems("baseline")
-    ;
+        val initial = AlignItems("initial")
+        val inherit = AlignItems("inherit")
+    }
 
-    override fun css(): String = value
 }

src/commonMain/kotlin/nl/astraeus/css/properties/AlignSelf.kt

@@ -1,17 +1,18 @@
 package nl.astraeus.css.properties
 
-enum class AlignSelf(
+class AlignSelf(
-    val value: String
+    value: String
-): CssValue {
+): CssProperty(value) {
-    AUTO("auto"),
+
-    STRETCH("stretch"),
+    companion object {
-    CENTER("center"),
+        val auto = AlignSelf("auto")
-    FLEX_START("flex-start"),
+        val stretch = AlignSelf("stretch")
-    FLEX_END("flex-end"),
+        val center = AlignSelf("center")
-    BASELINE("baseline"),
+        val flexStart = AlignSelf("flex-start")
-    INITIAL("initial"),
+        val flexEnd = AlignSelf("flex-end")
-    INHERIT("inherit"),
+        val baseline = AlignSelf("baseline")
-    ;
+        val initial = AlignSelf("initial")
+        val inherit = AlignSelf("inherit")
+    }
 
-    override fun css(): String = value
 }

src/commonMain/kotlin/nl/astraeus/css/properties/All.kt

@@ -1,13 +1,14 @@
 package nl.astraeus.css.properties
 
-enum class All(
+class All(
-    val value: String
+    value: String
-): CssValue {
+): CssProperty(value) {
-    UNSET("unset"),
+
-    REVERT("revert"),
+    companion object {
-    INITIAL("initial"),
+        val unset = All("unset")
-    INHERIT("inherit"),
+        val revert = All("revert")
-    ;
+        val initial = All("initial")
+        val inherit = All("inherit")
+    }
 
-    override fun css(): String = value
 }

src/commonMain/kotlin/nl/astraeus/css/properties/Animation.kt

@@ -5,12 +5,12 @@ class AnimationDirection(
 ) : CssProperty(value) {
 
     companion object {
-        fun normal() = AnimationDirection("normal")
+        val normal = AnimationDirection("normal")
-        fun reverse() = AnimationDirection("reverse")
+        val reverse = AnimationDirection("reverse")
-        fun alternate() = AnimationDirection("alternate")
+        val alternate = AnimationDirection("alternate")
-        fun alternateReverse() = AnimationDirection("alternate-reverse")
+        val alternateReverse = AnimationDirection("alternate-reverse")
-        fun initial() = AnimationDirection("initial")
+        val initial = AnimationDirection("initial")
-        fun inherit() = AnimationDirection("inherit")
+        val inherit = AnimationDirection("inherit")
     }
 }
 
@@ -19,12 +19,12 @@ class AnimationFillMode(
 ) : CssProperty(value) {
 
     companion object {
-        fun none() = AnimationFillMode("none")
+        val none = AnimationFillMode("none")
-        fun forwards() = AnimationFillMode("forwards")
+        val forwards = AnimationFillMode("forwards")
-        fun backwards() = AnimationFillMode("backwards")
+        val backwards = AnimationFillMode("backwards")
-        fun both() = AnimationFillMode("both")
+        val both = AnimationFillMode("both")
-        fun initial() = AnimationFillMode("initial")
+        val initial = AnimationFillMode("initial")
-        fun inherit() = AnimationFillMode("inherit")
+        val inherit = AnimationFillMode("inherit")
     }
 }
 
@@ -33,10 +33,10 @@ class AnimationFrame(
 ): CssProperty(value) {
 
     companion object {
-        fun name(name: String): AnimationFrame = AnimationFrame(name)
+        fun name(name: String) = AnimationFrame(name)
-        fun none(): AnimationFrame = AnimationFrame("none")
+        val none: AnimationFrame = AnimationFrame("none")
-        fun initial(): AnimationFrame = AnimationFrame("initial")
+        val initial: AnimationFrame = AnimationFrame("initial")
-        fun inherit(): AnimationFrame = AnimationFrame("inherit")
+        val inherit: AnimationFrame = AnimationFrame("inherit")
     }
 }
 
@@ -47,31 +47,9 @@ class AnimationPlayState(
 
     companion object {
         fun name(name: String) = AnimationPlayState(name)
-        fun paused() = AnimationPlayState("paused")
+        val paused = AnimationPlayState("paused")
-        fun running() = AnimationPlayState("running")
+        val running = AnimationPlayState("running")
-        fun initial() = AnimationPlayState("initial")
+        val initial = AnimationPlayState("initial")
-        fun inherit() = AnimationPlayState("inherit")
+        val inherit = AnimationPlayState("inherit")
-    }
-}
-
-class AnimationTimingFunction(
-    value: String = ""
-) : CssProperty(value) {
-
-    companion object {
-        fun linear() = AnimationTimingFunction("linear")
-        fun ease() = AnimationTimingFunction("ease")
-        fun easeIn() = AnimationTimingFunction("ease-in")
-        fun easeOut() = AnimationTimingFunction("ease-out")
-        fun easeInOut() = AnimationTimingFunction("ease-in-out")
-        fun cubicBezier(
-            n1: Double,
-            n2: Double,
-            n3: Double,
-            n4: Double
-        ) = AnimationTimingFunction("cubic-bezier($n1,$n2,$n3,$n4)")
-        fun initial() = AnimationTimingFunction("initial")
-        fun inherit() = AnimationTimingFunction("inherit")
-
     }
 }

src/commonMain/kotlin/nl/astraeus/css/properties/BackfaceVisibility.kt

@@ -5,9 +5,9 @@ class BackfaceVisibility(
 ) : CssProperty(value) {
 
     companion object {
-        fun visible() = BackfaceVisibility("visible")
+        val visible = BackfaceVisibility("visible")
-        fun hidden() = BackfaceVisibility("hidden")
+        val hidden = BackfaceVisibility("hidden")
-        fun initial() = BackfaceVisibility("initial")
+        val initial = BackfaceVisibility("initial")
-        fun inherit() = BackfaceVisibility("inherit")
+        val inherit = BackfaceVisibility("inherit")
     }
 }

src/commonMain/kotlin/nl/astraeus/css/properties/Background.kt

@@ -5,11 +5,11 @@ class BackgroundAttachment(
 ) : CssProperty(value) {
 
     companion object {
-        fun scroll() = BackgroundAttachment("scroll")
+        val scroll = BackgroundAttachment("scroll")
-        fun fixed() = BackgroundAttachment("fixed")
+        val fixed = BackgroundAttachment("fixed")
-        fun local() = BackgroundAttachment("local")
+        val local = BackgroundAttachment("local")
-        fun initial() = BackgroundAttachment("initial")
+        val initial = BackgroundAttachment("initial")
-        fun inherit() = BackgroundAttachment("inherit")
+        val inherit = BackgroundAttachment("inherit")
     }
 }
 
@@ -18,16 +18,16 @@ class BackgroundBlendMode(
 ) : CssProperty(value) {
 
     companion object {
-        fun normal() = BackgroundBlendMode("normal")
+        val normal = BackgroundBlendMode("normal")
-        fun multiply() = BackgroundBlendMode("multiply")
+        val multiply = BackgroundBlendMode("multiply")
-        fun screen() = BackgroundBlendMode("screen")
+        val screen = BackgroundBlendMode("screen")
-        fun overlay() = BackgroundBlendMode("overlay")
+        val overlay = BackgroundBlendMode("overlay")
-        fun darken() = BackgroundBlendMode("darken")
+        val darken = BackgroundBlendMode("darken")
-        fun lighten() = BackgroundBlendMode("lighten")
+        val lighten = BackgroundBlendMode("lighten")
-        fun colorDodge() = BackgroundBlendMode("color-dodge")
+        val colorDodge = BackgroundBlendMode("color-dodge")
-        fun saturation() = BackgroundBlendMode("saturation")
+        val saturation = BackgroundBlendMode("saturation")
-        fun color() = BackgroundBlendMode("color")
+        val color = BackgroundBlendMode("color")
-        fun luminosity() = BackgroundBlendMode("luminosity")
+        val luminosity = BackgroundBlendMode("luminosity")
     }
 }
 
@@ -36,12 +36,11 @@ class BackgroundPosition(
 ) : CssProperty(value) {
 
     companion object {
-        fun left() = BackgroundPosition("left")
+        val left = BackgroundPosition("left")
-        fun center() = BackgroundPosition("center")
+        val center = BackgroundPosition("center")
-        fun right() = BackgroundPosition("right")
+        val right = BackgroundPosition("right")
-        fun initial() = BackgroundPosition("initial")
+        val initial = BackgroundPosition("initial")
-        fun inherit() = BackgroundPosition("inherit")
+        val inherit = BackgroundPosition("inherit")
-
     }
 }
 
@@ -50,15 +49,15 @@ class BackgroundRepeat(
 ) : CssProperty(value) {
 
     companion object {
-        fun repeat() = BackgroundRepeat("repeat")
+        val repeat = BackgroundRepeat("repeat")
-        fun repeatX() = BackgroundRepeat("repeat-x")
+        val repeatX = BackgroundRepeat("repeat-x")
-        fun repeatY() = BackgroundRepeat("repeat-y")
+        val repeatY = BackgroundRepeat("repeat-y")
-        fun noRepeat() = BackgroundRepeat("no-repeat")
+        val noRepeat = BackgroundRepeat("no-repeat")
-        fun space() = BackgroundRepeat("space")
+        val space = BackgroundRepeat("space")
-        fun round() = BackgroundRepeat("round")
+        val round = BackgroundRepeat("round")
-        fun initial() = BackgroundRepeat("initial")
+        val initial = BackgroundRepeat("initial")
-        fun inherit() = BackgroundRepeat("inherit")
+        val inherit = BackgroundRepeat("inherit")
-        fun unset() = BackgroundRepeat("unset")
+        val unset = BackgroundRepeat("unset")
     }
 }
 
@@ -69,11 +68,12 @@ class BackgroundSize(
     companion object {
         fun px(px: Int) = BackgroundSize("${px}px")
         fun perc(pc: Double) = BackgroundSize("${pc}%")
-        fun auto() = BackgroundSize("auto")
+
-        fun cover() = BackgroundSize("cover")
+        val auto = BackgroundSize("auto")
-        fun contain() = BackgroundSize("contain")
+        val cover = BackgroundSize("cover")
-        fun initial() = BackgroundSize("initial")
+        val contain = BackgroundSize("contain")
-        fun inherit() = BackgroundSize("inherit")
+        val initial = BackgroundSize("initial")
+        val inherit = BackgroundSize("inherit")
     }
 }
 

src/commonMain/kotlin/nl/astraeus/css/properties/Border.kt

@@ -13,8 +13,8 @@ class BorderRadius(
         fun pc(nr: Double) = BorderRadius("${nr}pc")
         fun cm(nr: Int) = BorderRadius("${nr}cm")
         fun cm(nr: Double) = BorderRadius("${nr}cm")
-        fun initial() = BorderRadius("initial")
+        val initial = BorderRadius("initial")
-        fun inherit() = BorderRadius("inherit")
+        val inherit = BorderRadius("inherit")
     }
 }
 
@@ -23,18 +23,18 @@ class BorderStyle(
 ): CssProperty(value) {
 
     companion object {
-        fun none() = BorderStyle("none")
+        val none = BorderStyle("none")
-        fun hidden() = BorderStyle("hidden")
+        val hidden = BorderStyle("hidden")
-        fun dotted() = BorderStyle("dotted")
+        val dotted = BorderStyle("dotted")
-        fun dashed() = BorderStyle("dashed")
+        val dashed = BorderStyle("dashed")
-        fun solid() = BorderStyle("solid")
+        val solid = BorderStyle("solid")
-        fun double() = BorderStyle("double")
+        val double = BorderStyle("double")
-        fun groove() = BorderStyle("groove")
+        val groove = BorderStyle("groove")
-        fun ridge() = BorderStyle("ridge")
+        val ridge = BorderStyle("ridge")
-        fun inset() = BorderStyle("inset")
+        val inset = BorderStyle("inset")
-        fun outset() = BorderStyle("outset")
+        val outset = BorderStyle("outset")
-        fun initial() = BorderStyle("initial")
+        val initial = BorderStyle("initial")
-        fun inherit() = BorderStyle("inherit")
+        val inherit = BorderStyle("inherit")
     }
 }
 
@@ -43,11 +43,11 @@ class BorderWidth(
 ): CssProperty(value) {
 
     companion object {
-        fun thin() = BorderWidth("thin")
+        val thin = BorderWidth("thin")
-        fun medium() = BorderWidth("medium")
+        val medium = BorderWidth("medium")
-        fun thick() = BorderWidth("thick")
+        val thick = BorderWidth("thick")
-        fun initial() = BorderWidth("initial")
+        val initial = BorderWidth("initial")
-        fun inherit() = BorderWidth("inherit")
+        val inherit = BorderWidth("inherit")
     }
 }
 
@@ -56,8 +56,8 @@ class BorderCollapse(
 ): CssProperty(value) {
 
     companion object {
-        fun separate() = BorderCollapse("separate")
+        val separate = BorderCollapse("separate")
-        fun collapse() = BorderCollapse("collapse")
+        val collapse = BorderCollapse("collapse")
     }
 }
 
@@ -70,9 +70,9 @@ class BorderImageWidth (
         fun nr(nr: Int) = BorderImageWidth("$nr")
         fun perc(nr: Int) = BorderImageWidth("${nr}%")
         fun perc(nr: Double) = BorderImageWidth("${nr}%")
-        fun auto() = BorderImageWidth("auto")
+        val auto = BorderImageWidth("auto")
-        fun initial() = BorderImageWidth("initial")
+        val initial = BorderImageWidth("initial")
-        fun inherit() = BorderImageWidth("inherit")
+        val inherit = BorderImageWidth("inherit")
     }
 }
 
@@ -90,7 +90,7 @@ class BorderSpacing(
         fun pc(nr: Double) = BorderSpacing("${nr}pc")
         fun cm(nr: Int) = BorderSpacing("${nr}cm")
         fun cm(nr: Double) = BorderSpacing("${nr}cm")
-        fun initial() = BorderSpacing("initial")
+        val initial = BorderSpacing("initial")
-        fun inherit() = BorderSpacing("inherit")
+        val inherit = BorderSpacing("inherit")
     }
 }

src/commonMain/kotlin/nl/astraeus/css/properties/Box.kt

@@ -5,11 +5,11 @@ class BoxDecorationBreak(
 ): CssProperty(value) {
 
     companion object {
-        fun slice() = BoxDecorationBreak("slice")
+        val slice = BoxDecorationBreak("slice")
-        fun clone() = BoxDecorationBreak("clone")
+        val clone = BoxDecorationBreak("clone")
-        fun initial() = BoxDecorationBreak("initial")
+        val initial = BoxDecorationBreak("initial")
-        fun inherit() = BoxDecorationBreak("inherit")
+        val inherit = BoxDecorationBreak("inherit")
-        fun unset() = BoxDecorationBreak("unset")
+        val unset = BoxDecorationBreak("unset")
     }
 }
 
@@ -18,11 +18,12 @@ class BoxShadow(
 ): CssProperty(value) {
 
     companion object {
-        fun none() = BoxShadow("none")
+        val none = BoxShadow("none")
+        val inset = BoxShadow("inset")
+        val initial = BoxShadow("initial")
+        val inherit = BoxShadow("inherit")
+
         fun text(txt: String) = BoxShadow(txt)
-        fun inset() = BoxShadow("inset")
-        fun initial() = BoxShadow("initial")
-        fun inherit() = BoxShadow("inherit")
     }
 }
 
@@ -31,9 +32,9 @@ class BoxSizing(
 ): CssProperty(value) {
 
     companion object {
-        fun contextBox() = BoxSizing("content-box")
+        val contextBox = BoxSizing("content-box")
-        fun borderBox() = BoxSizing("border-box")
+        val borderBox = BoxSizing("border-box")
-        fun initial() = BoxShadow("initial")
+        val initial = BoxShadow("initial")
-        fun inherit() = BoxShadow("inherit")
+        val inherit = BoxShadow("inherit")
     }
 }

src/commonMain/kotlin/nl/astraeus/css/properties/Break.kt

@@ -6,22 +6,22 @@ class Break(
 ): CssProperty(value) {
 
     companion object {
-        fun auto() = Break("auto")
+        val auto = Break("auto")
-        fun all() = Break("all")
+        val all = Break("all")
-        fun always() = Break("always")
+        val always = Break("always")
-        fun avoid() = Break("avoid")
+        val avoid = Break("avoid")
-        fun avoidColumn() = Break("avoid-column")
+        val avoidColumn = Break("avoid-column")
-        fun avoidPage() = Break("avoid-page")
+        val avoidPage = Break("avoid-page")
-        fun avoidRegion() = Break("avoid-region")
+        val avoidRegion = Break("avoid-region")
-        fun column() = Break("column")
+        val column = Break("column")
-        fun left() = Break("left")
+        val left = Break("left")
-        fun page() = Break("page")
+        val page = Break("page")
-        fun recto() = Break("recto")
+        val recto = Break("recto")
-        fun region() = Break("region")
+        val region = Break("region")
-        fun right() = Break("right")
+        val right = Break("right")
-        fun verso() = Break("verso")
+        val verso = Break("verso")
-        fun initial() = Break("initial")
+        val initial = Break("initial")
-        fun inherit() = Break("inherit")
+        val inherit = Break("inherit")
     }
 
 }

src/commonMain/kotlin/nl/astraeus/css/properties/Caption.kt

@@ -5,10 +5,10 @@ class CaptionSide(
 ): CssProperty(value) {
 
     companion object {
-        fun top() = CaptionSide("top")
+        val top = CaptionSide("top")
-        fun bottom() = CaptionSide("bottom")
+        val bottom = CaptionSide("bottom")
-        fun initial() = CaptionSide("initial")
+        val initial = CaptionSide("initial")
-        fun inherit() = CaptionSide("inherit")
+        val inherit = CaptionSide("inherit")
     }
 
 }

src/commonMain/kotlin/nl/astraeus/css/properties/Clear.kt

@@ -6,12 +6,12 @@ class Clear(
 ): CssProperty(value) {
 
     companion object {
-        fun none() = Clear("none")
+        val none = Clear("none")
-        fun left() = Clear("left")
+        val left = Clear("left")
-        fun right() = Clear("right")
+        val right = Clear("right")
-        fun both() = Clear("both")
+        val both = Clear("both")
-        fun initial() = Clear("initial")
+        val initial = Clear("initial")
-        fun inherit() = Clear("inherit")
+        val inherit = Clear("inherit")
     }
 
 }

src/commonMain/kotlin/nl/astraeus/css/properties/Clip.kt

@@ -5,10 +5,10 @@ class Clip(
 ) : CssProperty(value) {
 
     companion object {
-        fun auto() = Clip("auto")
         fun rect(top: Int, right: Int, bottom: Int, left: Int) = Clip("rect(${top}px,${right}px,${bottom}px,${left}px)")
-        fun initial() = Clip("initial")
+        val auto = Clip("auto")
-        fun inherit() = Clip("inherit")
+        val initial = Clip("initial")
+        val inherit = Clip("inherit")
 
     }
 }
@@ -18,7 +18,7 @@ class ClipPath(
 ) : CssProperty(value) {
 
     companion object {
-        fun auto() = ClipPath("auto")
+        val auto = ClipPath("auto")
         fun circle(perc: Double) = ClipPath("circle(${perc}%)")
         fun ellipse(radiusX: Double, radiusY: Double) = ClipPath("ellipse(${radiusX}%,${radiusY}%)")
         fun ellipse(
@@ -27,15 +27,18 @@ class ClipPath(
             positionX: Double,
             positionY: Double
         ) = ClipPath("ellipse(${radiusX}%,${radiusY}% at ${positionX}%,${positionY}%)")
+
         // todo: other options
-        fun marginBox() = ClipPath("margin-box")
+        fun other(text: String) = ClipPath(text)
-        fun borderBox() = ClipPath("border-box")
+
-        fun paddingBox() = ClipPath("padding-box")
+        val marginBox = ClipPath("margin-box")
-        fun contentBox() = ClipPath("content-box")
+        val borderBox = ClipPath("border-box")
-        fun fillBox() = ClipPath("fill-box")
+        val paddingBox = ClipPath("padding-box")
-        fun strokeBox() = ClipPath("stroke-box")
+        val contentBox = ClipPath("content-box")
-        fun viewBox() = ClipPath("view-box")
+        val fillBox = ClipPath("fill-box")
-        fun none() = ClipPath("none")
+        val strokeBox = ClipPath("stroke-box")
+        val viewBox = ClipPath("view-box")
+        val none = ClipPath("none")
     }
 }
 
@@ -44,11 +47,11 @@ class ClipOrigin(
 ) : CssProperty(value) {
 
     companion object {
-        fun borderBox() = ClipOrigin("border-box")
+        val borderBox = ClipOrigin("border-box")
-        fun paddingBox() = ClipOrigin("padding-box")
+        val paddingBox = ClipOrigin("padding-box")
-        fun contentBox() = ClipOrigin("content-box")
+        val contentBox = ClipOrigin("content-box")
-        fun initial() = ClipOrigin("initial")
+        val initial = ClipOrigin("initial")
-        fun inherit() = ClipOrigin("inherit")
+        val inherit = ClipOrigin("inherit")
 
     }
 }

src/commonMain/kotlin/nl/astraeus/css/properties/Color.kt

@@ -5,10 +5,10 @@ class Color(
 ) : CssProperty(value) {
 
     companion object {
-        fun auto() = Color("auto")
+        val auto = Color("auto")
-        fun transparant() = Color("transparant")
+        val transparant = Color("transparant")
-        fun initial() = Color("initial")
+        val initial = Color("initial")
-        fun inherit() = Color("inherit")
+        val inherit = Color("inherit")
         fun hex(hex: String) = Color("#$hex")
         fun rgb(
             red: Int,

src/commonMain/kotlin/nl/astraeus/css/properties/Common.kt

@@ -14,8 +14,8 @@ class Length(
         fun pc(nr: Double) = Length("${nr}pc")
         fun cm(nr: Int) = Length("${nr}cm")
         fun cm(nr: Double) = Length("${nr}cm")
-        fun initial() = Length("initial")
+        val initial = Length("initial")
-        fun inherit() = Length("inherit")
+        val inherit = Length("inherit")
     }
 
 }
@@ -25,9 +25,9 @@ class Fill(
 ) : CssProperty(value) {
 
     companion object {
-        fun balance() = Fill("balance")
+        val balance = Fill("balance")
-        fun auto() = Fill("auto")
+        val auto = Fill("auto")
-        fun initial() = Fill("initial")
+        val initial = Fill("initial")
-        fun inherit() = Fill("inherit")
+        val inherit = Fill("inherit")
     }
 }

src/commonMain/kotlin/nl/astraeus/css/properties/Content.kt

@@ -5,18 +5,19 @@ class Content(
 ) : CssProperty(value) {
 
     companion object {
-        fun normal() = Content("normal")
+        val normal = Content("normal")
-        fun none() = Content("none")
+        val none = Content("none")
-        fun counter() = Content("counter")
+        val counter = Content("counter")
+        val openQuote = Content("open-quote")
+        val closeQuote = Content("close-quote")
+        val noOpenQuote = Content("no-open-quote")
+        val noCloseQuote = Content("no-close-quote")
+        val initial = Content("initial")
+        val inherit = Content("inherit")
+
         fun attr(attribute: String) = Content("attr($attribute)")
         fun string(txt: String) = Content("\"$txt\"")
-        fun openQuote() = Content("open-quote")
-        fun closeQuote() = Content("close-quote")
-        fun noOpenQuote() = Content("no-open-quote")
-        fun noCloseQuote() = Content("no-close-quote")
         fun url(url: String) = Content("url($url)")
-        fun initial() = Content("initial")
-        fun inherit() = Content("inherit")
     }
 
 }

src/commonMain/kotlin/nl/astraeus/css/properties/Count.kt

@@ -5,10 +5,11 @@ class  Count(
 ) : CssProperty(value) {
 
     companion object {
+        val auto: Count = Count("auto")
+        val infinite: Count = Count("infinite")
+        val initial: Count = Count("initial")
+        val inherit: Count = Count("inherit")
+
         fun count(number: Int): Count = Count("$number")
-        fun auto(): Count = Count("auto")
-        fun infinite(): Count = Count("infinite")
-        fun initial(): Count = Count("initial")
-        fun inherit(): Count = Count("inherit")
     }
 }

src/commonMain/kotlin/nl/astraeus/css/properties/CssFloat.kt

@@ -0,0 +1,15 @@
+package nl.astraeus.css.properties
+
+class CssFloat(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        val none = CssFloat("none")
+        val left = CssFloat("left")
+        val right = CssFloat("right")
+        val initial = CssFloat("initial")
+        val inherit = CssFloat("inherit")
+    }
+
+}

src/commonMain/kotlin/nl/astraeus/css/properties/DelayDuration.kt

@@ -5,8 +5,10 @@ class DelayDuration(
 ) : CssProperty(value) {
 
     companion object {
+        val initial = DelayDuration("initial")
+        val inherit = DelayDuration("inherit")
+
         fun seconds(seconds: Int) = DelayDuration("${seconds}s")
-        fun initial() = DelayDuration("initial")
+        fun millis(milliSeconds: Int) = DelayDuration("${milliSeconds}ms")
-        fun inherit() = DelayDuration("inherit")
     }
 }

src/commonMain/kotlin/nl/astraeus/css/properties/Direction.kt

@@ -5,10 +5,10 @@ class Direction(
 ) : CssProperty(value) {
 
     companion object {
-        fun ltr() = Direction("ltr")
+        val ltr = Direction("ltr")
-        fun rtl() = Direction("rtl")
+        val rtl = Direction("rtl")
-        fun initial() = Direction("initial")
+        val initial = Direction("initial")
-        fun inherit() = Direction("inherit")
+        val inherit = Direction("inherit")
     }
 
 }

src/commonMain/kotlin/nl/astraeus/css/properties/Display.kt

@@ -5,29 +5,29 @@ class Display(
 ) : CssProperty(value) {
 
     companion object {
-        fun inline() = Display("inline")
+        val inline = Display("inline")
-        fun block() = Display("block")
+        val block = Display("block")
-        fun contents() = Display("contents")
+        val contents = Display("contents")
-        fun flex() = Display("flex")
+        val flex = Display("flex")
-        fun grid() = Display("grid")
+        val grid = Display("grid")
-        fun inlineBlock() = Display("inline-block")
+        val inlineBlock = Display("inline-block")
-        fun inlineFlex() = Display("inline-flex")
+        val inlineFlex = Display("inline-flex")
-        fun inlineGrid() = Display("inline-grid")
+        val inlineGrid = Display("inline-grid")
-        fun inlineTable() = Display("inline-table")
+        val inlineTable = Display("inline-table")
-        fun listItem() = Display("list-item")
+        val listItem = Display("list-item")
-        fun runIn() = Display("run-in")
+        val runIn = Display("run-in")
-        fun table() = Display("table")
+        val table = Display("table")
-        fun tableCaption() = Display("table-caption")
+        val tableCaption = Display("table-caption")
-        fun tableColumnGroup() = Display("table-column-group")
+        val tableColumnGroup = Display("table-column-group")
-        fun tableHeaderGroup() = Display("table-header-group")
+        val tableHeaderGroup = Display("table-header-group")
-        fun tableFooterGroup() = Display("table-footer-group")
+        val tableFooterGroup = Display("table-footer-group")
-        fun tableRowGroup() = Display("table-row-group")
+        val tableRowGroup = Display("table-row-group")
-        fun tableCell() = Display("table-cell")
+        val tableCell = Display("table-cell")
-        fun tableColumn() = Display("table-column")
+        val tableColumn = Display("table-column")
-        fun tableRow() = Display("table-row")
+        val tableRow = Display("table-row")
-        fun none() = Display("none")
+        val none = Display("none")
-        fun initial() = Display("initial")
+        val initial = Display("initial")
-        fun inherit() = Display("inherit")
+        val inherit = Display("inherit")
     }
 
 }

src/commonMain/kotlin/nl/astraeus/css/properties/EmptyCells.kt

@@ -5,10 +5,10 @@ class EmptyCells(
 ) : CssProperty(value) {
 
     companion object {
-        fun show() = EmptyCells("show")
+        val show = EmptyCells("show")
-        fun hide() = EmptyCells("hide")
+        val hide = EmptyCells("hide")
-        fun initial() = EmptyCells("initial")
+        val initial = EmptyCells("initial")
-        fun inherit() = EmptyCells("inherit")
+        val inherit = EmptyCells("inherit")
     }
 
 }

src/commonMain/kotlin/nl/astraeus/css/properties/Flex.kt

@@ -5,12 +5,12 @@ class FlexDirection(
 ) : CssProperty(value) {
 
     companion object {
-        fun row() = FlexDirection("row")
+        val row = FlexDirection("row")
-        fun rowReverse() = FlexDirection("row-reverse")
+        val rowReverse = FlexDirection("row-reverse")
-        fun column() = FlexDirection("column")
+        val column = FlexDirection("column")
-        fun columnReverse() = FlexDirection("column-reverse")
+        val columnReverse = FlexDirection("column-reverse")
-        fun initial() = FlexDirection("initial")
+        val initial = FlexDirection("initial")
-        fun inherit() = FlexDirection("inherit")
+        val inherit = FlexDirection("inherit")
     }
 
 }
@@ -20,9 +20,10 @@ class FlexGrowShrink(
 ) : CssProperty(value) {
 
     companion object {
+        val initial = FlexGrowShrink("initial")
+        val inherit = FlexGrowShrink("inherit")
+
         fun number(number: Int) = FlexGrowShrink("$number")
-        fun initial() = FlexGrowShrink("initial")
-        fun inherit() = FlexGrowShrink("inherit")
     }
 
 }
@@ -32,11 +33,11 @@ class FlexWrap(
 ) : CssProperty(value) {
 
     companion object {
-        fun nowrap() = FlexWrap("nowrap")
+        val nowrap = FlexWrap("nowrap")
-        fun wrap() = FlexWrap("wrap")
+        val wrap = FlexWrap("wrap")
-        fun wrapReverse() = FlexWrap("wrap-reverse")
+        val wrapReverse = FlexWrap("wrap-reverse")
-        fun initial() = FlexWrap("initial")
+        val initial = FlexWrap("initial")
-        fun inherit() = FlexWrap("inherit")
+        val inherit = FlexWrap("inherit")
     }
 
 }

src/commonMain/kotlin/nl/astraeus/css/properties/Float.kt

@@ -1,15 +0,0 @@
-package nl.astraeus.css.properties
-
-class Float(
-    value: String
-) : CssProperty(value) {
-
-    companion object {
-        fun none() = Float("none")
-        fun left() = Float("left")
-        fun right() = Float("right")
-        fun initial() = Float("initial")
-        fun inherit() = Float("inherit")
-    }
-
-}

src/commonMain/kotlin/nl/astraeus/css/properties/Font.kt

@@ -5,15 +5,18 @@ class FontSize(
 ) : CssProperty(value) {
 
     companion object {
-        fun xxSmall() = FontSize("xx-small")
+        val xxSmall = FontSize("xx-small")
-        fun xSmall() = FontSize("x-small")
+        val xSmall = FontSize("x-small")
-        fun small() = FontSize("small")
+        val small = FontSize("small")
-        fun medium() = FontSize("medium")
+        val medium = FontSize("medium")
-        fun large() = FontSize("large")
+        val large = FontSize("large")
-        fun xLarge() = FontSize("x-large")
+        val xLarge = FontSize("x-large")
-        fun xxLarge() = FontSize("xx-large")
+        val xxLarge = FontSize("xx-large")
-        fun smaller() = FontSize("smaller")
+        val smaller = FontSize("smaller")
-        fun larger() = FontSize("larger")
+        val larger = FontSize("larger")
+        val initial = FontSize("initial")
+        val inherit = FontSize("inherit")
+
         fun px(nr: Int) = FontSize("${nr}px")
         fun em(nr: Int) = FontSize("${nr}em")
         fun em(nr: Double) = FontSize("${nr}em")
@@ -23,8 +26,6 @@ class FontSize(
         fun pc(nr: Double) = FontSize("${nr}pc")
         fun cm(nr: Int) = FontSize("${nr}cm")
         fun cm(nr: Double) = FontSize("${nr}cm")
-        fun initial() = FontSize("initial")
-        fun inherit() = FontSize("inherit")
     }
 
 }
@@ -34,17 +35,17 @@ class FontStretch(
 ) : CssProperty(value) {
 
     companion object {
-        fun normal() = FontStretch("normal")
+        val normal = FontStretch("normal")
-        fun condensed() = FontStretch("condensed")
+        val condensed = FontStretch("condensed")
-        fun ultraCondensed() = FontStretch("ultra-condensed")
+        val ultraCondensed = FontStretch("ultra-condensed")
-        fun extraCondensed() = FontStretch("extra-condensed")
+        val extraCondensed = FontStretch("extra-condensed")
-        fun semiCondensed() = FontStretch("semi-condensed")
+        val semiCondensed = FontStretch("semi-condensed")
-        fun expanded() = FontStretch("expanded")
+        val expanded = FontStretch("expanded")
-        fun semiExpanded() = FontStretch("semi-expanded")
+        val semiExpanded = FontStretch("semi-expanded")
-        fun extraExpanded() = FontStretch("extra-expanded")
+        val extraExpanded = FontStretch("extra-expanded")
-        fun ultraExpanded() = FontStretch("ultra-expanded")
+        val ultraExpanded = FontStretch("ultra-expanded")
-        fun initial() = FontWeight("initial")
+        val initial = FontWeight("initial")
-        fun inherit() = FontWeight("inherit")
+        val inherit = FontWeight("inherit")
     }
 
 }
@@ -54,11 +55,11 @@ class FontStyle(
 ) : CssProperty(value) {
 
     companion object {
-        fun normal() = FontStyle("normal")
+        val normal = FontStyle("normal")
-        fun italic() = FontStyle("italic")
+        val italic = FontStyle("italic")
-        fun oblique() = FontStyle("oblique")
+        val oblique = FontStyle("oblique")
-        fun initial() = FontStyle("initial")
+        val initial = FontStyle("initial")
-        fun inherit() = FontStyle("inherit")
+        val inherit = FontStyle("inherit")
     }
 
 }
@@ -68,19 +69,19 @@ class FontWeight(
 ) : CssProperty(value) {
 
     companion object {
-        fun normal() = FontWeight("normal")
+        val normal = FontWeight("normal")
-        fun bold() = FontWeight("bold")
+        val bold = FontWeight("bold")
-        fun _100() = FontWeight("100")
+        val _100 = FontWeight("100")
-        fun _200() = FontWeight("200")
+        val _200 = FontWeight("200")
-        fun _300() = FontWeight("300")
+        val _300 = FontWeight("300")
-        fun _400() = FontWeight("400")
+        val _400 = FontWeight("400")
-        fun _500() = FontWeight("500")
+        val _500 = FontWeight("500")
-        fun _600() = FontWeight("600")
+        val _600 = FontWeight("600")
-        fun _700() = FontWeight("700")
+        val _700 = FontWeight("700")
-        fun _800() = FontWeight("800")
+        val _800 = FontWeight("800")
-        fun _900() = FontWeight("900")
+        val _900 = FontWeight("900")
-        fun initial() = FontWeight("initial")
+        val initial = FontWeight("initial")
-        fun inherit() = FontWeight("inherit")
+        val inherit = FontWeight("inherit")
     }
 
 }
@@ -90,9 +91,9 @@ class FontKerning(
 ) : CssProperty(value) {
 
     companion object {
-        fun auto() = FontKerning("auto")
+        val auto = FontKerning("auto")
-        fun normal() = FontKerning("normal")
+        val normal = FontKerning("normal")
-        fun none() = FontKerning("none")
+        val none = FontKerning("none")
     }
 
 }
@@ -102,9 +103,9 @@ class FontSizeAdjust(
 ) : CssProperty(value) {
 
     companion object {
-        fun none() = FontSizeAdjust("none")
+        val none = FontSizeAdjust("none")
-        fun initial() = FontSizeAdjust("initial")
+        val initial = FontSizeAdjust("initial")
-        fun inherit() = FontSizeAdjust("inherit")
+        val inherit = FontSizeAdjust("inherit")
     }
 
 }
@@ -114,10 +115,10 @@ class FontVariant(
 ) : CssProperty(value) {
 
     companion object {
-        fun normal() = FontVariant("normal")
+        val normal = FontVariant("normal")
-        fun smallCaps() = FontVariant("small-caps")
+        val smallCaps = FontVariant("small-caps")
-        fun initial() = FontVariant("initial")
+        val initial = FontVariant("initial")
-        fun inherit() = FontVariant("inherit")
+        val inherit = FontVariant("inherit")
     }
 
 }
@@ -127,15 +128,15 @@ class FontVariantCaps(
 ) : CssProperty(value) {
 
     companion object {
-        fun normal() = FontVariantCaps("normal")
+        val normal = FontVariantCaps("normal")
-        fun smallCaps() = FontVariantCaps("small-caps")
+        val smallCaps = FontVariantCaps("small-caps")
-        fun allSmallCaps() = FontVariantCaps("all-small-caps")
+        val allSmallCaps = FontVariantCaps("all-small-caps")
-        fun petiteCaps() = FontVariantCaps("petite-caps")
+        val petiteCaps = FontVariantCaps("petite-caps")
-        fun allPetiteCaps() = FontVariantCaps("all-petite-caps")
+        val allPetiteCaps = FontVariantCaps("all-petite-caps")
-        fun unicase() = FontVariantCaps("unicase")
+        val unicase = FontVariantCaps("unicase")
-        fun initial() = FontVariantCaps("initial")
+        val initial = FontVariantCaps("initial")
-        fun inherit() = FontVariantCaps("inherit")
+        val inherit = FontVariantCaps("inherit")
-        fun unset() = FontVariantCaps("unset")
+        val unset = FontVariantCaps("unset")
     }
 
 }

src/commonMain/kotlin/nl/astraeus/css/properties/Grid.kt

@@ -6,9 +6,9 @@ class Grid(
 ) : CssProperty(value) {
 
     companion object {
-        fun none() = Grid("none")
+        val none = Grid("none")
-        fun initial() = Grid("initial")
+        val initial = Grid("initial")
-        fun inherit() = Grid("inherit")
+        val inherit = Grid("inherit")
     }
 
 }
@@ -18,9 +18,9 @@ class GridAuto(
 ) : CssProperty(value) {
 
     companion object {
-        fun auto() = GridAuto("auto")
+        val auto = GridAuto("auto")
-        fun maxContent() = GridAuto("max-content")
+        val maxContent = GridAuto("max-content")
-        fun minContent() = GridAuto("min-content")
+        val minContent = GridAuto("min-content")
     }
 
 }
@@ -30,11 +30,11 @@ class GridFlow(
 ) : CssProperty(value) {
 
     companion object {
-        fun row() = GridFlow("row")
+        val row = GridFlow("row")
-        fun column() = GridFlow("column")
+        val column = GridFlow("column")
-        fun dense() = GridFlow("dense")
+        val dense = GridFlow("dense")
-        fun rowDense() = GridFlow("row dense")
+        val rowDense = GridFlow("row dense")
-        fun columnDense() = GridFlow("column dense")
+        val columnDense = GridFlow("column dense")
     }
 
 }
@@ -44,7 +44,8 @@ class GridRowColumn(
 ) : CssProperty(value) {
 
     companion object {
-        fun auto() = GridRowColumn("auto")
+        val auto = GridRowColumn("auto")
+
         fun span(column: Int) = GridRowColumn("span $column")
         fun columnLine(line: Int) = GridRowColumn("$line")
         fun rowLine(line: Int) = GridRowColumn("$line")
@@ -57,13 +58,14 @@ class TemplateRowColumn(
 ) : CssProperty(value) {
 
     companion object {
-        fun none() = GridRowColumn("none")
+        val none = GridRowColumn("none")
-        fun auto() = GridRowColumn("auto")
+        val auto = GridRowColumn("auto")
-        fun maxContent() = GridRowColumn("max-content")
+        val maxContent = GridRowColumn("max-content")
-        fun minContent() = GridRowColumn("min-content")
+        val minContent = GridRowColumn("min-content")
+        val initial = GridRowColumn("initial")
+        val inherit = GridRowColumn("inherit")
+
         fun length(length: Measurement) = GridRowColumn(length.value)
-        fun initial() = GridRowColumn("initial")
-        fun inherit() = GridRowColumn("inherit")
     }
 
 }

src/commonMain/kotlin/nl/astraeus/css/properties/Hyphens.kt

@@ -5,11 +5,11 @@ class Hyphens(
 ) : CssProperty(value) {
 
     companion object {
-        fun none() = Hyphens("none")
+        val none = Hyphens("none")
-        fun manual() = Hyphens("manual")
+        val manual = Hyphens("manual")
-        fun auto() = Hyphens("auto")
+        val auto = Hyphens("auto")
-        fun initial() = Hyphens("initial")
+        val initial = Hyphens("initial")
-        fun inherit() = Hyphens("inherit")
+        val inherit = Hyphens("inherit")
     }
 
 }

src/commonMain/kotlin/nl/astraeus/css/properties/Image.kt

@@ -5,10 +5,11 @@ class Image(
 ) : CssProperty(value) {
 
     companion object {
+        val none = Image("none")
+        val initial = Image("initial")
+        val inherit = Image("inherit")
+
         fun url(url: String) = Image("url($url)")
-        fun none() = Image("none")
-        fun initial() = Image("initial")
-        fun inherit() = Image("inherit")
     }
 }
 
@@ -17,11 +18,12 @@ class ImageRepeat(
 ) : CssProperty(value) {
 
     companion object {
+        val repeat = ImageRepeat("repeat")
+        val round = ImageRepeat("round")
+        val initial = ImageRepeat("initial")
+        val inherit = ImageRepeat("inherit")
+
         fun stretch(url: String) = ImageRepeat("stretch")
-        fun repeat() = ImageRepeat("repeat")
-        fun round() = ImageRepeat("round")
-        fun initial() = ImageRepeat("initial")
-        fun inherit() = ImageRepeat("inherit")
     }
 
 }
@@ -31,14 +33,15 @@ class ImageSlice(
 ) : CssProperty(value) {
 
     companion object {
+        val repeat = ImageSlice("repeat")
+        val fill = ImageSlice("fill")
+        val initial = ImageSlice("initial")
+        val inherit = ImageSlice("inherit")
+
         fun nr(nr: Int) = ImageSlice("$nr")
         fun perc(perc: Int) = ImageSlice("$perc%")
         fun perc(perc: Double) = ImageSlice("$perc%")
         fun stretch(url: String) = ImageSlice("stretch")
-        fun repeat() = ImageSlice("repeat")
-        fun fill() = ImageSlice("fill")
-        fun initial() = ImageSlice("initial")
-        fun inherit() = ImageSlice("inherit")
     }
 
 }
@@ -48,11 +51,12 @@ class ImageSource(
 ) : CssProperty(value) {
 
     companion object {
-        fun none() = ImageSource("none")
+        val none = ImageSource("none")
+        val initial = ImageSource("initial")
+        val inherit = ImageSource("inherit")
+
         fun text(txt: String) = ImageSource(txt)
         fun image(url: String) = ImageSource("'$url'")
-        fun initial() = ImageSource("initial")
-        fun inherit() = ImageSource("inherit")
     }
 
 }

src/commonMain/kotlin/nl/astraeus/css/properties/InitialInherit.kt

@@ -0,0 +1,12 @@
+package nl.astraeus.css.properties
+
+class InitialInherit(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        val initial = InitialInherit("initial")
+        val inherit = InitialInherit("inherit")
+    }
+
+}

src/commonMain/kotlin/nl/astraeus/css/properties/Isolation.kt

@@ -5,10 +5,10 @@ class Isolation(
 ) : CssProperty(value) {
 
     companion object {
-        fun auto() = Isolation("auto")
+        val auto = Isolation("auto")
-        fun isolate() = Isolation("isolate")
+        val isolate = Isolation("isolate")
-        fun initial() = Isolation("initial")
+        val initial = Isolation("initial")
-        fun inherit() = Isolation("inherit")
+        val inherit = Isolation("inherit")
     }
 
 }

src/commonMain/kotlin/nl/astraeus/css/properties/JustifyContent.kt

@@ -5,13 +5,13 @@ class JustifyContent(
 ) : CssProperty(value) {
 
     companion object {
-        fun flexStart() = JustifyContent("flex-start")
+        val flexStart = JustifyContent("flex-start")
-        fun flexEnd() = JustifyContent("flex-end")
+        val flexEnd = JustifyContent("flex-end")
-        fun center() = JustifyContent("center")
+        val center = JustifyContent("center")
-        fun spaceBetween() = JustifyContent("space-between")
+        val spaceBetween = JustifyContent("space-between")
-        fun spaceAround() = JustifyContent("space-around")
+        val spaceAround = JustifyContent("space-around")
-        fun initial() = JustifyContent("initial")
+        val initial = JustifyContent("initial")
-        fun inherit() = JustifyContent("inherit")
+        val inherit = JustifyContent("inherit")
     }
 
 }

src/commonMain/kotlin/nl/astraeus/css/properties/LetterSpacing.kt

@@ -5,9 +5,9 @@ class LetterSpacing(
 ) : CssProperty(value) {
 
     companion object {
-        fun normal() = LetterSpacing("normal")
+        val normal = LetterSpacing("normal")
-        fun initial() = LetterSpacing("initial")
+        val initial = LetterSpacing("initial")
-        fun inherit() = LetterSpacing("inherit")
+        val inherit = LetterSpacing("inherit")
     }
 
 }

src/commonMain/kotlin/nl/astraeus/css/properties/ListStyle.kt

@@ -6,10 +6,10 @@ class ListStylePosition(
 ) : CssProperty(value) {
 
     companion object {
-        fun inside() = ListStylePosition("inside")
+        val inside = ListStylePosition("inside")
-        fun outside() = ListStylePosition("outside")
+        val outside = ListStylePosition("outside")
-        fun initial() = ListStylePosition("initial")
+        val initial = ListStylePosition("initial")
-        fun inherit() = ListStylePosition("inherit")
+        val inherit = ListStylePosition("inherit")
     }
 
 }
@@ -19,30 +19,30 @@ class ListStyleType(
 ) : CssProperty(value) {
 
     companion object {
-        fun disc() = ListStyleType("disc")
+        val disc = ListStyleType("disc")
-        fun armenian() = ListStyleType("armenian")
+        val armenian = ListStyleType("armenian")
-        fun circle() = ListStyleType("circle")
+        val circle = ListStyleType("circle")
-        fun cjkIdeographic() = ListStyleType("cjk-ideographic")
+        val cjkIdeographic = ListStyleType("cjk-ideographic")
-        fun decimal() = ListStyleType("decimal")
+        val decimal = ListStyleType("decimal")
-        fun decimalLeadingZero() = ListStyleType("decimal-leading-zero")
+        val decimalLeadingZero = ListStyleType("decimal-leading-zero")
-        fun georgian() = ListStyleType("georgian")
+        val georgian = ListStyleType("georgian")
-        fun hebrew() = ListStyleType("hebrew")
+        val hebrew = ListStyleType("hebrew")
-        fun hiragana() = ListStyleType("hiragana")
+        val hiragana = ListStyleType("hiragana")
-        fun hiraganaIroha() = ListStyleType("hiragana-iroha")
+        val hiraganaIroha = ListStyleType("hiragana-iroha")
-        fun katakana() = ListStyleType("katakana")
+        val katakana = ListStyleType("katakana")
-        fun katakanaIroha() = ListStyleType("katakana-iroha")
+        val katakanaIroha = ListStyleType("katakana-iroha")
-        fun lowerAlpha() = ListStyleType("lower-alpha")
+        val lowerAlpha = ListStyleType("lower-alpha")
-        fun lowerGreek() = ListStyleType("lower-greek")
+        val lowerGreek = ListStyleType("lower-greek")
-        fun lowerLatin() = ListStyleType("lower-latin")
+        val lowerLatin = ListStyleType("lower-latin")
-        fun lowerRoman() = ListStyleType("lower-roman")
+        val lowerRoman = ListStyleType("lower-roman")
-        fun none() = ListStyleType("none")
+        val none = ListStyleType("none")
-        fun square() = ListStyleType("square")
+        val square = ListStyleType("square")
-        fun upperAlpha() = ListStyleType("upper-alpha")
+        val upperAlpha = ListStyleType("upper-alpha")
-        fun upperGreek() = ListStyleType("upper-greek")
+        val upperGreek = ListStyleType("upper-greek")
-        fun upperLatin() = ListStyleType("upper-latin")
+        val upperLatin = ListStyleType("upper-latin")
-        fun upperRoman() = ListStyleType("upper-roman")
+        val upperRoman = ListStyleType("upper-roman")
-        fun initial() = ListStyleType("initial")
+        val initial = ListStyleType("initial")
-        fun inherit() = ListStyleType("inherit")
+        val inherit = ListStyleType("inherit")
     }
 
 }

src/commonMain/kotlin/nl/astraeus/css/properties/Measurement.kt

@@ -5,10 +5,11 @@ open class Measurement(
 ) : CssProperty(value) {
 
     companion object {
-        fun auto() = Measurement("auto")
+        val auto = Measurement("auto")
-        fun initial() = Measurement("initial")
+        val initial = Measurement("initial")
-        fun inherit() = Measurement("inherit")
+        val inherit = Measurement("inherit")
-        fun normal() = Measurement("normal")
+        val normal = Measurement("normal")
+
         fun px(nr: Int) = if (nr == 0) { Measurement("0") } else { Measurement("${nr}px") }
         fun px(nr: Double) = Measurement("${nr}px")
         fun em(nr: Int) = Measurement("${nr}em")
@@ -28,11 +29,15 @@ fun Int.em(): Measurement = Measurement.em(this)
 fun Double.em(): Measurement = Measurement.em(this)
 fun Int.perc(): Measurement = Measurement.perc(this)
 fun Double.perc(): Measurement = Measurement.perc(this)
+fun Int.pc(): Measurement = Measurement.pc(this)
+fun Double.pc(): Measurement = Measurement.pc(this)
+fun Int.cm(): Measurement = Measurement.cm(this)
+fun Double.cm(): Measurement = Measurement.cm(this)
 
 open class LineHeight(value: String) : CssProperty(value) {
     companion object {
-        fun normal() = LineHeight("normal")
+        val normal = LineHeight("normal")
-        fun initial() = LineHeight("initial")
+        val initial = LineHeight("initial")
-        fun inherit() = LineHeight("inherit")
+        val inherit = LineHeight("inherit")
     }
 }

src/commonMain/kotlin/nl/astraeus/css/properties/MixBlendMode.kt

@@ -6,20 +6,20 @@ class MixBlendMode(
 ) : CssProperty(value) {
 
     companion object {
-        fun normal() = MixBlendMode("normal")
+        val normal = MixBlendMode("normal")
-        fun multiply() = MixBlendMode("multiply")
+        val multiply = MixBlendMode("multiply")
-        fun screen() = MixBlendMode("screen")
+        val screen = MixBlendMode("screen")
-        fun overlay() = MixBlendMode("overlay")
+        val overlay = MixBlendMode("overlay")
-        fun darken() = MixBlendMode("darken")
+        val darken = MixBlendMode("darken")
-        fun lighten() = MixBlendMode("lighten")
+        val lighten = MixBlendMode("lighten")
-        fun colorDodge() = MixBlendMode("color-dodge")
+        val colorDodge = MixBlendMode("color-dodge")
-        fun colorBurn() = MixBlendMode("color-burn")
+        val colorBurn = MixBlendMode("color-burn")
-        fun difference() = MixBlendMode("difference")
+        val difference = MixBlendMode("difference")
-        fun exclusion() = MixBlendMode("exclusion")
+        val exclusion = MixBlendMode("exclusion")
-        fun hue() = MixBlendMode("hue")
+        val hue = MixBlendMode("hue")
-        fun saturation() = MixBlendMode("saturation")
+        val saturation = MixBlendMode("saturation")
-        fun color() = MixBlendMode("color")
+        val color = MixBlendMode("color")
-        fun luminosity() = MixBlendMode("luminosity")
+        val luminosity = MixBlendMode("luminosity")
     }
 
 }

src/commonMain/kotlin/nl/astraeus/css/properties/ObjectFit.kt

@@ -5,13 +5,13 @@ class ObjectFit(
 ) : CssProperty(value) {
 
     companion object {
-        fun fill() = ObjectFit("fill")
+        val fill = ObjectFit("fill")
-        fun contain() = ObjectFit("contain")
+        val contain = ObjectFit("contain")
-        fun cover() = ObjectFit("cover")
+        val cover = ObjectFit("cover")
-        fun scaleDown() = ObjectFit("scale-down")
+        val scaleDown = ObjectFit("scale-down")
-        fun none() = ObjectFit("none")
+        val none = ObjectFit("none")
-        fun initial() = ObjectFit("initial")
+        val initial = ObjectFit("initial")
-        fun inherit() = ObjectFit("inherit")
+        val inherit = ObjectFit("inherit")
     }
 
 }

src/commonMain/kotlin/nl/astraeus/css/properties/Opacity.kt

@@ -1,12 +0,0 @@
-package nl.astraeus.css.properties
-
-class Opacity(
-    value: String
-) : CssProperty(value) {
-
-    companion object {
-        fun initial() = Opacity("initial")
-        fun inherit() = Opacity("inherit")
-    }
-
-}

src/commonMain/kotlin/nl/astraeus/css/properties/Order.kt

@@ -1,12 +0,0 @@
-package nl.astraeus.css.properties
-
-class Order(
-    value: String
-) : CssProperty(value) {
-
-    companion object {
-        fun initial() = Order("initial")
-        fun inherit() = Order("inherit")
-    }
-
-}

src/commonMain/kotlin/nl/astraeus/css/properties/OutlineWidth.kt

@@ -5,10 +5,10 @@ class OutlineWidth(
 ) : CssProperty(value) {
 
     companion object {
-        fun thin() = OutlineWidth("thin")
+        val thin = OutlineWidth("thin")
-        fun medium() = OutlineWidth("medium")
+        val medium = OutlineWidth("medium")
-        fun thick() = OutlineWidth("thick")
+        val thick = OutlineWidth("thick")
-        fun initial() = BorderWidth("initial")
+        val initial = BorderWidth("initial")
-        fun inherit() = BorderWidth("inherit")
+        val inherit = BorderWidth("inherit")
     }
 }

src/commonMain/kotlin/nl/astraeus/css/properties/Overflow.kt

@@ -5,11 +5,11 @@ class Overflow(
 ) : CssProperty(value) {
 
     companion object {
-        fun visible() = Overflow("visible")
+        val visible = Overflow("visible")
-        fun hidden() = Overflow("hidden")
+        val hidden = Overflow("hidden")
-        fun scroll() = Overflow("scroll")
+        val scroll = Overflow("scroll")
-        fun auto() = Overflow("auto")
+        val auto = Overflow("auto")
-        fun initial() = BorderWidth("initial")
+        val initial = BorderWidth("initial")
-        fun inherit() = BorderWidth("inherit")
+        val inherit = BorderWidth("inherit")
     }
 }

src/commonMain/kotlin/nl/astraeus/css/properties/Padding.kt

@@ -1,12 +0,0 @@
-package nl.astraeus.css.properties
-
-class Padding(
-    value: String
-) : CssProperty(value) {
-
-    companion object {
-        fun initial() = Padding("initial")
-        fun inherit() = Padding("inherit")
-    }
-
-}

src/commonMain/kotlin/nl/astraeus/css/properties/PageBreak.kt

@@ -5,13 +5,13 @@ class PageBreak(
 ) : CssProperty(value) {
 
     companion object {
-        fun auto() = PageBreak("auto")
+        val auto = PageBreak("auto")
-        fun always() = PageBreak("always")
+        val always = PageBreak("always")
-        fun avoid() = PageBreak("avoid")
+        val avoid = PageBreak("avoid")
-        fun left() = PageBreak("left")
+        val left = PageBreak("left")
-        fun right() = PageBreak("right")
+        val right = PageBreak("right")
-        fun initial() = PageBreak("initial")
+        val initial = PageBreak("initial")
-        fun inherit() = PageBreak("inherit")
+        val inherit = PageBreak("inherit")
     }
 
 }

src/commonMain/kotlin/nl/astraeus/css/properties/Perspective.kt

@@ -0,0 +1,13 @@
+package nl.astraeus.css.properties
+
+class Perspective(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        val none = Perspective("none")
+        val initial = Perspective("initial")
+        val inherit = Perspective("inherit")
+    }
+
+}

src/commonMain/kotlin/nl/astraeus/css/properties/PointerEvents.kt

@@ -0,0 +1,14 @@
+package nl.astraeus.css.properties
+
+class PointerEvents(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        val auto = PointerEvents("auto")
+        val none = PointerEvents("none")
+        val initial = PointerEvents("initial")
+        val inherit = PointerEvents("inherit")
+    }
+
+}

src/commonMain/kotlin/nl/astraeus/css/properties/Position.kt

@@ -0,0 +1,17 @@
+package nl.astraeus.css.properties
+
+class Position(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        val static = Position("static")
+        val absolute = Position("absolute")
+        val fixed = Position("fixed")
+        val relative = Position("relative")
+        val sticky = Position("sticky")
+        val initial = Position("initial")
+        val inherit = Position("inherit")
+    }
+
+}

src/commonMain/kotlin/nl/astraeus/css/properties/Punctuation.kt

@@ -5,13 +5,13 @@ class HangingPunctuation(
 ) : CssProperty(value) {
 
     companion object {
-        fun none() = HangingPunctuation("none")
+        val none = HangingPunctuation("none")
-        fun first() = HangingPunctuation("first")
+        val first = HangingPunctuation("first")
-        fun last() = HangingPunctuation("last")
+        val last = HangingPunctuation("last")
-        fun allowEnd() = HangingPunctuation("allow-end")
+        val allowEnd = HangingPunctuation("allow-end")
-        fun forceEnd() = HangingPunctuation("force-end")
+        val forceEnd = HangingPunctuation("force-end")
-        fun initial() = HangingPunctuation("initial")
+        val initial = HangingPunctuation("initial")
-        fun inherit() = HangingPunctuation("inherit")
+        val inherit = HangingPunctuation("inherit")
     }
 
 }

src/commonMain/kotlin/nl/astraeus/css/properties/Resize.kt

@@ -0,0 +1,16 @@
+package nl.astraeus.css.properties
+
+class Resize(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        val none = Resize("none")
+        val both = Resize("both")
+        val horizontal = Resize("horizontal")
+        val vertical = Resize("vertical")
+        val initial = Resize("initial")
+        val inherit = Resize("inherit")
+    }
+
+}

src/commonMain/kotlin/nl/astraeus/css/properties/ScrollBehavior.kt

@@ -0,0 +1,14 @@
+package nl.astraeus.css.properties
+
+class ScrollBehavior(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        val auto = ScrollBehavior("auto")
+        val smooth = ScrollBehavior("smooth")
+        val initial = ScrollBehavior("initial")
+        val inherit = ScrollBehavior("inherit")
+    }
+
+}

src/commonMain/kotlin/nl/astraeus/css/properties/Span.kt

@@ -5,10 +5,10 @@ class Span(
 ) : CssProperty(value) {
 
     companion object {
-        fun none() = Clip("none")
+        val none = Clip("none")
-        fun all() = Clip("all")
+        val all = Clip("all")
-        fun initial() = Clip("initial")
+        val initial = Clip("initial")
-        fun inherit() = Clip("inherit")
+        val inherit = Clip("inherit")
     }
 
 }

src/commonMain/kotlin/nl/astraeus/css/properties/TableLayout.kt

@@ -0,0 +1,14 @@
+package nl.astraeus.css.properties
+
+class TableLayout(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        val auto = TableLayout("auto")
+        val fixed = TableLayout("fixed")
+        val initial = TableLayout("initial")
+        val inherit = TableLayout("auto")
+    }
+
+}

src/commonMain/kotlin/nl/astraeus/css/properties/TextAlign.kt

@@ -0,0 +1,16 @@
+package nl.astraeus.css.properties
+
+class TextAlign(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        val left = TextAlign("left")
+        val right = TextAlign("right")
+        val center = TextAlign("center")
+        val justify = TextAlign("justify")
+        val initial = TextAlign("initial")
+        val inherit = TextAlign("inherit")
+    }
+
+}

src/commonMain/kotlin/nl/astraeus/css/properties/TextAlignLast.kt

@@ -0,0 +1,19 @@
+package nl.astraeus.css.properties
+
+class TextAlignLast(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        val auto = TextAlignLast("auto")
+        val left = TextAlignLast("left")
+        val right = TextAlignLast("right")
+        val center = TextAlignLast("center")
+        val justify = TextAlignLast("justify")
+        val start = TextAlignLast("start")
+        val end = TextAlignLast("end")
+        val initial = TextAlignLast("initial")
+        val inherit = TextAlignLast("inherit")
+    }
+
+}

src/commonMain/kotlin/nl/astraeus/css/properties/TextDecorationLine.kt

@@ -0,0 +1,16 @@
+package nl.astraeus.css.properties
+
+class TextDecorationLine(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        val none = TextDecorationLine("none")
+        val underline = TextDecorationLine("underline")
+        val overline = TextDecorationLine("overline")
+        val lineThrough = TextDecorationLine("line-through")
+        val initial = TextDecorationLine("initial")
+        val inherit = TextDecorationLine("inherit")
+    }
+
+}

src/commonMain/kotlin/nl/astraeus/css/properties/TextDecorationStyle.kt

@@ -0,0 +1,17 @@
+package nl.astraeus.css.properties
+
+class TextDecorationStyle(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        val solid = TextDecorationStyle("solid")
+        val double = TextDecorationStyle("double")
+        val dotted = TextDecorationStyle("dotted")
+        val dashed = TextDecorationStyle("dashed")
+        val wavy = TextDecorationStyle("wavy")
+        val initial = TextDecorationStyle("initial")
+        val inherit = TextDecorationStyle("inherit")
+    }
+
+}

src/commonMain/kotlin/nl/astraeus/css/properties/TextJustify.kt

@@ -0,0 +1,16 @@
+package nl.astraeus.css.properties
+
+class TextJustify(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        val auto = TextJustify("auto")
+        val interWord = TextJustify("inter-word")
+        val interCharacter = TextJustify("inter-character")
+        val none = TextJustify("none")
+        val initial = TextJustify("initial")
+        val inherit = TextJustify("inherit")
+    }
+
+}

src/commonMain/kotlin/nl/astraeus/css/properties/TextTransform.kt

@@ -0,0 +1,16 @@
+package nl.astraeus.css.properties
+
+class TextTransform(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        val none = TextTransform("none")
+        val capitalize = TextTransform("capitalize")
+        val uppercase = TextTransform("uppercase")
+        val lowercase = TextTransform("lowercase")
+        val initial = TextTransform("initial")
+        val inherit = TextTransform("inherit")
+    }
+
+}

src/commonMain/kotlin/nl/astraeus/css/properties/TimingFunction.kt

@@ -0,0 +1,22 @@
+package nl.astraeus.css.properties
+
+class TimingFunction(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        val linear = TimingFunction("linear")
+        val ease = TimingFunction("ease")
+        val easeIn = TimingFunction("ease-in")
+        val easeOut = TimingFunction("ease-out")
+        val easeInOut = TimingFunction("ease-in-out")
+        val stepStart = TimingFunction("step-start")
+        val stepEnd = TimingFunction("step-end")
+        val initial = TimingFunction("initial")
+        val inherit = TimingFunction("inherit")
+
+        fun steps(steps: Int, start: Boolean) = TimingFunction("steps($steps, ${if (start) { "start" } else { "end" }}")
+        fun cubicBezier(n1: Double, n2: Double, n3: Double, n4: Double) = TimingFunction("cubic-bezier($n1, $n2, $n3, $n4)")
+    }
+
+}

src/commonMain/kotlin/nl/astraeus/css/properties/Transform.kt

@@ -0,0 +1,49 @@
+package nl.astraeus.css.properties
+
+class Transform(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        val none = Transform("none")
+        val initial = Transform("initial")
+        val inherit = Transform("inherit")
+
+        fun matrix(
+            n1: Double,
+            n2: Double,
+            n3: Double,
+            n4: Double,
+            n5: Double,
+            n6: Double
+        ) = Transform("matrix($n1, $n2, $n3, $n4, $n5, $n6)")
+        fun matrix3d(
+            n01: Double, n02: Double, n03: Double, n04: Double,
+            n05: Double, n06: Double, n07: Double, n08: Double,
+            n09: Double, n10: Double, n11: Double, n12: Double,
+            n13: Double, n14: Double, n15: Double, n16: Double
+        ) = Transform(
+            "matrix3d($n01, $n02, $n03, $n04, $n05, $n06, $n07, $n08, $n09, $n10, $n11, $n12, $n13, $n14, $n15, $n16)"
+        )
+        fun translate(x: Double, y: Double) = Transform("translate($x, $y)")
+        fun translate3d(x: Double, y: Double, z: Double) = Transform("translate3d($x, $y, $z)")
+        fun translateX(x: Double) = Transform("translateX($x)")
+        fun translateY(y: Double) = Transform("translateY($y)")
+        fun translateZ(z: Double) = Transform("translateZ($z)")
+        fun scale(x: Double, y: Double) = Transform("scale($x, $y)")
+        fun scale3d(x: Double, y: Double, z: Double) = Transform("scale3d($x, $y, $z)")
+        fun scaleX(x: Double) = Transform("scaleX($x)")
+        fun scaleY(y: Double) = Transform("scaleY($y)")
+        fun scaleZ(z: Double) = Transform("scaleZ($z)")
+        fun rotate(angle: Double) = Transform("rotate($angle)")
+        fun rotate3d(x: Double, y: Double, z: Double, angle: Double) = Transform("scale3d($x, $y, $z, $angle")
+        fun rotateX(x: Double) = Transform("rotateX($x)")
+        fun rotateY(y: Double) = Transform("rotateY($y)")
+        fun rotateZ(z: Double) = Transform("rotateZ($z)")
+        fun skew(x: Double, y: Double) = Transform("skew($x, $y)")
+        fun skewX(x: Double) = Transform("skew($x)")
+        fun skewY(y: Double) = Transform("skew($y)")
+        fun perspective(length: Measurement) = Transform("perspective(${length.css()})")
+    }
+
+}

src/commonMain/kotlin/nl/astraeus/css/properties/TransformStyle.kt

@@ -0,0 +1,14 @@
+package nl.astraeus.css.properties
+
+class TransformStyle(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        val flat = TransformStyle("flat")
+        val preserve3d = TransformStyle("preserve-3d")
+        val initial = TransformStyle("initial")
+        val inherit = TransformStyle("inherit")
+    }
+
+}

src/commonMain/kotlin/nl/astraeus/css/properties/UnicodeBidi.kt

@@ -0,0 +1,15 @@
+package nl.astraeus.css.properties
+
+class UnicodeBidi(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        val normal = UnicodeBidi("normal")
+        val embed = UnicodeBidi("embed")
+        val bidiOverride = UnicodeBidi("bidi-override")
+        val initial = UnicodeBidi("initial")
+        val inherit = UnicodeBidi("inherit")
+    }
+
+}

src/commonMain/kotlin/nl/astraeus/css/properties/UserSelect.kt

@@ -0,0 +1,14 @@
+package nl.astraeus.css.properties
+
+class UserSelect(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        val auto = UserSelect("auto")
+        val none = UserSelect("none")
+        val text = UserSelect("text")
+        val all = UserSelect("all")
+    }
+
+}

src/commonMain/kotlin/nl/astraeus/css/properties/VerticalAlign.kt

@@ -0,0 +1,20 @@
+package nl.astraeus.css.properties
+
+class VerticalAlign(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        val baseline = VerticalAlign("baseline")
+        val sub = VerticalAlign("sub")
+        val _super = VerticalAlign("super")
+        val top = VerticalAlign("top")
+        val textTop = VerticalAlign("text-top")
+        val middle = VerticalAlign("middle")
+        val bottom = VerticalAlign("bottom")
+        val textBottom = VerticalAlign("text-bottom")
+        val initial = VerticalAlign("initial")
+        val inherit = VerticalAlign("inherit")
+    }
+
+}

src/commonMain/kotlin/nl/astraeus/css/properties/Visibility.kt

@@ -0,0 +1,15 @@
+package nl.astraeus.css.properties
+
+class Visibility(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        val visible = Visibility("visible")
+        val hidden = Visibility("hidden")
+        val collapse = Visibility("collapse")
+        val initial = Visibility("initial")
+        val inherit = Visibility("inherit")
+    }
+
+}

src/commonMain/kotlin/nl/astraeus/css/properties/WhiteSpace.kt

@@ -0,0 +1,17 @@
+package nl.astraeus.css.properties
+
+class WhiteSpace(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        val normal = WhiteSpace("normal")
+        val nowrap = WhiteSpace("nowrap")
+        val pre = WhiteSpace("pre")
+        val preLine = WhiteSpace("pre-line")
+        val preWrap = WhiteSpace("pre-wrap")
+        val initial = WhiteSpace("initial")
+        val inherit = WhiteSpace("inherit")
+    }
+
+}

src/commonMain/kotlin/nl/astraeus/css/properties/WordBreak.kt

@@ -0,0 +1,16 @@
+package nl.astraeus.css.properties
+
+class WordBreak(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        val normal = WordBreak("normal")
+        val breakAll = WordBreak("break-all")
+        val keepAll = WordBreak("keep-all")
+        val breakWord = WordBreak("break-word")
+        val initial = WordBreak("initial")
+        val inherit = WordBreak("inherit")
+    }
+
+}

src/commonMain/kotlin/nl/astraeus/css/properties/WordSpacing.kt

@@ -0,0 +1,13 @@
+package nl.astraeus.css.properties
+
+class WordSpacing(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        val normal = WordSpacing("normal")
+        val initial = WordSpacing("initial")
+        val inherit = WordSpacing("inherit")
+    }
+
+}

src/commonMain/kotlin/nl/astraeus/css/properties/WordWrap.kt

@@ -0,0 +1,14 @@
+package nl.astraeus.css.properties
+
+class WordWrap(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        val normal = WordWrap("normal")
+        val breakWord = WordWrap("break-word")
+        val initial = WordWrap("initial")
+        val inherit = WordWrap("inherit")
+    }
+
+}

src/commonMain/kotlin/nl/astraeus/css/properties/WritingMode.kt

@@ -0,0 +1,13 @@
+package nl.astraeus.css.properties
+
+class WritingMode(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        val horizontalTb = WritingMode("horizontal-tb")
+        val verticalRl = WritingMode("vertical-rl")
+        val verticalLr = WritingMode("vertical-lr")
+    }
+
+}

src/commonMain/kotlin/nl/astraeus/css/properties/ZIndex.kt

@@ -0,0 +1,13 @@
+package nl.astraeus.css.properties
+
+class ZIndex(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        val auto = ZIndex("auto")
+        val initial = ZIndex("initial")
+        val inherit = ZIndex("inherit")
+    }
+
+}

src/commonMain/kotlin/nl/astraeus/css/style/Style.kt

@@ -5,6 +5,8 @@ import nl.astraeus.logging.log
 
 typealias Css = Style.() -> Unit
 
+typealias ConditionalCss = ConditionalStyle.() -> Unit
+
 @DslMarker
 annotation class CssTagMarker
 
@@ -78,6 +80,55 @@ abstract class CssGenerator {
     open fun generateCss(namespace: String = "", indent: String = "", minified: Boolean = false): String {
         val builder = StringBuilder()
 
+        if (this is ConditionalStyle) {
+            this.media.let { mq ->
+                mq.keys.sorted().forEach { mediaName ->
+                    val css = mq[mediaName]
+
+                    indent(minified, builder, indent)
+                    builder.append("@media ")
+                    builder.append(mediaName)
+                    builder.append(" {")
+                    indent(minified, builder, "\n")
+                    css?.let { css ->
+                        val mediaStyle = ConditionalStyle()
+
+                        css(mediaStyle)
+
+                        builder.append(mediaStyle.generateCss("", "  $indent", minified))
+                    }
+
+                    indent(minified, builder, indent)
+                    builder.append("}")
+                    indent(minified, builder, "\n")
+                }
+            }
+
+            this.supports.let { mq ->
+                mq.keys.sorted().forEach { mediaName ->
+                    val css = mq[mediaName]
+
+                    indent(minified, builder, indent)
+                    builder.append("@supports ")
+                    builder.append(mediaName)
+                    builder.append(" {")
+                    indent(minified, builder, "\n")
+                    css?.let { css ->
+                        val mediaStyle = ConditionalStyle()
+
+                        css(mediaStyle)
+
+                        builder.append(mediaStyle.generateCss("","  $indent", minified))
+                    }
+
+                    indent(minified, builder, indent)
+                    builder.append("}")
+                    indent(minified, builder, "\n")
+
+                }
+            }
+        }
+
         for ((name, prop) in definitions) {
             val css = StringBuilder()
 
@@ -85,20 +136,20 @@ abstract class CssGenerator {
 
             prop(finalStyle)
 
-            css.append(finalStyle.generatePropertyCss(indent, minified))
+            css.append(finalStyle.generatePropertyCss("  $indent", minified))
 
             if (css.isNotBlank()) {
                 builder.append("\n$namespace $name".trim())
-                indent(minified, builder, " ")
+                indent(minified, builder, "  $indent")
                 builder.append("{")
                 indent(minified, builder, "\n")
 
                 finalStyle.fontFace?.let { ff ->
-                    indent(minified, builder, indent)
+                    indent(minified, builder, "  $indent")
                     builder.append("@font-face {")
                     indent(minified, builder, "\n")
                     builder.append(ff.generatePropertyCss( "    $indent", minified))
-                    builder.append(indent)
+                    builder.append("  $indent")
                     builder.append("}")
                     indent(minified, builder, "\n")
                 }
@@ -107,10 +158,11 @@ abstract class CssGenerator {
                     kf.keys.sorted().forEach { frameName ->
                         val css = kf[frameName]
 
-                        indent(minified, builder, indent)
+                        indent(minified, builder, "  $indent")
                         builder.append("@keyframes ")
                         builder.append(frameName)
-                        builder.append(" {\n")
+                        builder.append(" {")
+                        indent(minified, builder, "\n")
                         css?.let { css ->
                             for ((nr, style) in css.frames) {
                                 indent(minified, builder, "    $indent")
@@ -126,36 +178,18 @@ abstract class CssGenerator {
                                 builder.append(finalStyle.generatePropertyCss("      $indent", minified))
 
                                 indent(minified, builder, "    $indent")
-                                builder.append("}\n")
+                                builder.append("}")
+                                indent(minified, builder, "\n")
                             }
 
-                            indent(minified, builder, indent)
+                            indent(minified, builder, "  $indent")
-                            builder.append("}\n")
+                            builder.append("}")
+                            indent(minified, builder, "\n")
+
                         }
                     }
                 }
 
-                finalStyle.media.let { mq ->
-                    mq.keys.sorted().forEach { mediaName ->
-                        val css = mq[mediaName]
-
-                        indent(minified, builder, indent)
-                        builder.append("@media ")
-                        builder.append(mediaName)
-                        builder.append(" {\n")
-                        css?.let { css ->
-                            val mediaStyle = Style()
-
-                            css(mediaStyle)
-
-                            builder.append(mediaStyle.generatePropertyCss("  $indent", minified))
-                        }
-
-                        indent(minified, builder, indent)
-                        builder.append("}\n")
-                    }
-                }
-
                 builder.append(css)
                 builder.append("}")
                 indent(minified, builder, "\n\n")
@@ -178,7 +212,7 @@ abstract class CssGenerator {
 open class Style : CssGenerator() {
     var fontFace: FontFace? = null
     var keyFrames: MutableMap<String, KeyFrames> = mutableMapOf()
-    var media: MutableMap<String, Css> = mutableMapOf()
+
     private val validators = mapOf<String, List<Validator>>(
         "background-position" to listOf(InitialInheritSingleValue()),
         "background-size" to listOf(MaxCountValidator(2)),
@@ -199,7 +233,7 @@ open class Style : CssGenerator() {
         definitions[selector] = style
     }
 
-    fun alignContent(value: AlignContentValue) {    props["align-content"] = prp(value)    }
+    fun alignContent(value: AlignContent) {         props["align-content"] = prp(value)    }
     fun alignItems(alignItems: AlignItems) {        props["align-items"] = prp(alignItems) }
     fun all(all: All) {                             props["all"] = prp(all)                }
     fun alignSelf(alignSelf: AlignSelf) {           props["align-self"] = prp(alignSelf)   }
@@ -214,7 +248,7 @@ open class Style : CssGenerator() {
     fun animationPlayState(vararg state : AnimationPlayState) {
         props["animation-play-state"] = prp(*state)
     }
-    fun animationTimingFunction(vararg timingFunction: AnimationTimingFunction) {
+    fun animationTimingFunction(vararg timingFunction: TimingFunction) {
         props["animation-timing-function"] = prp(*timingFunction)
     }
     fun backfaceVisibility(backfaceVisibility: BackfaceVisibility) { props[""] = prp(backfaceVisibility) }
@@ -331,7 +365,7 @@ open class Style : CssGenerator() {
     fun flexGrow(grow: FlexGrowShrink) {            props["flex-grow"] = prp(grow) }
     fun flexShrink(shrink: FlexGrowShrink) {        props["flex-shrink"] = prp(shrink) }
     fun flexWrap(wrap: FlexWrap) {                  props["flex-wrap"] = prp(wrap) }
-    //fun float(float: Float) {                       props["float"] = prp(float) }
+    fun float(cssFloat: CssFloat) {                 props["float"] = prp(cssFloat) }
     fun font(font: String) {                        props["font"] = prp(font) }
     fun fontFace(face: FontFace.() -> Unit) {
         fontFace = FontFace()
@@ -385,7 +419,6 @@ open class Style : CssGenerator() {
 
         keyFrames[animationName] = frameCss
     }
-
     fun left(left: Measurement) {                   props["left"] = prp(left)    }
     fun letterSpacing(length: Measurement) {        props["letter-spacing"] = prp(length) }
     fun letterSpacing(spacing: LetterSpacing) {     props["letter-spacing"] = prp(spacing) }
@@ -410,22 +443,15 @@ open class Style : CssGenerator() {
     fun marginTop(top: Measurement) {               props["margin-top"] = prp(top) }
     fun maxHeight(height: Measurement) {            props["max-height"] = prp(height) }
     fun maxWidth(width: Measurement) {              props["max-width"] = prp(width) }
-    fun media(definition: String, style: Css) {
-        val css = Style()
-
-        style(css)
-
-        media[definition] = style
-    }
     fun minHeight(height: Measurement) {            props["min-height"] = prp(height) }
     fun minWidth(width: Measurement) {              props["min-width"] = prp(width) }
     fun mixBlendMode(blendMode: MixBlendMode) {     props["mix-blend-mode"] = prp(blendMode) }
     fun objectFit(fit: ObjectFit) {                 props["object-fit"] = prp(fit) }
     fun objectPosition(position: String) {          props["object-position"] = prp(position) }
     fun opacity(opacity: Double) {                  props["opacity"] = prp(opacity.toString()) }
-    fun opacity(opacity: Opacity) {                 props["opacity"] = prp(opacity.toString()) }
+    fun opacity(opacity: InitialInherit) {          props["opacity"] = prp(opacity.toString()) }
     fun order(order: Int) {                         props["order"] = prp(order.toString()) }
-    fun order(order: Order) {                       props["order"] = prp(order) }
+    fun order(order: InitialInherit) {              props["order"] = prp(order) }
     fun outline(outline: String) {                  props["outline"] = prp(outline) }
     fun outlineColor(color: Color) {                props["outline-color"] = prp(color) }
     fun outlineOffset(offset: Measurement) {        props["outline-offset"] = prp(offset) }
@@ -436,26 +462,84 @@ open class Style : CssGenerator() {
     fun overflowX(overflow: Overflow) {             props["overflow-x"] = prp(overflow) }
     fun overflowY(overflow: Overflow) {             props["overflow-y"] = prp(overflow) }
     fun padding(padding: Measurement) {             props["padding"] = prp(padding) }
-    fun padding(padding: Padding) {                 props["padding"] = prp(padding) }
+    fun padding(padding: InitialInherit) {          props["padding"] = prp(padding) }
     fun paddingBottom(padding: Measurement) {       props["padding-bottom"] = prp(padding) }
-    fun paddingBottom(padding: Padding) {           props["padding-bottom"] = prp(padding) }
+    fun paddingBottom(padding: InitialInherit) {    props["padding-bottom"] = prp(padding) }
     fun paddingLeft(padding: Measurement) {         props["padding-left"] = prp(padding) }
-    fun paddingLeft(padding: Padding) {             props["padding-left"] = prp(padding) }
+    fun paddingLeft(padding: InitialInherit) {      props["padding-left"] = prp(padding) }
     fun paddingRight(padding: Measurement) {        props["padding-right"] = prp(padding) }
-    fun paddingRight(padding: Padding) {            props["padding-right"] = prp(padding) }
+    fun paddingRight(padding: InitialInherit) {     props["padding-right"] = prp(padding) }
     fun paddingTop(padding: Measurement) {          props["padding-top"] = prp(padding) }
-    fun paddingTop(padding: Padding) {              props["padding-top"] = prp(padding) }
+    fun paddingTop(padding: InitialInherit) {       props["padding-top"] = prp(padding) }
     fun pageBreakAfter(pageBreak: PageBreak) {      props["page-break-after"] = prp(pageBreak) }
     fun pageBreakBefore(pageBreak: PageBreak) {     props["page-break-before"] = prp(pageBreak) }
     fun pageBreakInside(pageBreak: PageBreak) {     props["page-break-inside"] = prp(pageBreak) }
-
+    fun perspective(length: Measurement) {          props["perspective"] = prp(length) }
-
+    fun perspective(perspective: Perspective) {     props["perspective"] = prp(perspective) }
-
+    fun perspectiveOrigin(po: String) {             props["perspective-origin"] = prp(po) }
-
+    fun pointerEvents(pe: PointerEvents) {          props["pointer-events"] = prp(pe) }
-
+    fun position(poition: Position) {               props["position"] = prp(poition) }
-
+    fun quotes(value: String) {                     props["quotes"] = prp(value) }
+    fun resize(resize: Resize) {                    props["resize"] = prp(resize) }
     fun right(right: Measurement) {                 props["right"] = prp(right) }
+    fun scrollBehavior(sb: ScrollBehavior) {        props["scroll-behavior"] = prp(sb) }
+    fun tabSize(number: Int) {                      props["tab-size"] = prp(number.toString()) }
+    fun tabSize(length: Measurement) {              props["tab-size"] = prp(length) }
+    fun tabSize(ts: InitialInherit) {               props["tab-size"] = prp(ts) }
+    fun tableLayout(tl: TableLayout ) {             props["table-layout"] = prp(tl) }
+    fun textAlign(ta: TextAlign) {                  props["text-align"] = prp(ta) }
+    fun textAlignLast(tal: TextAlignLast) {         props["text-align-last"] = prp(tal) }
+    fun textDecoration(decoration: String) {        props["text-decoration"] = prp(decoration) }
+    fun textDecorationColor(color: Color) {         props["text-decoration-color"] = prp(color) }
+    fun textDecorationLine(tdc: TextDecorationLine) { props["text-decoration-line"] = prp(tdc) }
+    fun textDecorationStyle(tds: TextDecorationStyle) { props["text-decoration-style"] = prp(tds) }
+    fun textIndent(length: Measurement) {           props["text-indent"] = prp(length) }
+    fun textIndent(indent: InitialInherit) {        props["text-indent"] = prp(indent) }
+    fun textJustify(tj: TextJustify) {              props["text-justify"] = prp(tj) }
+    fun textOverflow(to: String) {                  props["text-overflow"] = prp(to) }
+    fun textShadow(ts: String) {                    props["text-shadow"] = prp(ts) }
+    fun textTransform(tt: TextTransform) {          props["text-transform"] = prp(tt) }
     fun top(top: Measurement) {                     props["top"] = prp(top) }
+    fun transform(transform: Transform) {           props["transform"] = prp(transform) }
+    fun transformOrigin(origin: String) {           props["transform-origin"] = prp(origin) }
+    fun transformStyle(style: TransformStyle) {     props["transform-style"] = prp(style) }
+    fun transition(transition: String) {            props["transition"] = prp(transition) }
+    fun transitionDelay(timeInSeconds: Double) {    props["transition-delay"] = prp("${timeInSeconds}s") }
+    fun transitionDelay(timeInMillis: Int) {        props["transition-delay"] = prp("${timeInMillis}ms") }
+    fun transitionDelay(delay: DelayDuration) {     props["transition-delay"] = prp(delay) }
+    fun transitionDuration(timeInSeconds: Double) { props["transition-duration"] = prp("${timeInSeconds}s") }
+    fun transitionDuration(timeInMillis: Int) {     props["transition-duration"] = prp("${timeInMillis}ms") }
+    fun transitionDuration(td: DelayDuration) {     props["transition-duration"] = prp(td) }
+    fun transitionProperty(property: String) {      props["transition-property"] = prp(property) }
+    fun transitionTimingFunction(function: TimingFunction) { props["transition-timing-function"] = prp(function) }
+    fun unicodeBidi(ub: UnicodeBidi) {              props["unicode-bidi"] = prp(ub) }
+    fun userSelect(us: UserSelect) {                props["user-select"] = prp(us) }
+    fun verticalAlign(length: Measurement) {        props["vertical-align"] = prp(length) }
+    fun verticalAlign(va: VerticalAlign) {          props["vertical-align"] = prp(va) }
+    fun visibility(visibility: Visibility) {        props["visibility"] = prp(visibility) }
+    fun whiteSpace(whiteSpace: WhiteSpace) {        props["white-space"] = prp(whiteSpace) }
     fun width(width: Measurement) {                 props["width"] = prp(width) }
+    fun wordBreak(wordBreak: WordBreak) {           props["word-break"] = prp(wordBreak) }
+    fun wordSpacing(wordSpacing: Measurement) {     props["word-spacing"] = prp(wordSpacing) }
+    fun wordSpacing(wordSpacing: WordSpacing) {     props["word-spacing"] = prp(wordSpacing) }
+    fun wordWrap(wordWrap: WordWrap) {              props["word-wrap"] = prp(wordWrap) }
+    fun writingMode(writingMode: WritingMode) {     props["writing-mode"] = prp(writingMode) }
+    fun zIndex(zIndex: Int) {                       props["z-index"] = prp(zIndex.toString()) }
+    fun zIndex(zIndex: ZIndex) {                    props["z-index"] = prp(zIndex) }
+
+}
+
+@CssTagMarker
+open class ConditionalStyle : Style() {
+    var media: MutableMap<String, ConditionalCss> = mutableMapOf()
+    var supports: MutableMap<String, ConditionalCss> = mutableMapOf()
+
+    fun media(definition: String, style: ConditionalCss) {
+        media[definition] = style
+    }
+
+    fun supports(query: String, style: ConditionalCss) {
+        supports[query] = style
+    }
 
 }

src/jsMain/kotlin/nl/astraeus/css/Test.kt

@@ -52,7 +52,7 @@ private fun generateCss(
             }
             select("li") {
                 sizePX(25, 25, 200, 200)
-                animationPlayState(AnimationPlayState.paused(), AnimationPlayState.running())
+                animationPlayState(AnimationPlayState.paused, AnimationPlayState.running)
 
                 select("a") {
 //                    width = px(725)
@@ -80,12 +80,16 @@ fun main() {
     val sd = style {
         select("#pipo") {
             backgroundColor(hex("ffeedd"))
-            `fontFamily`("Arial, Courier")
+            fontFamily("Arial, Courier")
 //            backgroundColor = Color.hex("eeeeee")
 //            fontFamily = text("Arial, Courier")
 //            animationDelay = listOf(DelayDuration.initial())
 
             select("div") {
+
+                tableLayout(TableLayout.auto)
+                tabSize(14.px())
+
 //                color = Color.hex("1b1b1b1")
 //                alignContent = AlignContent.flexStart()
 //                animationName = listOf(text("foo"), text("bar"))

src/jsMain/resources/index.html

@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>kotlin-css-generator</title>
+</head>
+<body>
+<script type="text/javascript" src="kotlin-css-generator.js"></script>
+</body>
+</html>

src/jvmMain/kotlin/nl/astraeus/css/Test.kt

@@ -1,7 +1,6 @@
 package nl.astraeus.css
 
 import nl.astraeus.css.properties.*
-import nl.astraeus.css.properties.AlignContentValue.*
 import nl.astraeus.css.properties.Color.Companion.hex
 import nl.astraeus.css.style.Css
 import nl.astraeus.css.style.Style
@@ -98,6 +97,17 @@ fun main() {
     }
 
     val sd = style {
+        media("screen and (max-width: 600px)") {
+            fontSize(12.px())
+            fontWeight(FontWeight.normal)
+
+            supports("bla") {
+                media("bloe") {
+                    fontSize(14.px())
+                }
+            }
+        }
+
         select("#pipo") {
             backgroundColor(hex("eeeeee"))
             fontFamily("Arial, Courier")
@@ -106,7 +116,7 @@ fun main() {
             select("div") {
                 fontFace {
                     fontFamily("SanSation")
-                    fontSize(FontSize.larger())
+                    fontSize(FontSize.larger)
                     src("font/sansation_bold.woff")
 //                    fontStretch = FontStretch.condensed()
 //                    fontStyle = FontStyle.italic()
@@ -123,8 +133,8 @@ fun main() {
 //                    text("bar")
 //                )
                 select("span") {
-                    alignItems(AlignItems.BASELINE)
+                    alignItems(AlignItems.baseline)
-                    alignSelf(AlignSelf.FLEX_START)
+                    alignSelf(AlignSelf.flexStart)
 
 //                    animationIterationCount = listOf(
 //                        Count.count(3),
@@ -146,8 +156,8 @@ fun main() {
                 select("border-2") {
 //                    borderRadius = BorderRadius(4, 5, 6, 7)
                     import(border2)
-                    borderStyle(BorderStyle.dashed(), BorderStyle.dotted())
+                    borderStyle(BorderStyle.dashed, BorderStyle.dotted)
-                    animationPlayState(AnimationPlayState.paused(), AnimationPlayState.running())
+                    animationPlayState(AnimationPlayState.paused, AnimationPlayState.running)
 
                     keyFrames("mymove") {
                         percentage(0) {
@@ -177,13 +187,11 @@ fun main() {
                         }
                     }
 
-                    media("(max-width: 600px)") {
+                    objectFit(ObjectFit.initial)
-                        fontSize(12.px())
+                    pageBreakAfter(PageBreak.auto)
-                        fontWeight(FontWeight.normal())
-                    }
 
-                    objectFit(ObjectFit.initial())
+                    tableLayout(TableLayout.auto)
-                    pageBreakAfter(PageBreak.auto())
+                    tabSize(12.px())
 
 //                    display = Display.none()
 //                    borderBottomWidth = BorderWidth.perc(13)
@@ -205,8 +213,8 @@ fun main() {
 
     val test = style {
         select("nav") {
-            alignContent(STRETCH)
+            alignContent(AlignContent.stretch)
-            margin(0.px(), 2.em(), 0.5.px(), Measurement.auto())
+            margin(0.px(), 2.em(), 0.5.px(), Measurement.auto)
         }
     }