More properties

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

@@ -18,23 +18,23 @@ class BorderRadius(
     }
 }
 
-class RuleBorderStyle(
+class BorderStyle(
     value: String
 ): CssProperty(value) {
 
     companion object {
-        fun none() = RuleBorderStyle("none")
+        fun none() = BorderStyle("none")
-        fun hidden() = RuleBorderStyle("hidden")
+        fun hidden() = BorderStyle("hidden")
-        fun dotted() = RuleBorderStyle("dotted")
+        fun dotted() = BorderStyle("dotted")
-        fun dashed() = RuleBorderStyle("dashed")
+        fun dashed() = BorderStyle("dashed")
-        fun solid() = RuleBorderStyle("solid")
+        fun solid() = BorderStyle("solid")
-        fun double() = RuleBorderStyle("double")
+        fun double() = BorderStyle("double")
-        fun groove() = RuleBorderStyle("groove")
+        fun groove() = BorderStyle("groove")
-        fun ridge() = RuleBorderStyle("ridge")
+        fun ridge() = BorderStyle("ridge")
-        fun inset() = RuleBorderStyle("inset")
+        fun inset() = BorderStyle("inset")
-        fun outset() = RuleBorderStyle("outset")
+        fun outset() = BorderStyle("outset")
-        fun initial() = RuleBorderStyle("initial")
+        fun initial() = BorderStyle("initial")
-        fun inherit() = RuleBorderStyle("inherit")
+        fun inherit() = BorderStyle("inherit")
     }
 }
 
@@ -46,17 +46,6 @@ class BorderWidth(
         fun thin() = BorderWidth("thin")
         fun medium() = BorderWidth("medium")
         fun thick() = BorderWidth("thick")
-
-        fun px(nr: Int) = BorderWidth("${nr}px")
-        fun em(nr: Int) = BorderWidth("${nr}em")
-        fun em(nr: Double) = BorderWidth("${nr}em")
-        fun perc(nr: Int) = BorderWidth("${nr}%")
-        fun perc(nr: Double) = BorderWidth("${nr}%")
-        fun pc(nr: Int) = BorderWidth("${nr}pc")
-        fun pc(nr: Double) = BorderWidth("${nr}pc")
-        fun cm(nr: Int) = BorderWidth("${nr}cm")
-        fun cm(nr: Double) = BorderWidth("${nr}cm")
-
         fun initial() = BorderWidth("initial")
         fun inherit() = BorderWidth("inherit")
     }

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

@@ -1,5 +1,9 @@
 package nl.astraeus.css.properties
 
+interface CssValue {
+    fun css(): String
+}
+
 open class CssProperty(
     val value: String
 ): CssValue {
@@ -13,7 +17,3 @@ fun text(value: String) = TextProperty(value)
 class TextProperty(
     value: String
 ): CssProperty(value)
-
-interface CssValue {
-    fun css(): String
-}

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

@@ -0,0 +1,48 @@
+package nl.astraeus.css.properties
+
+
+class ListStylePosition(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        fun inside() = ListStylePosition("inside")
+        fun outside() = ListStylePosition("outside")
+        fun initial() = ListStylePosition("initial")
+        fun inherit() = ListStylePosition("inherit")
+    }
+
+}
+
+class ListStyleType(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        fun disc() = ListStyleType("disc")
+        fun armenian() = ListStyleType("armenian")
+        fun circle() = ListStyleType("circle")
+        fun cjkIdeographic() = ListStyleType("cjk-ideographic")
+        fun decimal() = ListStyleType("decimal")
+        fun decimalLeadingZero() = ListStyleType("decimal-leading-zero")
+        fun georgian() = ListStyleType("georgian")
+        fun hebrew() = ListStyleType("hebrew")
+        fun hiragana() = ListStyleType("hiragana")
+        fun hiraganaIroha() = ListStyleType("hiragana-iroha")
+        fun katakana() = ListStyleType("katakana")
+        fun katakanaIroha() = ListStyleType("katakana-iroha")
+        fun lowerAlpha() = ListStyleType("lower-alpha")
+        fun lowerGreek() = ListStyleType("lower-greek")
+        fun lowerLatin() = ListStyleType("lower-latin")
+        fun lowerRoman() = ListStyleType("lower-roman")
+        fun none() = ListStyleType("none")
+        fun square() = ListStyleType("square")
+        fun upperAlpha() = ListStyleType("upper-alpha")
+        fun upperGreek() = ListStyleType("upper-greek")
+        fun upperLatin() = ListStyleType("upper-latin")
+        fun upperRoman() = ListStyleType("upper-roman")
+        fun initial() = ListStyleType("initial")
+        fun inherit() = ListStyleType("inherit")
+    }
+
+}

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

@@ -0,0 +1,25 @@
+package nl.astraeus.css.properties
+
+
+class MixBlendMode(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        fun normal() = MixBlendMode("normal")
+        fun multiply() = MixBlendMode("multiply")
+        fun screen() = MixBlendMode("screen")
+        fun overlay() = MixBlendMode("overlay")
+        fun darken() = MixBlendMode("darken")
+        fun lighten() = MixBlendMode("lighten")
+        fun colorDodge() = MixBlendMode("color-dodge")
+        fun colorBurn() = MixBlendMode("color-burn")
+        fun difference() = MixBlendMode("difference")
+        fun exclusion() = MixBlendMode("exclusion")
+        fun hue() = MixBlendMode("hue")
+        fun saturation() = MixBlendMode("saturation")
+        fun color() = MixBlendMode("color")
+        fun luminosity() = MixBlendMode("luminosity")
+    }
+
+}

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

@@ -0,0 +1,17 @@
+package nl.astraeus.css.properties
+
+class ObjectFit(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        fun fill() = ObjectFit("fill")
+        fun contain() = ObjectFit("contain")
+        fun cover() = ObjectFit("cover")
+        fun scaleDown() = ObjectFit("scale-down")
+        fun none() = ObjectFit("none")
+        fun initial() = ObjectFit("initial")
+        fun inherit() = ObjectFit("inherit")
+    }
+
+}

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

@@ -0,0 +1,12 @@
+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

@@ -0,0 +1,12 @@
+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

@@ -0,0 +1,14 @@
+package nl.astraeus.css.properties
+
+class OutlineWidth(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        fun thin() = OutlineWidth("thin")
+        fun medium() = OutlineWidth("medium")
+        fun thick() = OutlineWidth("thick")
+        fun initial() = BorderWidth("initial")
+        fun inherit() = BorderWidth("inherit")
+    }
+}

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

@@ -0,0 +1,15 @@
+package nl.astraeus.css.properties
+
+class Overflow(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        fun visible() = Overflow("visible")
+        fun hidden() = Overflow("hidden")
+        fun scroll() = Overflow("scroll")
+        fun auto() = Overflow("auto")
+        fun initial() = BorderWidth("initial")
+        fun inherit() = BorderWidth("inherit")
+    }
+}

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

@@ -0,0 +1,12 @@
+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

@@ -0,0 +1,17 @@
+package nl.astraeus.css.properties
+
+class PageBreak(
+    value: String
+) : CssProperty(value) {
+
+    companion object {
+        fun auto() = PageBreak("auto")
+        fun always() = PageBreak("always")
+        fun avoid() = PageBreak("avoid")
+        fun left() = PageBreak("left")
+        fun right() = PageBreak("right")
+        fun initial() = PageBreak("initial")
+        fun inherit() = PageBreak("inherit")
+    }
+
+}

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

@@ -6,7 +6,9 @@ open class KeyFrames : CssGenerator() {
 
     override fun getValidator(name: String): List<Validator>? = listOf()
 
-    fun percentage(percentage: Int, style: Css) { val css = Style()
+    fun percentage(percentage: Int, style: Css) {
+        val css = Style()
+
         style(css)
 
         frames[percentage] = style

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

@@ -133,7 +133,27 @@ abstract class CssGenerator {
                             builder.append("}\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)
@@ -158,6 +178,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)),
@@ -212,8 +233,9 @@ open class Style : CssGenerator() {
     fun borderBottomColor(color: Color) {           props["border-bottom-color"] = prp(color) }
     fun borderBottomLeftRadius(vararg radius: BorderRadius) { props["border-bottom-left-radius"] = prp(*radius) }
     fun borderBottomRightRadius(vararg radius: BorderRadius) { props["border-bottom-right-radius"] = prp(*radius) }
-    fun borderBottomStyle(style: RuleBorderStyle) { props["border-bottom-style"] = prp(style) }
+    fun borderBottomStyle(style: BorderStyle) { props["border-bottom-style"] = prp(style) }
     fun borderBottomWidth(width: BorderWidth) { props["border-bottom-width"] = prp(width) }
+    fun borderBottomWidth(width: Measurement) { props["border-bottom-width"] = prp(width) }
     fun borderCollapse(collapse: BorderCollapse) { props["border-collapse"] = prp(collapse) }
     fun borderColor(vararg color: Color) { props["border-color"] = prp(*color) }
     fun borderImage(image: String) { props["border-image"] = prp(image) }
@@ -224,8 +246,9 @@ open class Style : CssGenerator() {
     fun borderImageWidth(vararg width: BorderImageWidth) { props["border-image-width"] = prp(*width) }
     fun borderLeft(left: String) { props["border-left"] = prp(left) }
     fun borderLeftColor(color: Color) { props["border-left-color"] = prp(color) }
-    fun borderLeftStyle(style: RuleBorderStyle) { props["border-left-style"] = prp(style) }
+    fun borderLeftStyle(style: BorderStyle) { props["border-left-style"] = prp(style) }
     fun borderLeftWidth(width: BorderWidth) { props["border-left-width"] = prp(width) }
+    fun borderLeftWidth(width: Measurement) { props["border-left-width"] = prp(width) }
     fun borderRadius(radius: Measurement) {         props["border-radius"] = prp(radius)                      }
     fun borderRadius(
         topLeftBottomRight: Measurement,
@@ -258,16 +281,18 @@ open class Style : CssGenerator() {
     }
     fun borderRight(border: String) { props["border-right"] = prp(border) }
     fun borderRightColor(color: Color) { props["border-right-color"] = prp(color) }
-    fun borderRightStyle(style: RuleBorderStyle) { props["border-right-style"] = prp(style) }
+    fun borderRightStyle(style: BorderStyle) { props["border-right-style"] = prp(style) }
     fun borderRightWidth(width: BorderWidth) { props["border-right-width"] = prp(width) }
+    fun borderRightWidth(width: Measurement) { props["border-right-width"] = prp(width) }
     fun borderSpacing(vararg spacing: BorderSpacing) { props["border-spacing"] = prp(*spacing) }
-    fun borderStyle(vararg style: RuleBorderStyle) { props["border-style"] = prp(*style) }
+    fun borderStyle(vararg style: BorderStyle) { props["border-style"] = prp(*style) }
     fun borderTop(border: String) { props["border-top"] = prp(border) }
     fun borderTopColor(color: Color) { props["border-top-color"] = prp(color) }
     fun borderTopLeftRadius(radius: BorderRadius) { props["border-top-left-radius"] = prp(radius) }
     fun borderTopRightRadius(radius: BorderRadius) { props["border-top-right-radius"] = prp(radius) }
-    fun borderTopStyle(style: RuleBorderStyle) { props["border-top-style"] = prp(style) }
+    fun borderTopStyle(style: BorderStyle) { props["border-top-style"] = prp(style) }
     fun borderTopWidth(width: BorderWidth) { props["border-top-width"] = prp(width) }
+    fun borderTopWidth(width: Measurement) { props["border-top-width"] = prp(width) }
     fun bottom(measurement: Measurement) {          props["bottom"] = prp(measurement) }
     fun boxDecorationBreak(brk: BoxDecorationBreak) { props["box-decoration-break"] = prp(brk) }
     fun boxShaduw(shadow: BoxShadow) {              props["box-shaduw"] = prp(shadow) }
@@ -286,7 +311,7 @@ open class Style : CssGenerator() {
     fun columnGap(gap: Measurement) {               props["column-gap"] = prp(gap) }
     fun columnRule(rule: String) {                  props["column-rule"] = prp(rule) }
     fun columnRuleColor(color: Color) {             props["column-rule-color"] = prp(color) }
-    fun columnRuleStyle(style: RuleBorderStyle) {   props["column-rule-style"] = prp(style) }
+    fun columnRuleStyle(style: BorderStyle) {   props["column-rule-style"] = prp(style) }
     fun columnRuleWidth(width: Measurement) {       props["column-rule-width"] = prp(width) }
     fun columnSpan(span: Span) {                    props["column-span"] = prp(span) }
     fun columnWidth(width: Measurement) {           props["column-width"] = prp(width) }
@@ -317,6 +342,7 @@ open class Style : CssGenerator() {
     fun fontFeatureSettings(vararg setting: String) { props["font-feature-settings"] = prp(*setting) }
     fun fontKerning(kerning: FontKerning) {         props["font-kerking"] = prp(kerning) }
     fun fontSize(size: FontSize) {                  props["font-size"] = prp(size)    }
+    fun fontSize(size: Measurement) {               props["font-size"] = prp(size)    }
     fun fontSizeAdjust(number: Double) {            props["font-size-adjust"] = prp(CssProperty("$number")) }
     fun fontSizeAdjust(adjust: FontSizeAdjust) {    props["font-size-adjust"] = prp(adjust) }
     fun fontStretch(stretch: FontStretch) {         props["font-stretch"] = prp(stretch) }
@@ -366,6 +392,10 @@ open class Style : CssGenerator() {
     fun lineHeight(number: Double) {                props["letter-spacing"] = prp("$number") }
     fun lineHeight(measurement: Measurement) {      props["line-height"] = prp(measurement) }
     fun lineHeight(height: LineHeight) {            props["line-height"] = prp(height) }
+    fun listStyle(style: String) {                  props["list-style"] = prp(style) }
+    fun listStyleImage(url: String) {               props["list-style-image"] = prp("url('$url')")}
+    fun listStylePosition(position: ListStylePosition) { props["list-style-position"] = prp(position) }
+    fun listStyleType(position: ListStyleType) {    props["list-style-type"] = prp(position) }
     fun margin(all: Measurement) {                  props["margin"] = prp(all)    }
     fun margin(
         topBottom: Measurement,
@@ -374,6 +404,56 @@ open class Style : CssGenerator() {
     fun margin(top: Measurement, right: Measurement, bottom: Measurement, left: Measurement) {
         props["margin"] = prp(top, right, bottom, left)
     }
+    fun marginBottom(bottom: Measurement) {         props["margin-bottom"] = prp(bottom) }
+    fun marginLeft(left: Measurement) {             props["margin-left"] = prp(left) }
+    fun marginRight(right: Measurement) {           props["margin-right"] = prp(right) }
+    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 order(order: Int) {                         props["order"] = prp(order.toString()) }
+    fun order(order: Order) {                       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) }
+    fun outlineStyle(style: BorderStyle) {          props["outline-style"] = prp(style) }
+    fun outlineWidth(width: OutlineWidth) {         props["outline-width"] = prp(width) }
+    fun outlineWidth(width: Measurement) {          props["outline-width"] = prp(width) }
+    fun overflow(overflow: Overflow) {              props["overflow"] = prp(overflow) }
+    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 paddingBottom(padding: Measurement) {       props["padding-bottom"] = prp(padding) }
+    fun paddingBottom(padding: Padding) {           props["padding-bottom"] = prp(padding) }
+    fun paddingLeft(padding: Measurement) {         props["padding-left"] = prp(padding) }
+    fun paddingLeft(padding: Padding) {             props["padding-left"] = prp(padding) }
+    fun paddingRight(padding: Measurement) {        props["padding-right"] = prp(padding) }
+    fun paddingRight(padding: Padding) {            props["padding-right"] = prp(padding) }
+    fun paddingTop(padding: Measurement) {          props["padding-top"] = prp(padding) }
+    fun paddingTop(padding: Padding) {              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 right(right: Measurement) {                 props["right"] = prp(right)    }
     fun top(top: Measurement) {                     props["top"] = prp(top)    }
     fun width(width: Measurement) {                 props["width"] = prp(width)    }

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

@@ -146,7 +146,7 @@ fun main() {
                 select("border-2") {
 //                    borderRadius = BorderRadius(4, 5, 6, 7)
                     import(border2)
-                    borderStyle(RuleBorderStyle.dashed(), RuleBorderStyle.dotted())
+                    borderStyle(BorderStyle.dashed(), BorderStyle.dotted())
                     animationPlayState(AnimationPlayState.paused(), AnimationPlayState.running())
 
                     keyFrames("mymove") {
@@ -177,6 +177,14 @@ fun main() {
                         }
                     }
 
+                    media("(max-width: 600px)") {
+                        fontSize(12.px())
+                        fontWeight(FontWeight.normal())
+                    }
+
+                    objectFit(ObjectFit.initial())
+                    pageBreakAfter(PageBreak.auto())
+
 //                    display = Display.none()
 //                    borderBottomWidth = BorderWidth.perc(13)
                 }