Module
Freedom.Markup.Prop
- Package
- purescript-freedom
- Repository
- purescript-freedom/purescript-freedom
#css Source
css :: forall state. String -> VNode state -> VNode stateDefine styles with CSS string.
It generates a hash string as class name from CSS string, and the generated class name is used automatically.
justDiv :: forall state. VNode state
justDiv =
H.div # H.css styles
styles :: String
styles =
"""
.& {
width: 100px;
height: 100px;
}
.&:hover {
width: 100px;
height: 100px;
}
.&:hover .selected {
color: blue;
}
"""
& in the CSS string is replaced with the generated class name, and output it as stylesheet.
Like this:
.dz66dqm {
width: 100px;
height: 100px;
}
.dz66dqm:hover {
width: 100px;
height: 100px;
}
.dz66dqm:hover .selected {
color: blue;
}