Hi, I'm trying to convert our `.css` file into `StyleSheet()`. Most of the stuff works, but I don't ...

# compose-web

[Tomáš Hubálek]

Hi, I'm trying to convert our .css file into StyleSheet(). Most of the stuff works, but I don't know how to correctly convert rules like this

.classA.classB {
}

which means element that has both .classA and .classB assigned.

I looked into https://github.com/JetBrains/compose-jb/blob/master/tutorials/Web/Style_Dsl/README.md but it looks like it can only be achieved in init{} section using string names of the classes.

Any clue? Thanks

[hfhbd]

How exactly did you convert the css file? Manually?

[Tomáš Hubálek]

Yes

[Tomáš Hubálek]

I'm rewriting css rules into Compose format.

[Tomáš Hubálek]

Ha. I found that this is compilable:

object MyStyleSheet : StyleSheet() {
   val classA by style {}
   val classB by style {}

   init {
     classA + classB {
        property("x", "y")
     }
   }
}

So maybe it will be that simple.

[Akif Abasov [JB]]

it can be done like this also

object MyStyleSheet : StyleSheet() {
   init {
     ".classA.classB" {
        property("x", "y")
     }
   }
}

or

object MyStyleSheet : StyleSheet() {
   val classA by style {}
   val classB by style {
       classA + self {
           property("x", "y")
       }
   }
}

[Akif Abasov [JB]]

so you can use self keyword for nested rules