javascript - Create CSS class with kotlinx.html DSL - Stack Overflow

admin管理员组

文章数量:1345582

I'm using Kotlin to Javascript plugin and kotlinx.html library to build sample app:

fun main(args: Array<String>) {
    window.onload = {
        document.body!!.append.div {
            a("#", classes = "red") {
                +"Link"
            }
        }
    }
}

And I want to paint a link with "red" CSS class to red color.
Now I'm using unsage + raw to do it:

document.head!!.append.style {
    unsafe {
        raw(".red { background: #f00; }")
    }
}

How to create CSS class with kotlinx.html DSL? I didn't find any docs related to css DSL.

I'm using Kotlin to Javascript plugin and kotlinx.html library to build sample app:

fun main(args: Array<String>) {
    window.onload = {
        document.body!!.append.div {
            a("#", classes = "red") {
                +"Link"
            }
        }
    }
}

And I want to paint a link with "red" CSS class to red color.
Now I'm using unsage + raw to do it:

document.head!!.append.style {
    unsafe {
        raw(".red { background: #f00; }")
    }
}

How to create CSS class with kotlinx.html DSL? I didn't find any docs related to css DSL.

• javascript
• css
• kotlin
• dsl
• kotlinx-html

Share Improve this question Follow asked Sep 30, 2017 at 15:46 KirillKirill 8,35199 gold badges5353 silver badges107107 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 9

You cannot use the HTML DSL for creating CSS. There are two possible ways for using css in your HTML.

1) You create CSS files independently and then use the classes as you proposed. 2) Inline the CSS if this is feasible for your app.

h1("h1Class") {
    style = "background-color:red"
    +"My header1"
}

This results in:

<h1 class="h1Class" style="background-color:red">My header1</h1>

kotinx-html is a DSL for HTML only. So CSS needs to be built separately. What you need is kotlinx.css but it was quite unpopular so it was discontinued. For sure there are few munity libraries targeted to that purpose but not sure if they are still alive.

本文标签： javascriptCreate CSS class with kotlinxhtml DSLStack Overflow