Question about defining multiple style maps

[Jarzka]

Hi

As I understand the Garden selector syntax, it has the selector part (first N elements which can be strings, keywords or vectors) and the style map should be the last element in every vector.

However, if I have something like this:

(garden.core/css [:h1 {:font-weight "normal"} {:font-weight "bold"}])

it outputs this CSS:

h1 {
    font-weight: normal;
    font-weight: bold;
}

Is this the designed behavior? Are multiple style maps supported like this or what does it mean to have multiple style maps as part of the vector? Also, does Garden assume that maps are always CSS properties, never part of the selector?

[harold]

Good question. I have wondered similar things in the past.

[Jarzka]

I'm mainly asking this because I'm planning creating an algorithm which will automatically scope a Garden selector to specific class, i.e. make the original selector valid only inside some element. This is possible to do by simply wrapping the style map in the selector within a vector.

For example: from: [:.item {:font-weight "normal"}] to: [:.item [:.my-custom-scope {:font-weight "normal"}]].

I'm just curious to know if I can safely do this. It should be ok if maps are only treated as CSS properties and there should not be multiple maps in the same vector.

[Jarzka]

I think having multiple style maps in a single Garden vector is allowed, but usually you want to put them in a different context, like:

 [:.outer {:font-weight "normal"}
  [:.inner {:font-weight "bold"}])

[harold]

It does appear that the compiler (at least in the version we're using, "1.3.10") allows multiple declerations in a single rule:

https://github.com/noprompt/garden/blob/16a390186fea989e8049c00cd57f9bdd82a22fd3/src/garden/compiler.cljc#L492-L502

render-css supports many sequential types:

https://github.com/noprompt/garden/blob/16a390186fea989e8049c00cd57f9bdd82a22fd3/src/garden/compiler.cljc#L658

Accounting for this in your programmatic manipulations of garden data seems like a good idea.

Note: I'm mostly just a user of this library, still learning more about the internals myself, so take my advice w/ a grain of salt.

[noprompt]

Is this the designed behavior?

Yes.

Are multiple style maps supported like this or what does it mean to have multiple style maps as part of the vector?

It means merge them all into one set of declarations from left to right. This is to both address problems with ordering in large Clojure maps and ordering of declarations in CSS.

Also, does Garden assume that maps are always CSS properties, never part of the selector?

Yes.

[Jarzka]

Thanks for the answers.