These are chat archives for japgolly/scalacss

13th
Aug 2015
Nick Childers
@Voltir
Aug 13 2015 02:29

Im trying to do a thing with scalacss that im not sure is currently possible - im being fancy with how I want to define styles and its not quite working out...

I have a play-scalajs app, with multiple scalajs clients (think user facing frontend and admin client each as there own scalajs app)

I want to put common styles and common html in a "sharedjs" project which is a scalajs lib shared between both clients.

Im having a really hard time figuring out how to create "modular" css styles using the normal scala tricks - ie traits / abstract classes / objects.

The best I have gotten working is one global stylesheet that get shared between both js clients, but so far i havent really been able to break it down any further.

Matt Hughes
@matthughes
Aug 13 2015 18:46
Can you explain more about what you’ve tried and failed at?
This is some of what I do:
trait CommonVariables extends InlineStylesheet {
  val themeColor = white
  val commonPadding = 20 px 

  val borderStyles = styleS(
    borderColor.black,
    borderWidth(2 px),
    borderStyle.solid
  )
}

object FooStyles extends CommonVariables {
  val someComponent = style(
    backgroundColor(themeColor)
    borderStyles
  ) 
}
I have a single trait (obviously could have more) where I defined any common style snippets (styleS) and common colors, spacings, etc. Then I have an object for each component/screen that defines the actual styles (style). These objects mix in CommonVariables so I can reference them.