com-lihaoyi/scalatags

How to select tags in a stylesheet

leleogere opened this issue · 1 comments

I might be missing something, but I can't figure out how to select tags (not classes) in a stylesheet.

I managed to get that working for classes:

object Style extends StyleSheet {
  initStyleSheet()
  val date = cls(color := "red")
}

val document = html(
  head(
    scalatags.Text.tags2.style(Style.styleSheetText)
  ),
  h1("Report"),
  h2(Style.date)("2022-05-17")
)

But how do I select the h1 tag for example? How do I generate something like the following in the stylesheet generated by my Style object?

h1 {
  color: blue;
}

I feel like I'm missing something very obvious but I can't find anything working.

I do not think it is possible to select or generate tags with custom stylesheets as the intention is to either pass them yourselves inline (e.g. h1(color := "red")("My Title")) or to make stylesheets as prescribed via extending StyleSheet or CascadingStyleSheet. The closest you can do, I think, is to make a list of CSS modifiers that you want to include and then pass them directly into the tag itself.

/* Things I want to apply to `h1` tags. Can just be a plain value; I only created a companion object for
 * demonstration purposes.
 */
object StyleForH1TagsOnly:
  val css = List(
    color := "blue",
    backgroundColor := "green"
  )

/* Apply the styles to the tag using the spread operator. */
...
h1(StyleForH1TagsOnly.css*)("My custom title")
...