BorderContext

@ExperimentalCoroutinesApi()
class BorderContext(widthKey: String, styleKey: String, colorKey: String, styleParams: StyleParams, target: StringBuilder) : StyleParams

This context class enables the definition of the common border styling properties like width, style and color.

This context is passed as receiver either by Border.border functions for setting the properties for all sides at once or by BordersContext functions for defining each side independently. Called by the latter this context acts as a nested context.

The definable properties for the direct usage by Border.border correspond to the border-width, border-style and border-color CSS properties.

This usage enables border styling like this:

border { /* it == BorderContext.() -> Unit */
width { thin }
style { dashed }
color { dark }
}

Used within the nested context those three properties correspond to the `border-{side}-{type}` properties, where `type` is one of `width`, `style` or `color` and `side` is one of `top`, `right`, `bottom` or `left`.

This usage enables border styling for each side like this:

borders { it == /* BordersContext.() -> Unit - with plural "s"! */
top { it == /* BorderContext.() -> Unit */
width { thin }
style { dashed }
color { dark }
},
bottom {
// some properties
},
// ... define the rest with ``right`` and ``left``
}

Parameters

colorKey

the CSS-property for the color

styleKey

the CSS-property for the style

styleParams

basic context scope interface

target

the defined output StringBuilder to write the generated CSS into

widthKey

the CSS-property for the width

Constructors

BorderContext
Link copied to clipboard
js
fun BorderContext(widthKey: String, styleKey: String, colorKey: String, styleParams: StyleParams, target: StringBuilder)
the CSS-property for the width

Functions

color
Link copied to clipboard
js
fun color(value: Colors.() -> Property)
This function is used to set the color of a border for the border-color property or the individual side color property according to the passed BorderContext.colorKey value like `border-{side}-color`.
equals
Link copied to clipboard
js
open operator fun equals(other: Any?): Boolean
hashCode
Link copied to clipboard
js
open fun hashCode(): Int
style
Link copied to clipboard
js
fun style(value: BorderStyleValues.() -> BorderStyleProperty)
This function is used to set the style of a border for the border-style property or the individual side style property according to the passed BorderContext.styleKey value like `border-{side}-style`.
toString
Link copied to clipboard
js
open fun toString(): String
width
Link copied to clipboard
js
fun width(value: Thickness.() -> Property)
This function is used to set the width of a border for the border-width property or the individual side width property according to the passed BorderContext.widthKey value like `border-{side}-width`.

Properties

lgProperties
Link copied to clipboard
js
open override val lgProperties: StringBuilder
collects the properties for large screens
mdProperties
Link copied to clipboard
js
open override val mdProperties: StringBuilder
collects the properties for middle-sized screens
smProperties
Link copied to clipboard
js
open override val smProperties: StringBuilder
collects the properties for small screens
styleParams
Link copied to clipboard
js
val styleParams: StyleParams
basic context scope interface
xlProperties
Link copied to clipboard
js
open override val xlProperties: StringBuilder
collects the properties for extra-large screens