RadiiContext

@ExperimentalCoroutinesApi()
class RadiiContext(styleParams: StyleParams, target: StringBuilder) : StyleParams

This context class is used to provide a scope for styling the four radii of a border independently.

It offers the four functions topLeft, topRight, bottomRight and bottomLeft to set the radius property for each corner independently. There are also convenience functions to handle the radii of one side at once, like right and left or top and bottom. Those are most useful for pairwise usage of course.

The theme offers predefined values as ScaledValueProperty via its dev.fritz2.styling.theme.Theme.radii property.

This usage enables border styling for each side like this:

radii { /* it == RadiiContext.() -> Property */
topLeft { small } // predefined values only for _circles_!
topRight { small }
bottomRight { big }
bottomLeft { "1em 2em" } // provide a custom property for _ellipsis_
}
// or with a pair of convenience functions:
radii {
top { small }
bottom { large }
}

Parameters

styleParams

basic context scope interface

target

the defined output StringBuilder to write the generated CSS into

Constructors

RadiiContext
Link copied to clipboard
fun RadiiContext(styleParams: StyleParams, target: StringBuilder)
basic context scope interface

Functions

bottom
Link copied to clipboard
fun bottom(value: ScaledValueProperty)
This convenience function enables the definition of the border radius for the bottom left and bottom right corners of a block at once via the border-bottom-left-radius and border-bottom-right-radius CSS properties.
bottomLeft
Link copied to clipboard
fun bottomLeft(value: ScaledValueProperty)
This function enables the definition of the border radius for the bottom left corner of a block via the border-bottom-left-radius CSS property.
bottomRight
Link copied to clipboard
fun bottomRight(value: ScaledValueProperty)
This function enables the definition of the border radius for the bottom right corner of a block via the border-bottom-right-radius CSS property.
left
Link copied to clipboard
fun left(value: ScaledValueProperty)
This convenience function enables the definition of the border radius for the top left and bottom left corners of a block at once via the border-top-left-radius and border-bottom-left-radius CSS properties.
right
Link copied to clipboard
fun right(value: ScaledValueProperty)
This convenience function enables the definition of the border radius for the top right and bottom right corners of a block at once via the border-top-right-radius and border-bottom-right-radius CSS properties.
top
Link copied to clipboard
fun top(value: ScaledValueProperty)
This convenience function enables the definition of the border radius for the top left and top right corners of a block at once via the border-top-left-radius and border-top-right-radius CSS properties.
topLeft
Link copied to clipboard
fun topLeft(value: ScaledValueProperty)
This function enables the definition of the border radius for the top left corner of a block via the border-top-left-radius CSS property.
topRight
Link copied to clipboard
fun topRight(value: ScaledValueProperty)
This function enables the definition of the border radius for the top right corner of a block via the border-top-right-radius CSS property.

Properties

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