Browse Source

Minimal support for background in CSS API

CSS_BASIC_PROPS
Shagen Ogandzhanian 3 years ago
parent
commit
2033c73377
  1. 6
      web/core/src/jsMain/kotlin/androidx/compose/web/css/properties/background.kt
  2. 20
      web/core/src/jsTest/kotlin/css/CSSBackgroundTests.kt

6
web/core/src/jsMain/kotlin/androidx/compose/web/css/properties/background.kt

@ -48,3 +48,9 @@ fun StyleBuilder.backgroundSize(value: String) {
}
// https://developer.mozilla.org/en-US/docs/Web/CSS/background
fun StyleBuilder.background(value: String) {
property("background", value)
}

20
web/core/src/jsTest/kotlin/css/CSSBackgroundTests.kt

@ -167,4 +167,24 @@ class CSSBackgroundTests {
assertEquals("auto 50px", window.getComputedStyle(root.children[3] as HTMLElement).backgroundSize)
}
@Test
fun background() = runTest {
composition {
Div({style {
background("green")
}})
Div({style {
background("content-box radial-gradient(crimson, skyblue)")
}})
Div({style {
background("no-repeat url(\"../../media/examples/lizard.png\")")
}})
}
assertEquals("rgb(0, 128, 0)", window.getComputedStyle(root.children[0] as HTMLElement).backgroundColor)
assertEquals("content-box", window.getComputedStyle(root.children[1] as HTMLElement).backgroundOrigin)
assertEquals("radial-gradient(rgb(220, 20, 60), rgb(135, 206, 235))", window.getComputedStyle(root.children[1] as HTMLElement).backgroundImage)
assertEquals("no-repeat", window.getComputedStyle(root.children[2] as HTMLElement).backgroundRepeat)
}
}
Loading…
Cancel
Save