ScalaCSS

Scalatags

ScalaCSS integrates with Scalatags in both Text and JsDom modes.

1. Add this to your SBT build:

   libraryDependencies += "com.github.japgolly.scalacss" %%% "ext-scalatags" % "0.8.0-RC1"

2. Add this to your Scala code:

   import scalacss.ScalatagsCss._
   

3. Create your inline styles as normal.

4. To generate a <style> tag of all of your styles, call .render[T] where T is the type of output you want.

   • MyStyles.render[String]
   • MyStyles.render[scalatags.Text.TypedTag[String]]
   • MyStyles.render[scalatags.JsDom.TypedTag[HTMLStyleElement]]
     
     

5. Finally, to apply styles, just reference them in your tags.

   h1( MyStyles.heading, "This is a heading" )
   

Example

example/package.scala

package object example {
  val CssSettings = scalacss.devOrProdDefaults
}

example/MyStyles.scala

package example

import CssSettings._

object MyStyles extends StyleSheet.Inline {
  import dsl._

  val bootstrapButton = style(
    addClassNames("btn", "btn-default"),
    fontSize(200 %%)
  )
}

example/MyApp.scala

package example

import CssSettings._
import scalacss.ScalatagsCss._
import scalatags.Text._
import scalatags.Text.all._

object MyApp {

  def myPage =
    html(
      MyStyles.render[TypedTag[String]],
      body(
        button(
          MyStyles.bootstrapButton,
          "I am a button!"
        )
      )
    )
}