Browse Source

Update web tutorials for 0.5.0-build228 (#833)

Co-authored-by: Oleksandr Karpovich <oleksandr.karpovich@jetbrains.com>
pull/835/head v0.5.0-build228-web
Oleksandr Karpovich 3 years ago committed by GitHub
parent
commit
e40f7a0d9a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
  1. 2
      templates/web-template/build.gradle.kts
  2. 29
      tutorials/Web/Building_UI/README.md
  3. 10
      tutorials/Web/Events_Handling/README.md
  4. 2
      tutorials/Web/Getting_Started/README.md
  5. 2
      web/gradle.properties

2
templates/web-template/build.gradle.kts

@ -5,7 +5,7 @@ plugins {
// __KOTLIN_COMPOSE_VERSION__
kotlin("multiplatform") version "1.5.10"
// __LATEST_COMPOSE_RELEASE_VERSION__
id("org.jetbrains.compose") version ("0.5.0-build226")
id("org.jetbrains.compose") version ("0.5.0-build228")
}
repositories {

29
tutorials/Web/Building_UI/README.md

@ -26,9 +26,9 @@ Let's have a look at the Composable for a `Div` tag (most other tags have the sa
Div(
attrs = {
// specify attributes here
},
style = {
// specify inline style here
style {
// specify inline style here
}
}
) {
// div content goes here
@ -40,9 +40,7 @@ For convenience, some tags like `Input`, `A`, `Form`, or `Img` allow you to spec
``` kotlin
Input(
type = InputType.Text, // All InputTypes supported
value = "", // sets the input value
attrs = {},
style = {}
attrs = {}
)
```
@ -64,7 +62,7 @@ If you want to apply styles to text, it needs to be wrapped in a container with
``` kotlin
Span(
style = { color("red") } // inline style
attrs = { style { color("red") } } // inline style
) {
Text("Red text")
}
@ -160,12 +158,14 @@ You can declare inline styles via the `style` block of a component:
``` kotlin
Div(
style = {
display(DisplayStyle.Flex)
padding(20.px)
// custom property
property("font-family", "Arial, Helvetica, sans-serif")
attrs = {
style {
display(DisplayStyle.Flex)
padding(20.px)
// custom property
property("font-family", "Arial, Helvetica, sans-serif")
}
}
) { /* content goes here */ }
```
@ -196,12 +196,9 @@ fun main() {
Input(
type = InputType.Text, // All InputTypes supported
value = "", // sets the input value
attrs = {}
)
Input(attrs = { type(InputType.Text) })
Text("Arbitrary text")
Span({

10
tutorials/Web/Events_Handling/README.md

@ -27,9 +27,8 @@ val text = remember { mutableStateOf("") }
TextArea(
value = text.value,
attrs = {
onTextInput { wrappedTextInputEvent ->
// wrappedTextInputEvent is of `WrappedTextInputEvent` type
text.value = wrappedTextInputEvent.inputValue
onInput {
text.value = it.value
}
}
)
@ -84,9 +83,8 @@ fun main() {
TextArea(
value = text.value,
attrs = {
onTextInput { wrappedTextInputEvent ->
// wrappedTextInputEvent is of `WrappedTextInputEvent` type
text.value = wrappedTextInputEvent.inputValue
onInput {
text.value = it.value
}
}
)

2
tutorials/Web/Getting_Started/README.md

@ -43,7 +43,7 @@ pluginManagement {
// Add compose gradle plugin
plugins {
kotlin("multiplatform") version "1.5.10"
id("org.jetbrains.compose") version "0.5.0-build226"
id("org.jetbrains.compose") version "0.5.0-build228"
}
// Add maven repositories

2
web/gradle.properties

@ -1,3 +1,3 @@
COMPOSE_CORE_VERSION=0.5.0-build227
COMPOSE_CORE_VERSION=0.5.0-build228
COMPOSE_WEB_VERSION=0.0.16-SNAPSHOT
COMPOSE_WEB_BUILD_WITH_EXAMPLES=false

Loading…
Cancel
Save