-----------------------------------------------------------------------------
{-# LANGUAGE OverloadedStrings #-}
-----------------------------------------------------------------------------
-- |
-- Module      :  Miso.CSS
-- Copyright   :  (C) 2016-2026 David M. Johnson
-- License     :  BSD3-style (see the file LICENSE)
-- Maintainer  :  David M. Johnson <code@dmj.io>
-- Stability   :  experimental
-- Portability :  non-portable
--
-- = Overview
--
-- "Miso.CSS" is a typed DSL for constructing CSS properties, stylesheets,
-- animations, and media queries in miso applications. Two styling modes are
-- available:
--
-- * __Structured styles__ ('style_'): CSS properties are stored in a
--   'Data.Map.Map' and diffed by the virtual DOM, so only changed properties
--   are written to the DOM node on each render. Prefer this for dynamic styles.
--
-- * __Inline string styles__ ('styleInline_'): a raw CSS string is set on the
--   @style@ attribute verbatim and is not diffed. Useful for static one-liners
--   or values that the structured combinators do not yet cover.
--
-- = Quick start
--
-- @
-- import qualified "Miso.CSS"       as CSS
-- import           "Miso.CSS.Color" ('Miso.CSS.Color.red', 'Miso.CSS.Color.rgba')
--
-- myView :: model -> 'Miso.Types.View' context props model Action
-- myView _ =
--   'Miso.Html.Element.div_'
--     [ CSS.'Miso.CSS.style_'
--         [ CSS.'Miso.CSS.display'        "flex"
--         , CSS.'Miso.CSS.flexDirection'  "column"
--         , CSS.'Miso.CSS.gap'            (CSS.'Miso.CSS.px' 8)
--         , CSS.'Miso.CSS.padding'        (CSS.'Miso.CSS.px' 16)
--         , CSS.'Miso.CSS.backgroundColor' 'Miso.CSS.Color.red'
--         , CSS.'Miso.CSS.borderRadius'   (CSS.'Miso.CSS.px' 4)
--         ]
--     ] [ 'Miso.text' "Hello, miso!" ]
-- @
--
-- = Global Stylesheets
--
-- Construct a t'StyleSheet' with 'sheet_' and 'selector_', then render it to
-- a 'MisoString' with 'renderStyleSheet' for injection into a @\<style\>@ tag:
--
-- @
-- mySheet :: t'StyleSheet'
-- mySheet = 'sheet_'
--   [ 'selector_' "body"
--       [ CSS.'margin'     (CSS.'px' 0)
--       , CSS.'fontFamily' "sans-serif"
--       ]
--   , 'selector_' ".card"
--       [ CSS.'backgroundColor' ('rgba' 255 255 255 0.9)
--       , CSS.'borderRadius'    (CSS.'px' 4)
--       ]
--   ]
-- @
--
-- = Animations and Media Queries
--
-- @
-- myAnimation :: t'Styles'
-- myAnimation = 'keyframes_' "slide-in"
--   [ 'from_' [ CSS.'transform' "translateX(-100%)" ]
--   , 'to_'   [ CSS.'transform' "translateX(0)" ]
--   ]
--
-- myMedia :: t'Styles'
-- myMedia = 'media_' ('screen_' \`and_\` 'minWidth_' (CSS.'px' 480))
--   [ 'rule_' "header" [ CSS.'height' "auto" ]
--   , 'rule_' "nav"    [ CSS.'display' "flex" ]
--   ]
-- @
--
-- = CSS Units
--
-- Use the unit helpers to build length and time values:
-- 'px', 'pt', 'em', 'rem', 'vh', 'vw', 'pct', 'ms', 's', 'deg', 'rad', 'turn'.
--
-- @
-- CSS.'style_'
--   [ CSS.'width'      (CSS.'pct' 100)
--   , CSS.'fontSize'   (CSS.'rem' 1.5)
--   , CSS.'transition' ("opacity " <> CSS.'ms' 300 <> " ease")
--   ]
-- @
--
-- = Colors
--
-- The 'Color' type and named colors are re-exported from "Miso.CSS.Color":
--
-- @
-- CSS.'backgroundColor' (CSS.'rgb' 30 144 255)
-- CSS.'color'           CSS.'white'
-- CSS.'borderColor'     (CSS.'rgba' 0 0 0 0.2)
-- @
--
-- __Note:__ 'color' in this module and 'Miso.Canvas.color' share the same
-- name but have different types. Always qualify @import qualified Miso.CSS as CSS@
-- when also importing "Miso.Canvas".
--
-----------------------------------------------------------------------------
module Miso.CSS
  ( -- *** Types
    module Miso.CSS.Types
    -- *** Smart Constructor
  , style_
  , styleInline_
  , sheet_
  , selector_
    -- *** Render
  , renderStyleSheet
    -- *** Combinators
  , alignContent
  , alignItems
  , alignSelf
  , animationDelay
  , animationDirection
  , animationDuration
  , animationFillMode
  , animationIterationCount
  , animation
  , animationName
  , animationPlayState
  , animationTimingFunction
  , aspectRatio
  , backgroundClip
  , backgroundColor
  , backgroundImage
  , background
  , backgroundOrigin
  , backgroundPosition
  , backgroundRepeat
  , backgroundSize
  , borderBottomColor
  , borderBottomLeftRadius
  , borderBottom
  , borderBottomRightRadius
  , borderBottomStyle
  , borderBottomWidth
  , borderCollapse
  , borderColor
  , borderEndEndRadius
  , borderEndStartRadius
  , borderInlineEndColor
  , borderInlineEndStyle
  , borderInlineEndWidth
  , borderInlineStartColor
  , borderInlineStartStyle
  , borderInlineStartWidth
  , borderLeftColor
  , borderLeft
  , borderLeftStyle
  , borderLeftWidth
  , border
  , borderRadius
  , borderRightColor
  , borderRight
  , borderRightStyle
  , borderRightWidth
  , borderStartEndRadius
  , borderStartStartRadius
  , borderStyle
  , borderTopColor
  , borderTopLeftRadius
  , borderTop
  , borderTopRightRadius
  , borderTopStyle
  , borderTopWidth
  , borderWidth
  , bottom
  , boxShadow
  , boxSizing
  , clipPath
  , accentColor
  , appearance
  , backdropFilter
  , caretColor
  , color
  , columnGap
  , cursor
  , direction
  , display
  , fill
  , filter
  , flexBasis
  , flexDirection
  , flexFlow
  , flexGrow
  , flex
  , flexShrink
  , flexWrap
  , fontFamily
  , fontSize
  , fontStretch
  , fontStyle
  , fontVariant
  , fontWeight
  , gap
  , gridAutoColumns
  , gridAutoFlow
  , gridAutoRows
  , gridColumn
  , gridColumnEnd
  , gridColumnSpan
  , gridColumnStart
  , gridRow
  , gridRowEnd
  , gridRowSpan
  , gridRowStart
  , gridTemplateColumns
  , gridTemplateRows
  , height
  , imageRendering
  , insetInlineEnd
  , insetInlineStart
  , justifyContent
  , justifyItems
  , justifySelf
  , left
  , letterSpacing
  , linearCrossGravity
  , linearDirection
  , linearGravity
  , linearLayoutGravity
  , linearWeight
  , linearWeightSum
  , lineHeight
  , marginBottom
  , marginInlineEnd
  , marginInlineStart
  , marginLeft
  , margin
  , marginRight
  , marginTop
  , maskImage
  , mask
  , maxHeight
  , maxWidth
  , minHeight
  , minWidth
  , mixBlendMode
  , objectFit
  , objectPosition
  , opacity
  , order
  , outline
  , outlineColor
  , outlineOffset
  , outlineStyle
  , outlineWidth
  , overflow
  , overflowX
  , overflowY
  , overscrollBehavior
  , paddingBottom
  , paddingInlineEnd
  , paddingInlineStart
  , paddingLeft
  , padding
  , paddingRight
  , paddingTop
  , perspective
  , pointerEvents
  , position
  , relativeAlignBottom
  , relativeAlignInlineEnd
  , relativeAlignInlineStart
  , relativeAlignLeft
  , relativeAlignRight
  , relativeAlignTop
  , relativeBottomOf
  , relativeCenter
  , relativeId
  , relativeInlineEndOf
  , relativeInlineStartOf
  , relativeLayoutOnce
  , relativeLeftOf
  , relativeRightOf
  , relativeTopOf
  , resize
  , right
  , rowGap
  , scrollBehavior
  , stroke
  , strokeWidth
  , textAlign
  , textDecoration
  , textIndent
  , textOverflow
  , textShadow
  , textStrokeColor
  , textStroke
  , textStrokeWidth
  , textTransform
  , top
  , transform
  , transforms
  , transformOrigin
    -- *** Transform functions
  , translate
  , translateX
  , translateY
  , translateZ
  , translate3d
  , rotate
  , rotateX
  , rotateY
  , rotateZ
  , rotate3d
  , scale
  , scaleXY
  , scale3d
  , scaleX
  , scaleY
  , scaleZ
  , perspectiveFn
  , matrix3d
  , skew
  , skewX
  , skewY
  , transitionDelay
  , transitionDuration
  , transition
  , transition_
  , transitionProperty
  , transitionTimingFunction
  , cubicBezier
  , userSelect
  , verticalAlign
  , visibility
  , whiteSpace
  , width
  , willChange
  , wordBreak
  , xAutoFontSize
  , xAutoFontSizePresetSizes
  , xHandleColor
  , xHandleSize
  , zIndex
  -- *** Colors
  , module Miso.CSS.Color
  -- *** Units
  , px
  , ppx
  , pct
  , pt
  , vw
  , vh
  , deg
  , turn
  , rad
  , rpx
  , rem
  , em
  , s
  , ms
  -- *** Misc
  , url
  , matrix
  -- *** Animation
  , keyframes_
  , from_
  , to_
  , at
  -- *** Media Queries
  , media_
  , rule_
    -- *** Media query combinators
  , screen_
  , print_
  , all_
  , and_
  , or_
  , not_
  , minWidth_
  , maxWidth_
  , minHeight_
  , maxHeight_
  , orientation_
  , prefersColorScheme_
  , prefersReducedMotion_
  , hover_
  ) where
-----------------------------------------------------------------------------
import qualified Data.Map as M
import           Miso.String (MisoString)
import qualified Miso.String as MS
import           Miso.CSS.Color
import           Miso.CSS.Types
import           Miso.Property
import           Miso.Types (Attribute)
import qualified Miso.Types as MT
import           Miso.Util ((=:))
-----------------------------------------------------------------------------
import           Prelude hiding (filter, rem)
-----------------------------------------------------------------------------
-- | Font sizing in terms of *pt*
--
-- @
-- >>> pt 10
-- "10pt"
-- @
--
pt :: Int -> MisoString
pt :: Int -> Text
pt Int
x = Int -> Text
forall str. ToMisoString str => str -> Text
MS.ms Int
x Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
"pt"
-----------------------------------------------------------------------------
-- | Font sizing in terms of *px*
--
-- @
-- >>> px 10
-- "10px"
-- @
--
px :: Int -> MisoString
px :: Int -> Text
px Int
x = Int -> Text
forall str. ToMisoString str => str -> Text
MS.ms Int
x Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
"px"
-----------------------------------------------------------------------------
-- | Degree specification
--
-- @
-- >>> deg 10
-- "10deg"
-- @
--
deg :: Double -> MisoString
deg :: Double -> Text
deg Double
x = Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
x Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
"deg"
-----------------------------------------------------------------------------
-- | Turn constructor, useful for specifying rotations
--
-- @
-- >>> turn 10.0
-- "10.0turn"
-- @
--
turn :: Double -> MisoString
turn :: Double -> Text
turn Double
x = Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
x Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
"turn"
-----------------------------------------------------------------------------
-- | Radial constructor
--
-- @
-- >>> rad 10.0
-- "10.0rad"
-- @
--
rad :: Double -> MisoString
rad :: Double -> Text
rad Double
x = Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
x Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
"rad"
-----------------------------------------------------------------------------
-- | Responsive pixel sizing, *rpx*
--
-- @
-- >>> rpx 10.0
-- "10.0rpx"
-- @
--
rpx :: Double -> MisoString
rpx :: Double -> Text
rpx Double
x = Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
x Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
"rpx"
-----------------------------------------------------------------------------
-- | Relative *em* sizing
--
-- @
-- >>> rem 10.0
-- "10.0rem"
-- @
--
rem :: Double -> MisoString
rem :: Double -> Text
rem Double
x = Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
x Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
"rem"
-----------------------------------------------------------------------------
-- | *em* sizing
--
-- @
-- >>> em 10.0
-- "10.0em"
-- @
--
em :: Double -> MisoString
em :: Double -> Text
em Double
x = Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
x Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
"em"
-----------------------------------------------------------------------------
-- | Viewport height
--
-- @
-- >>> vh 10.0
-- "10.0vh"
-- @
--
vh :: Double -> MisoString
vh :: Double -> Text
vh Double
x = Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
x Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
"vh"
-----------------------------------------------------------------------------
-- | Viewport width
--
-- @
-- >>> vw 10.0
-- "10.0vw"
-- @
--
vw :: Double -> MisoString
vw :: Double -> Text
vw Double
x = Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
x Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
"vw"
-----------------------------------------------------------------------------
-- | Duration in seconds
--
-- @
-- >>> s 10.0
-- "10.0s"
-- @
--
s :: Double -> MisoString
s :: Double -> Text
s Double
x = Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
x Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
"s"
-----------------------------------------------------------------------------
-- | Duration in milliseconds
--
-- @
-- >>> ms 10.0
-- "10.0ms"
-- @
--
ms :: Double -> MisoString
ms :: Double -> Text
ms Double
x = Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
x Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
"ms"
-----------------------------------------------------------------------------
-- | Wraps a value in the CSS @url()@ function, used for background images and similar.
--
-- @
-- >>> url "dog.png"
-- "url(dog.png)"
-- @
--
-- @
-- backgroundImage (url "banner.png")
-- @
--
-- <https://developer.mozilla.org/en-US/docs/Web/CSS/url>
--
url :: MisoString -> MisoString
url :: Text -> Text
url Text
x = Text
"url(" Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
x Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")"
-----------------------------------------------------------------------------
-- | Constructs a 2D CSS transformation matrix string: @matrix(a, b, c, d, tx, ty)@.
--
-- The six parameters define a 2D affine transformation: @a@ and @d@ scale,
-- @b@ and @c@ skew, and @tx@\/@ty@ translate.
--
-- @
-- transform (matrix 1 0 0 1 50 100)  -- translate by (50, 100)
-- @
--
-- <https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/matrix>
--
matrix
  :: Double  -- ^ a  — scale x
  -> Double  -- ^ b  — skew y
  -> Double  -- ^ c  — skew x
  -> Double  -- ^ d  — scale y
  -> Double  -- ^ tx — translate x
  -> Double  -- ^ ty — translate y
  -> MisoString
matrix :: Double -> Double -> Double -> Double -> Double -> Double -> Text
matrix Double
a Double
b Double
c Double
d Double
tx Double
ty = Text
"matrix(" Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
values Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")"
  where
    values :: Text
values =
      Text -> [Text] -> Text
MS.intercalate Text
","
      [ Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
a
      , Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
b
      , Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
c
      , Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
d
      , Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
tx
      , Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
ty
      ]
-----------------------------------------------------------------------------
-- | Percentage unit.
--
-- @
-- >>> pct 50.0
-- "50.0%"
-- @
--
-- <https://developer.mozilla.org/en-US/docs/Web/CSS/percentage>
pct :: Double -> MisoString
pct :: Double -> Text
pct Double
x = Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
x Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
"%"
-----------------------------------------------------------------------------
-- | Physical pixel unit (@ppx@), used in some native\/mobile rendering contexts.
--
-- @
-- >>> ppx 2.0
-- "2.0ppx"
-- @
--
ppx :: Double -> MisoString
ppx :: Double -> Text
ppx Double
x = Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
x Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
"ppx"
-----------------------------------------------------------------------------
-- | Constructs a t'Styles' entry pairing a CSS selector with a list of properties.
-- Combine multiple entries with 'sheet_'.
--
-- @
-- sheet_
--   [ selector_ ".card"  [ backgroundColor white, borderRadius (px 4) ]
--   , selector_ ".title" [ fontSize (rem 1.5), fontWeight "bold" ]
--   ]
-- @
--
selector_ :: MisoString -> [Style] -> Styles
selector_ :: Text -> [Style] -> Styles
selector_ Text
k [Style]
v = (Text, [Style]) -> Styles
Styles (Text
k,[Style]
v)
-----------------------------------------------------------------------------
-- | Constructs a t'StyleSheet' from a list of t'Styles' entries.
--
-- Combine with 'selector_', 'keyframes_', and 'media_' to build a full
-- stylesheet, then render it to a 'MisoString' with 'renderStyleSheet'.
--
-- @
-- mySheet :: StyleSheet
-- mySheet = sheet_
--   [ selector_ "body"   [ margin (px 0), fontFamily "sans-serif" ]
--   , selector_ "button" [ cursor "pointer", borderRadius (px 4) ]
--   ]
-- @
--
sheet_ :: [Styles] -> StyleSheet
sheet_ :: [Styles] -> StyleSheet
sheet_ = [Styles] -> StyleSheet
StyleSheet
-----------------------------------------------------------------------------
-- | Constructs a structured @style@ attribute from a list of CSS properties.
--
-- Each 'Style' is a @(property, value)@ pair produced by the combinators in
-- this module. Miso tracks the properties as a 'Data.Map.Map', diffs them on
-- each render, and applies only the changed properties to the DOM. Properties
-- absent from the list are removed from the node.
--
-- @
-- div_
--   [ style_
--       [ display       "flex"
--       , flexDirection "column"
--       , gap           (px 8)
--       , backgroundColor red
--       ]
--   ] []
-- @
--
-- See also 'styleInline_' for setting raw CSS strings.
--
-- <https://developer.mozilla.org/en-US/docs/Web/CSS>
--
style_ :: [Style] -> Attribute model action
style_ :: forall model action. [Style] -> Attribute model action
style_ = Map Text Text -> Attribute model action
forall model action. Map Text Text -> Attribute model action
MT.Styles (Map Text Text -> Attribute model action)
-> ([Style] -> Map Text Text) -> [Style] -> Attribute model action
forall b c a. (b -> c) -> (a -> b) -> a -> c
. [Style] -> Map Text Text
forall k a. Ord k => [(k, a)] -> Map k a
M.fromList
-----------------------------------------------------------------------------
-- | Sets the @style@ attribute to a raw CSS string.
--
-- Unlike 'style_', the string is applied verbatim and is not tracked or
-- diffed by the virtual DOM. Suitable for static styles or CSS values that
-- the structured combinators do not yet cover.
--
-- @
-- div_ [ styleInline_ "background-color:red; color:blue;" ] [ "foo" ]
-- @
--
-- <https://developer.mozilla.org/en-US/docs/Web/CSS>
--
styleInline_ ::  MisoString -> Attribute model action
styleInline_ :: forall model action. Text -> Attribute model action
styleInline_ = Text -> Text -> Attribute model action
forall model action. Text -> Text -> Attribute model action
textProp Text
"style"
-----------------------------------------------------------------------------
-- | Renders a t'Styles' to a t'MisoString'
renderStyles :: Int -> Styles -> MisoString
renderStyles :: Int -> Styles -> Text
renderStyles Int
indent (Styles (Text
sel,[Style]
styles)) = [Text] -> Text
MS.unlines
  [ Text
sel Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
" {" Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Int -> Text -> Text
MS.replicate Int
indent Text
" "
  , Text -> [Text] -> Text
MS.intercalate Text
"\n"
        [ [Text] -> Text
forall a. Monoid a => [a] -> a
mconcat
          [ Int -> Text -> Text
MS.replicate (Int
indent Int -> Int -> Int
forall a. Num a => a -> a -> a
+ Int
2) Text
" " Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
k
          , Text
" : "
          , Text
v
          , Text
";"
          ]
        | (Text
k,Text
v) <- [Style]
styles
        ]
  , Int -> Text -> Text
MS.replicate Int
indent Text
" " Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
"}"
  ]
renderStyles Int
indent (KeyFrame Text
name [(Text, [Style])]
frames) = Text -> [Text] -> Text
MS.intercalate Text
" "
  [ Text
"@keyframes"
  , Text
name
  , Text
"{\n"
  , Text -> [Text] -> Text
MS.intercalate Text
"\n  "
    [ Int -> Styles -> Text
renderStyles (Int
indent Int -> Int -> Int
forall a. Num a => a -> a -> a
+ Int
2) ((Text, [Style]) -> Styles
Styles (Text, [Style])
frame)
    | (Text, [Style])
frame <- [(Text, [Style])]
frames
    ]
  , Text
"}\n"
  ]
renderStyles Int
indent (Media Text
name [(Text, [Style])]
frames) = Text -> [Text] -> Text
MS.intercalate Text
" "
  [ Text
"@media"
  , Text
name
  , Text
"{\n"
  , Text -> [Text] -> Text
MS.intercalate Text
"\n  "
    [ Int -> Styles -> Text
renderStyles (Int
indent Int -> Int -> Int
forall a. Num a => a -> a -> a
+ Int
2) ((Text, [Style]) -> Styles
Styles (Text, [Style])
frame)
    | (Text, [Style])
frame <- [(Text, [Style])]
frames
    ]
  , Text
"}\n"
  ]
-----------------------------------------------------------------------------
-- | Renders a t'StyleSheet' to a 'MisoString' suitable for injection into a
-- @\<style\>@ tag.
--
-- @
-- view_ :: View context props model action
-- view_ = style [] [ text (renderStyleSheet mySheet) ]
-- @
--
renderStyleSheet :: StyleSheet -> MisoString
renderStyleSheet :: StyleSheet -> Text
renderStyleSheet StyleSheet
styleSheet = Text -> [Text] -> Text
MS.intercalate Text
"\n"
  [ Int -> Styles -> Text
renderStyles Int
0 Styles
styles
  | Styles
styles <- StyleSheet -> [Styles]
getStyleSheet StyleSheet
styleSheet
  ]
-----------------------------------------------------------------------------
-- | Constructs a CSS @\@keyframes@ animation rule.
--
-- The first argument is the animation name; the second is a list of
-- @(keyframe-selector, [Style])@ pairs. Keyframe selectors are either
-- @"from"@\/@"to"@ or a percentage string produced by 'pct'.
--
-- @
-- slideIn :: Styles
-- slideIn = keyframes_ "slide-in"
--   [ from_ [ transform "translateX(-100%)" ]
--   , at (pct 50) [ opacity 0.5 ]
--   , to_   [ transform "translateX(0)" ]
--   ]
-- @
--
-- <https://developer.mozilla.org/en-US/docs/Web/CSS/@keyframes>
--
keyframes_ :: MisoString -> [KeyframeStop] -> Styles
keyframes_ :: Text -> [KeyframeStop] -> Styles
keyframes_ Text
name [KeyframeStop]
stops = Text -> [(Text, [Style])] -> Styles
KeyFrame Text
name ((KeyframeStop -> (Text, [Style]))
-> [KeyframeStop] -> [(Text, [Style])]
forall a b. (a -> b) -> [a] -> [b]
map KeyframeStop -> (Text, [Style])
getKeyframeStop [KeyframeStop]
stops)
-----------------------------------------------------------------------------
-- | The @from@ stop in a '@keyframes' rule (equivalent to @0%@).
from_ :: [Style] -> KeyframeStop
from_ :: [Style] -> KeyframeStop
from_ [Style]
styles = (Text, [Style]) -> KeyframeStop
KeyframeStop (Text
"from", [Style]
styles)
-----------------------------------------------------------------------------
-- | The @to@ stop in a '@keyframes' rule (equivalent to @100%@).
to_ :: [Style] -> KeyframeStop
to_ :: [Style] -> KeyframeStop
to_ [Style]
styles = (Text, [Style]) -> KeyframeStop
KeyframeStop (Text
"to", [Style]
styles)
-----------------------------------------------------------------------------
-- | A keyframe stop at a given position, typically built with 'pct'.
--
-- > at (pct 50) [ opacity 0.5 ]
--
at :: MisoString -> [Style] -> KeyframeStop
at :: Text -> [Style] -> KeyframeStop
at Text
stop [Style]
styles = (Text, [Style]) -> KeyframeStop
KeyframeStop (Text
stop, [Style]
styles)
-----------------------------------------------------------------------------
-- | Constructs a CSS @\@media@ query rule.
--
-- The first argument is the media condition string; the second is a list of
-- @(selector, [Style])@ pairs scoped to that query.
--
-- @
-- responsive :: t'Styles'
-- responsive = 'media_' ('screen_' \`and_\` 'minWidth_' (px 480))
--   [ 'rule_' "header" [ 'height' "auto" ]
--   , 'rule_' "ul"     [ 'display' "block" ]
--   ]
-- @
--
-- <https://developer.mozilla.org/en-US/docs/Web/CSS/@media>
--
media_ :: MediaQuery -> [MediaRule] -> Styles
media_ :: MediaQuery -> [MediaRule] -> Styles
media_ (MediaQuery Text
q) [MediaRule]
rules = Text -> [(Text, [Style])] -> Styles
Media Text
q ((MediaRule -> (Text, [Style])) -> [MediaRule] -> [(Text, [Style])]
forall a b. (a -> b) -> [a] -> [b]
map MediaRule -> (Text, [Style])
getMediaRule [MediaRule]
rules)
-----------------------------------------------------------------------------
-- | A selector rule inside a 'media_' block.
--
-- > rule_ "header" [ height "auto" ]
--
rule_ :: MisoString -> [Style] -> MediaRule
rule_ :: Text -> [Style] -> MediaRule
rule_ Text
sel [Style]
styles = (Text, [Style]) -> MediaRule
MediaRule (Text
sel, [Style]
styles)
-----------------------------------------------------------------------------
-- | The @screen@ media type.
screen_ :: MediaQuery
screen_ :: MediaQuery
screen_ = Text -> MediaQuery
MediaQuery Text
"screen"
-----------------------------------------------------------------------------
-- | The @print@ media type.
print_ :: MediaQuery
print_ :: MediaQuery
print_ = Text -> MediaQuery
MediaQuery Text
"print"
-----------------------------------------------------------------------------
-- | The @all@ media type (matches all devices).
all_ :: MediaQuery
all_ :: MediaQuery
all_ = Text -> MediaQuery
MediaQuery Text
"all"
-----------------------------------------------------------------------------
-- | Logical @and@ for media queries.
--
-- > screen_ \`and_\` minWidth_ (px 480)
--
and_ :: MediaQuery -> MediaQuery -> MediaQuery
and_ :: MediaQuery -> MediaQuery -> MediaQuery
and_ (MediaQuery Text
a) (MediaQuery Text
b) = Text -> MediaQuery
MediaQuery (Text
a Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
" and " Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
b)
-----------------------------------------------------------------------------
-- | Logical @or@ for media queries (comma-separated).
--
-- > screen_ \`or_\` print_
--
or_ :: MediaQuery -> MediaQuery -> MediaQuery
or_ :: MediaQuery -> MediaQuery -> MediaQuery
or_ (MediaQuery Text
a) (MediaQuery Text
b) = Text -> MediaQuery
MediaQuery (Text
a Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
", " Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
b)
-----------------------------------------------------------------------------
-- | Logical @not@ for media queries.
--
-- > not_ print_
--
not_ :: MediaQuery -> MediaQuery
not_ :: MediaQuery -> MediaQuery
not_ (MediaQuery Text
q) = Text -> MediaQuery
MediaQuery (Text
"not " Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
q)
-----------------------------------------------------------------------------
-- | @min-width@ media feature. Use unit constructors like 'px' or 'em'.
minWidth_ :: MisoString -> MediaQuery
minWidth_ :: Text -> MediaQuery
minWidth_ Text
x = Text -> MediaQuery
MediaQuery (Text
"(min-width: " Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
x Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")")
-----------------------------------------------------------------------------
-- | @max-width@ media feature.
maxWidth_ :: MisoString -> MediaQuery
maxWidth_ :: Text -> MediaQuery
maxWidth_ Text
x = Text -> MediaQuery
MediaQuery (Text
"(max-width: " Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
x Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")")
-----------------------------------------------------------------------------
-- | @min-height@ media feature.
minHeight_ :: MisoString -> MediaQuery
minHeight_ :: Text -> MediaQuery
minHeight_ Text
x = Text -> MediaQuery
MediaQuery (Text
"(min-height: " Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
x Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")")
-----------------------------------------------------------------------------
-- | @max-height@ media feature.
maxHeight_ :: MisoString -> MediaQuery
maxHeight_ :: Text -> MediaQuery
maxHeight_ Text
x = Text -> MediaQuery
MediaQuery (Text
"(max-height: " Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
x Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")")
-----------------------------------------------------------------------------
-- | @orientation@ media feature. Use @\"portrait\"@ or @\"landscape\"@.
orientation_ :: MisoString -> MediaQuery
orientation_ :: Text -> MediaQuery
orientation_ Text
x = Text -> MediaQuery
MediaQuery (Text
"(orientation: " Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
x Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")")
-----------------------------------------------------------------------------
-- | @prefers-color-scheme@ media feature. Use @\"light\"@ or @\"dark\"@.
prefersColorScheme_ :: MisoString -> MediaQuery
prefersColorScheme_ :: Text -> MediaQuery
prefersColorScheme_ Text
x = Text -> MediaQuery
MediaQuery (Text
"(prefers-color-scheme: " Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
x Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")")
-----------------------------------------------------------------------------
-- | @prefers-reduced-motion@ media feature. Use @\"reduce\"@ or @\"no-preference\"@.
prefersReducedMotion_ :: MisoString -> MediaQuery
prefersReducedMotion_ :: Text -> MediaQuery
prefersReducedMotion_ Text
x = Text -> MediaQuery
MediaQuery (Text
"(prefers-reduced-motion: " Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
x Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")")
-----------------------------------------------------------------------------
-- | @hover@ media feature. Use @\"hover\"@ or @\"none\"@.
hover_ :: MisoString -> MediaQuery
hover_ :: Text -> MediaQuery
hover_ Text
x = Text -> MediaQuery
MediaQuery (Text
"(hover: " Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
x Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")")
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/align-content
--
alignContent :: MisoString -> Style
alignContent :: Text -> Style
alignContent Text
x = Text
"align-content" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/align-items
--
alignItems :: MisoString -> Style
alignItems :: Text -> Style
alignItems Text
x = Text
"align-items" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/align-self
--
alignSelf :: MisoString -> Style
alignSelf :: Text -> Style
alignSelf Text
x = Text
"align-self" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/animation-delay
--
animationDelay :: MisoString -> Style
animationDelay :: Text -> Style
animationDelay Text
x = Text
"animation-delay" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/animation-direction
--
animationDirection :: MisoString -> Style
animationDirection :: Text -> Style
animationDirection Text
x = Text
"animation-direction" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/animation-duration
--
animationDuration :: MisoString -> Style
animationDuration :: Text -> Style
animationDuration Text
x = Text
"animation-duration" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | <https://developer.mozilla.org/en-US/docs/Web/CSS/animation-fill-mode>
--
animationFillMode :: MisoString -> Style
animationFillMode :: Text -> Style
animationFillMode Text
x = Text
"animation-fill-mode" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/animation-iteration-count
--
animationIterationCount :: MisoString -> Style
animationIterationCount :: Text -> Style
animationIterationCount Text
x = Text
"animation-iteration-count" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/animation
--
animation :: MisoString -> Style
animation :: Text -> Style
animation Text
x = Text
"animation" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/animation-name
--
animationName :: MisoString -> Style
animationName :: Text -> Style
animationName Text
x = Text
"animation-name" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | <https://developer.mozilla.org/en-US/docs/Web/CSS/animation-play-state>
--
animationPlayState :: MisoString -> Style
animationPlayState :: Text -> Style
animationPlayState Text
x = Text
"animation-play-state" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/animation-timing-function
--
animationTimingFunction :: MisoString -> Style
animationTimingFunction :: Text -> Style
animationTimingFunction Text
x = Text
"animation-timing-function" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/aspect-ratio
--
aspectRatio :: MisoString -> Style
aspectRatio :: Text -> Style
aspectRatio Text
x = Text
"aspect-ratio" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/background-clip
--
backgroundClip :: MisoString -> Style
backgroundClip :: Text -> Style
backgroundClip Text
x = Text
"background-clip" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/background-color
--
backgroundColor :: Color -> Style
backgroundColor :: Color -> Style
backgroundColor Color
x = Text
"background-color" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Color -> Text
renderColor Color
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/background-image
--
backgroundImage :: MisoString -> Style
backgroundImage :: Text -> Style
backgroundImage Text
x = Text
"background-image" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/background
--
background :: MisoString -> Style
background :: Text -> Style
background Text
x = Text
"background" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/background-origin
--
backgroundOrigin :: MisoString -> Style
backgroundOrigin :: Text -> Style
backgroundOrigin Text
x = Text
"background-origin" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/background-position
--
backgroundPosition :: MisoString -> Style
backgroundPosition :: Text -> Style
backgroundPosition Text
x = Text
"background-position" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/background-repeat
--
backgroundRepeat :: MisoString -> Style
backgroundRepeat :: Text -> Style
backgroundRepeat Text
x = Text
"background-repeat" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/background-size
--
backgroundSize :: MisoString -> Style
backgroundSize :: Text -> Style
backgroundSize Text
x = Text
"background-size" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-color
--
borderBottomColor :: Color -> Style
borderBottomColor :: Color -> Style
borderBottomColor Color
x = Text
"border-bottom-color" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Color -> Text
renderColor Color
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-left-radius
--
borderBottomLeftRadius :: MisoString -> Style
borderBottomLeftRadius :: Text -> Style
borderBottomLeftRadius Text
x = Text
"border-bottom-left-radius" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom
--
borderBottom :: MisoString -> Style
borderBottom :: Text -> Style
borderBottom Text
x = Text
"border-bottom" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-right-radius
--
borderBottomRightRadius :: MisoString -> Style
borderBottomRightRadius :: Text -> Style
borderBottomRightRadius Text
x = Text
"border-bottom-right-radius" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-style
--
borderBottomStyle :: MisoString -> Style
borderBottomStyle :: Text -> Style
borderBottomStyle Text
x = Text
"border-bottom-style" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-width
--
borderBottomWidth :: MisoString -> Style
borderBottomWidth :: Text -> Style
borderBottomWidth Text
x = Text
"border-bottom-width" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-collapse
--
borderCollapse :: MisoString -> Style
borderCollapse :: Text -> Style
borderCollapse Text
x = Text
"border-collapse" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-color
--
borderColor :: Color -> Style
borderColor :: Color -> Style
borderColor Color
x = Text
"border-color" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Color -> Text
renderColor Color
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-end-radius
--
borderEndEndRadius :: MisoString -> Style
borderEndEndRadius :: Text -> Style
borderEndEndRadius Text
x = Text
"border-end-end-radius" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-end-start-radius
--
borderEndStartRadius :: MisoString -> Style
borderEndStartRadius :: Text -> Style
borderEndStartRadius Text
x = Text
"border-end-start-radius" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-inline-end-color
--
borderInlineEndColor :: Color -> Style
borderInlineEndColor :: Color -> Style
borderInlineEndColor Color
x = Text
"border-inline-end-color" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Color -> Text
renderColor Color
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-inline-end-style
--
borderInlineEndStyle :: MisoString -> Style
borderInlineEndStyle :: Text -> Style
borderInlineEndStyle Text
x = Text
"border-inline-end-style" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-inline-end-width
--
borderInlineEndWidth :: MisoString -> Style
borderInlineEndWidth :: Text -> Style
borderInlineEndWidth Text
x = Text
"border-inline-end-width" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-inline-start-color
--
borderInlineStartColor :: Color -> Style
borderInlineStartColor :: Color -> Style
borderInlineStartColor Color
x = Text
"border-inline-start-color" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Color -> Text
renderColor Color
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-inline-start-style
--
borderInlineStartStyle :: MisoString -> Style
borderInlineStartStyle :: Text -> Style
borderInlineStartStyle Text
x = Text
"border-inline-start-style" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-inline-start-width
--
borderInlineStartWidth :: MisoString -> Style
borderInlineStartWidth :: Text -> Style
borderInlineStartWidth Text
x = Text
"border-inline-start-width" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-left-color
--
borderLeftColor :: Color -> Style
borderLeftColor :: Color -> Style
borderLeftColor Color
x = Text
"border-left-color" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Color -> Text
renderColor Color
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-left
--
borderLeft :: MisoString -> Style
borderLeft :: Text -> Style
borderLeft Text
x = Text
"border-left" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-left-style
--
borderLeftStyle :: MisoString -> Style
borderLeftStyle :: Text -> Style
borderLeftStyle Text
x = Text
"border-left-style" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-left-width
--
borderLeftWidth :: MisoString -> Style
borderLeftWidth :: Text -> Style
borderLeftWidth Text
x = Text
"border-left-width" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border
--
border :: MisoString -> Style
border :: Text -> Style
border Text
x = Text
"border" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-radius
--
borderRadius :: MisoString -> Style
borderRadius :: Text -> Style
borderRadius Text
x = Text
"border-radius" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-right-color
--
borderRightColor :: Color -> Style
borderRightColor :: Color -> Style
borderRightColor Color
x = Text
"border-right-color" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Color -> Text
renderColor Color
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-right
--
borderRight :: MisoString -> Style
borderRight :: Text -> Style
borderRight Text
x = Text
"border-right" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-right-style
--
borderRightStyle :: MisoString -> Style
borderRightStyle :: Text -> Style
borderRightStyle Text
x = Text
"border-right-style" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-right-width
--
borderRightWidth :: MisoString -> Style
borderRightWidth :: Text -> Style
borderRightWidth Text
x = Text
"border-right-width" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-start-end-radius
--
borderStartEndRadius :: MisoString -> Style
borderStartEndRadius :: Text -> Style
borderStartEndRadius Text
x = Text
"border-start-end-radius" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-start-start-radius
--
borderStartStartRadius :: MisoString -> Style
borderStartStartRadius :: Text -> Style
borderStartStartRadius Text
x = Text
"border-start-start-radius" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-style
--
borderStyle :: MisoString -> Style
borderStyle :: Text -> Style
borderStyle Text
x = Text
"border-style" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-color
--
borderTopColor :: Color -> Style
borderTopColor :: Color -> Style
borderTopColor Color
x = Text
"border-top-color" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Color -> Text
renderColor Color
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-left-radius
--
borderTopLeftRadius :: MisoString -> Style
borderTopLeftRadius :: Text -> Style
borderTopLeftRadius Text
x = Text
"border-top-left-radius" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-top
--
borderTop :: MisoString -> Style
borderTop :: Text -> Style
borderTop Text
x = Text
"border-top" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-right-radius
--
borderTopRightRadius :: MisoString -> Style
borderTopRightRadius :: Text -> Style
borderTopRightRadius Text
x = Text
"border-top-right-radius" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-style
--
borderTopStyle :: MisoString -> Style
borderTopStyle :: Text -> Style
borderTopStyle Text
x = Text
"border-top-style" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-width
--
borderTopWidth :: MisoString -> Style
borderTopWidth :: Text -> Style
borderTopWidth Text
x = Text
"border-top-width" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/border-width
--
borderWidth :: MisoString -> Style
borderWidth :: Text -> Style
borderWidth Text
x = Text
"border-width" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/bottom
--
bottom :: MisoString -> Style
bottom :: Text -> Style
bottom Text
x = Text
"bottom" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow
--
boxShadow :: MisoString -> Style
boxShadow :: Text -> Style
boxShadow Text
x = Text
"box-shadow" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/box-sizing
--
boxSizing :: MisoString -> Style
boxSizing :: Text -> Style
boxSizing Text
x = Text
"box-sizing" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/clip-path
--
clipPath :: MisoString -> Style
clipPath :: Text -> Style
clipPath Text
x = Text
"clip-path" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/accent-color
--
accentColor :: Color -> Style
accentColor :: Color -> Style
accentColor Color
x = Text
"accent-color" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Color -> Text
renderColor Color
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/appearance
--
appearance :: MisoString -> Style
appearance :: Text -> Style
appearance Text
x = Text
"appearance" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter
--
backdropFilter :: MisoString -> Style
backdropFilter :: Text -> Style
backdropFilter Text
x = Text
"backdrop-filter" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/caret-color
--
caretColor :: Color -> Style
caretColor :: Color -> Style
caretColor Color
x = Text
"caret-color" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Color -> Text
renderColor Color
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/color
--
color :: Color -> Style
color :: Color -> Style
color Color
x = Text
"color" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Color -> Text
renderColor Color
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/column-gap
--
columnGap :: MisoString -> Style
columnGap :: Text -> Style
columnGap Text
x = Text
"column-gap" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/direction
--
direction :: MisoString -> Style
direction :: Text -> Style
direction Text
x = Text
"direction" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/display
--
display :: MisoString -> Style
display :: Text -> Style
display Text
x = Text
"display" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | SVG [fill](https://developer.mozilla.org/en-US/docs/Web/CSS/fill) color.
--
-- > fill red
--
fill :: Color -> Style
fill :: Color -> Style
fill Color
x = Text
"fill" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Color -> Text
renderColor Color
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/filter
--
filter :: MisoString -> Style
filter :: Text -> Style
filter Text
x = Text
"filter" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/flex-basis
--
flexBasis :: MisoString -> Style
flexBasis :: Text -> Style
flexBasis Text
x = Text
"flex-basis" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/flex-direction
--
flexDirection :: MisoString -> Style
flexDirection :: Text -> Style
flexDirection Text
x = Text
"flex-direction" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/flex-flow
--
flexFlow :: MisoString -> Style
flexFlow :: Text -> Style
flexFlow Text
x = Text
"flex-flow" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/flex-grow
--
flexGrow :: Double -> Style
flexGrow :: Double -> Style
flexGrow Double
x = Text
"flex-grow" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/flex
--
flex :: MisoString -> Style
flex :: Text -> Style
flex Text
x = Text
"flex" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/flex-shrink
--
flexShrink :: Double -> Style
flexShrink :: Double -> Style
flexShrink Double
x = Text
"flex-shrink" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/flex-wrap
--
flexWrap :: MisoString -> Style
flexWrap :: Text -> Style
flexWrap Text
x = Text
"flex-wrap" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/font-family
--
fontFamily :: MisoString -> Style
fontFamily :: Text -> Style
fontFamily Text
x = Text
"font-family" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/font-size
--
fontSize :: MisoString -> Style
fontSize :: Text -> Style
fontSize Text
x = Text
"font-size" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/font-stretch
--
fontStretch :: MisoString -> Style
fontStretch :: Text -> Style
fontStretch Text
x = Text
"font-stretch" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/font-style
--
fontStyle :: MisoString -> Style
fontStyle :: Text -> Style
fontStyle Text
x = Text
"font-style" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant
--
fontVariant :: MisoString -> Style
fontVariant :: Text -> Style
fontVariant Text
x = Text
"font-variant" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight
--
fontWeight :: MisoString -> Style
fontWeight :: Text -> Style
fontWeight Text
x = Text
"font-weight" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/cursor
--
cursor :: MisoString -> Style
cursor :: Text -> Style
cursor Text
x = Text
"cursor" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/gap
--
gap :: MisoString -> Style
gap :: Text -> Style
gap Text
x = Text
"gap" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/grid-auto-columns
--
gridAutoColumns :: MisoString -> Style
gridAutoColumns :: Text -> Style
gridAutoColumns Text
x = Text
"grid-auto-columns" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/grid-auto-flow
--
gridAutoFlow :: MisoString -> Style
gridAutoFlow :: Text -> Style
gridAutoFlow Text
x = Text
"grid-auto-flow" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/grid-auto-rows
--
gridAutoRows :: MisoString -> Style
gridAutoRows :: Text -> Style
gridAutoRows Text
x = Text
"grid-auto-rows" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/grid-column
--
gridColumn :: MisoString -> Style
gridColumn :: Text -> Style
gridColumn Text
x = Text
"grid-column" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/grid-column-end
--
gridColumnEnd :: MisoString -> Style
gridColumnEnd :: Text -> Style
gridColumnEnd Text
x = Text
"grid-column-end" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/grid-column-span
--
gridColumnSpan :: MisoString -> Style
gridColumnSpan :: Text -> Style
gridColumnSpan Text
x = Text
"grid-column-span" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/grid-column-start
--
gridColumnStart :: MisoString -> Style
gridColumnStart :: Text -> Style
gridColumnStart Text
x = Text
"grid-column-start" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/grid-row
--
gridRow :: MisoString -> Style
gridRow :: Text -> Style
gridRow Text
x = Text
"grid-row" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/grid-row-end
--
gridRowEnd :: MisoString -> Style
gridRowEnd :: Text -> Style
gridRowEnd Text
x = Text
"grid-row-end" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/grid-row-span
--
gridRowSpan :: MisoString -> Style
gridRowSpan :: Text -> Style
gridRowSpan Text
x = Text
"grid-row-span" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/grid-row-start
--
gridRowStart :: MisoString -> Style
gridRowStart :: Text -> Style
gridRowStart Text
x = Text
"grid-row-start" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-columns
--
gridTemplateColumns :: MisoString -> Style
gridTemplateColumns :: Text -> Style
gridTemplateColumns Text
x = Text
"grid-template-columns" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-rows
--
gridTemplateRows :: MisoString -> Style
gridTemplateRows :: Text -> Style
gridTemplateRows Text
x = Text
"grid-template-rows" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/height
--
height :: MisoString -> Style
height :: Text -> Style
height Text
x = Text
"height" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/image-rendering
--
imageRendering :: MisoString -> Style
imageRendering :: Text -> Style
imageRendering Text
x = Text
"image-rendering" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/inset-inline-end
--
insetInlineEnd :: MisoString -> Style
insetInlineEnd :: Text -> Style
insetInlineEnd Text
x = Text
"inset-inline-end" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/inset-inline-start
--
insetInlineStart :: MisoString -> Style
insetInlineStart :: Text -> Style
insetInlineStart Text
x = Text
"inset-inline-start" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content
--
justifyContent :: MisoString -> Style
justifyContent :: Text -> Style
justifyContent Text
x = Text
"justify-content" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/justify-items
--
justifyItems :: MisoString -> Style
justifyItems :: Text -> Style
justifyItems Text
x = Text
"justify-items" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/justify-self
--
justifySelf :: MisoString -> Style
justifySelf :: Text -> Style
justifySelf Text
x = Text
"justify-self" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/left
--
left :: MisoString -> Style
left :: Text -> Style
left Text
x = Text
"left" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/letter-spacing
--
letterSpacing :: MisoString -> Style
letterSpacing :: Text -> Style
letterSpacing Text
x = Text
"letter-spacing" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/linear-cross-gravity
--
linearCrossGravity :: MisoString -> Style
linearCrossGravity :: Text -> Style
linearCrossGravity Text
x = Text
"linear-cross-gravity" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/linear-direction
--
linearDirection :: MisoString -> Style
linearDirection :: Text -> Style
linearDirection Text
x = Text
"linear-direction" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/linear-gravity
--
linearGravity :: MisoString -> Style
linearGravity :: Text -> Style
linearGravity Text
x = Text
"linear-gravity" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/linear-layout-gravity
--
linearLayoutGravity :: MisoString -> Style
linearLayoutGravity :: Text -> Style
linearLayoutGravity Text
x = Text
"linear-layout-gravity" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/linear-weight
--
linearWeight :: MisoString -> Style
linearWeight :: Text -> Style
linearWeight Text
x = Text
"linear-weight" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/linear-weight-sum
--
linearWeightSum :: MisoString -> Style
linearWeightSum :: Text -> Style
linearWeightSum Text
x = Text
"linear-weight-sum" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/line-height
--
lineHeight :: MisoString -> Style
lineHeight :: Text -> Style
lineHeight Text
x = Text
"line-height" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/margin-bottom
--
marginBottom :: MisoString -> Style
marginBottom :: Text -> Style
marginBottom Text
x = Text
"margin-bottom" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/margin-inline-end
--
marginInlineEnd :: MisoString -> Style
marginInlineEnd :: Text -> Style
marginInlineEnd Text
x = Text
"margin-inline-end" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/margin-inline-start
--
marginInlineStart :: MisoString -> Style
marginInlineStart :: Text -> Style
marginInlineStart Text
x = Text
"margin-inline-start" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/margin-left
--
marginLeft :: MisoString -> Style
marginLeft :: Text -> Style
marginLeft Text
x = Text
"margin-left" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/margin
--
margin :: MisoString -> Style
margin :: Text -> Style
margin Text
x = Text
"margin" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/margin-right
--
marginRight :: MisoString -> Style
marginRight :: Text -> Style
marginRight Text
x = Text
"margin-right" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/margin-top
--
marginTop :: MisoString -> Style
marginTop :: Text -> Style
marginTop Text
x = Text
"margin-top" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/mask-image
--
maskImage :: MisoString -> Style
maskImage :: Text -> Style
maskImage Text
x = Text
"mask-image" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/mask
--
mask :: MisoString -> Style
mask :: Text -> Style
mask Text
x = Text
"mask" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/max-height
--
maxHeight :: MisoString -> Style
maxHeight :: Text -> Style
maxHeight Text
x = Text
"max-height" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/max-width
--
maxWidth :: MisoString -> Style
maxWidth :: Text -> Style
maxWidth Text
x = Text
"max-width" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/min-height
--
minHeight :: MisoString -> Style
minHeight :: Text -> Style
minHeight Text
x = Text
"min-height" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/min-width
--
minWidth :: MisoString -> Style
minWidth :: Text -> Style
minWidth Text
x = Text
"min-width" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/mix-blend-mode
--
mixBlendMode :: MisoString -> Style
mixBlendMode :: Text -> Style
mixBlendMode Text
x = Text
"mix-blend-mode" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit
--
objectFit :: MisoString -> Style
objectFit :: Text -> Style
objectFit Text
x = Text
"object-fit" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/object-position
--
objectPosition :: MisoString -> Style
objectPosition :: Text -> Style
objectPosition Text
x = Text
"object-position" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/opacity
--
opacity :: Double -> Style
opacity :: Double -> Style
opacity Double
x = Text
"opacity" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/order
--
order :: Int -> Style
order :: Int -> Style
order Int
x = Text
"order" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Int -> Text
forall str. ToMisoString str => str -> Text
MS.ms Int
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/outline
--
outline :: MisoString -> Style
outline :: Text -> Style
outline Text
x = Text
"outline" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/outline-color
--
outlineColor :: Color -> Style
outlineColor :: Color -> Style
outlineColor Color
x = Text
"outline-color" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Color -> Text
renderColor Color
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/outline-offset
--
outlineOffset :: MisoString -> Style
outlineOffset :: Text -> Style
outlineOffset Text
x = Text
"outline-offset" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/outline-style
--
outlineStyle :: MisoString -> Style
outlineStyle :: Text -> Style
outlineStyle Text
x = Text
"outline-style" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/outline-width
--
outlineWidth :: MisoString -> Style
outlineWidth :: Text -> Style
outlineWidth Text
x = Text
"outline-width" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/overflow
--
overflow :: MisoString -> Style
overflow :: Text -> Style
overflow Text
x = Text
"overflow" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/overflow-x
--
overflowX :: MisoString -> Style
overflowX :: Text -> Style
overflowX Text
x = Text
"overflow-x" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/overflow-y
--
overflowY :: MisoString -> Style
overflowY :: Text -> Style
overflowY Text
x = Text
"overflow-y" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/overscroll-behavior
--
overscrollBehavior :: MisoString -> Style
overscrollBehavior :: Text -> Style
overscrollBehavior Text
x = Text
"overscroll-behavior" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/padding-bottom
--
paddingBottom :: MisoString -> Style
paddingBottom :: Text -> Style
paddingBottom Text
x = Text
"padding-bottom" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/padding-inline-end
--
paddingInlineEnd :: MisoString -> Style
paddingInlineEnd :: Text -> Style
paddingInlineEnd Text
x = Text
"padding-inline-end" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/padding-inline-start
--
paddingInlineStart :: MisoString -> Style
paddingInlineStart :: Text -> Style
paddingInlineStart Text
x = Text
"padding-inline-start" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/padding-left
--
paddingLeft :: MisoString -> Style
paddingLeft :: Text -> Style
paddingLeft Text
x = Text
"padding-left" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/padding
--
padding :: MisoString -> Style
padding :: Text -> Style
padding Text
x = Text
"padding" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/padding-right
--
paddingRight :: MisoString -> Style
paddingRight :: Text -> Style
paddingRight Text
x = Text
"padding-right" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/padding-top
--
paddingTop :: MisoString -> Style
paddingTop :: Text -> Style
paddingTop Text
x = Text
"padding-top" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/perspective
--
perspective :: MisoString -> Style
perspective :: Text -> Style
perspective Text
x = Text
"perspective" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/pointer-events
--
pointerEvents :: MisoString -> Style
pointerEvents :: Text -> Style
pointerEvents Text
x = Text
"pointer-events" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/position
--
position :: MisoString -> Style
position :: Text -> Style
position Text
x = Text
"position" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/relative-align-bottom
--
relativeAlignBottom :: MisoString -> Style
relativeAlignBottom :: Text -> Style
relativeAlignBottom Text
x = Text
"relative-align-bottom" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/relative-align-inline-end
--
relativeAlignInlineEnd :: MisoString -> Style
relativeAlignInlineEnd :: Text -> Style
relativeAlignInlineEnd Text
x = Text
"relative-align-inline-end" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/relative-align-inline-start
--
relativeAlignInlineStart :: MisoString -> Style
relativeAlignInlineStart :: Text -> Style
relativeAlignInlineStart Text
x = Text
"relative-align-inline-start" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/relative-align-left
--
relativeAlignLeft :: MisoString -> Style
relativeAlignLeft :: Text -> Style
relativeAlignLeft Text
x = Text
"relative-align-left" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/relative-align-right
--
relativeAlignRight :: MisoString -> Style
relativeAlignRight :: Text -> Style
relativeAlignRight Text
x = Text
"relative-align-right" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/relative-align-top
--
relativeAlignTop :: MisoString -> Style
relativeAlignTop :: Text -> Style
relativeAlignTop Text
x = Text
"relative-align-top" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/relative-bottom-of
--
relativeBottomOf :: MisoString -> Style
relativeBottomOf :: Text -> Style
relativeBottomOf Text
x = Text
"relative-bottom-of" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/relative-center
--
relativeCenter :: MisoString -> Style
relativeCenter :: Text -> Style
relativeCenter Text
x = Text
"relative-center" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/relative-id
--
relativeId :: MisoString -> Style
relativeId :: Text -> Style
relativeId Text
x = Text
"relative-id" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/relative-inline-end-of
--
relativeInlineEndOf :: MisoString -> Style
relativeInlineEndOf :: Text -> Style
relativeInlineEndOf Text
x = Text
"relative-inline-end-of" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/relative-inline-start-of
--
relativeInlineStartOf :: MisoString -> Style
relativeInlineStartOf :: Text -> Style
relativeInlineStartOf Text
x = Text
"relative-inline-start-of" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/relative-layout-once
--
relativeLayoutOnce :: MisoString -> Style
relativeLayoutOnce :: Text -> Style
relativeLayoutOnce Text
x = Text
"relative-layout-once" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/relative-left-of
--
relativeLeftOf :: MisoString -> Style
relativeLeftOf :: Text -> Style
relativeLeftOf Text
x = Text
"relative-left-of" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/relative-right-of
--
relativeRightOf :: MisoString -> Style
relativeRightOf :: Text -> Style
relativeRightOf Text
x = Text
"relative-right-of" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/relative-top-of
--
relativeTopOf :: MisoString -> Style
relativeTopOf :: Text -> Style
relativeTopOf Text
x = Text
"relative-top-of" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/resize
--
resize :: MisoString -> Style
resize :: Text -> Style
resize Text
x = Text
"resize" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/right
--
right :: MisoString -> Style
right :: Text -> Style
right Text
x = Text
"right" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/row-gap
--
rowGap :: MisoString -> Style
rowGap :: Text -> Style
rowGap Text
x = Text
"row-gap" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-behavior
--
scrollBehavior :: MisoString -> Style
scrollBehavior :: Text -> Style
scrollBehavior Text
x = Text
"scroll-behavior" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | SVG [stroke](https://developer.mozilla.org/en-US/docs/Web/CSS/stroke) color.
--
-- > stroke black
--
stroke :: Color -> Style
stroke :: Color -> Style
stroke Color
x = Text
"stroke" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Color -> Text
renderColor Color
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/stroke-width
--
strokeWidth :: MisoString -> Style
strokeWidth :: Text -> Style
strokeWidth Text
x = Text
"stroke-width" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/text-align
--
textAlign :: MisoString -> Style
textAlign :: Text -> Style
textAlign Text
x = Text
"text-align" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/text-decoration
--
textDecoration :: MisoString -> Style
textDecoration :: Text -> Style
textDecoration Text
x = Text
"text-decoration" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/text-indent
--
textIndent :: MisoString -> Style
textIndent :: Text -> Style
textIndent Text
x = Text
"text-indent" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/text-overflow
--
textOverflow :: MisoString -> Style
textOverflow :: Text -> Style
textOverflow Text
x = Text
"text-overflow" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/text-shadow
--
textShadow :: MisoString -> Style
textShadow :: Text -> Style
textShadow Text
x = Text
"text-shadow" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/text-stroke-color
--
textStrokeColor :: Color -> Style
textStrokeColor :: Color -> Style
textStrokeColor Color
x = Text
"text-stroke-color" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Color -> Text
renderColor Color
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/text-stroke
--
textStroke :: MisoString -> Style
textStroke :: Text -> Style
textStroke Text
x = Text
"text-stroke" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/text-stroke-width
--
textStrokeWidth :: MisoString -> Style
textStrokeWidth :: Text -> Style
textStrokeWidth Text
x = Text
"text-stroke-width" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/text-transform
--
textTransform :: MisoString -> Style
textTransform :: Text -> Style
textTransform Text
x = Text
"text-transform" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/top
--
top :: MisoString -> Style
top :: Text -> Style
top Text
x = Text
"top" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/transform
--
transform :: MisoString -> Style
transform :: Text -> Style
transform Text
x = Text
"transform" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | Apply a list of t'TransformFn' values as a @transform@ style.
--
-- @
-- transforms [ translate (px 10) (pct 50), rotate (deg 45), scaleX 1.5 ]
-- @
--
transforms :: [TransformFn] -> Style
transforms :: [TransformFn] -> Style
transforms [TransformFn]
fns = Text
"transform" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text -> [Text] -> Text
MS.intercalate Text
" " ((TransformFn -> Text) -> [TransformFn] -> [Text]
forall a b. (a -> b) -> [a] -> [b]
map TransformFn -> Text
renderTransformFn [TransformFn]
fns)
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/transform-origin
--
transformOrigin :: MisoString -> Style
transformOrigin :: Text -> Style
transformOrigin Text
x = Text
"transform-origin" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/translate
--
-- >>> renderTransformFn (translate (px 10) (pct 50))
-- "translate(10px,50.0%)"
--
translate :: MisoString -> MisoString -> TransformFn
translate :: Text -> Text -> TransformFn
translate Text
x Text
y = Text -> TransformFn
TransformFn (Text -> TransformFn) -> Text -> TransformFn
forall a b. (a -> b) -> a -> b
$ Text
"translate(" Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
x Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
"," Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
y Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")"
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/translateX
--
translateX :: MisoString -> TransformFn
translateX :: Text -> TransformFn
translateX Text
x = Text -> TransformFn
TransformFn (Text -> TransformFn) -> Text -> TransformFn
forall a b. (a -> b) -> a -> b
$ Text
"translateX(" Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
x Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")"
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/translateY
--
translateY :: MisoString -> TransformFn
translateY :: Text -> TransformFn
translateY Text
y = Text -> TransformFn
TransformFn (Text -> TransformFn) -> Text -> TransformFn
forall a b. (a -> b) -> a -> b
$ Text
"translateY(" Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
y Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")"
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/translateZ
--
translateZ :: MisoString -> TransformFn
translateZ :: Text -> TransformFn
translateZ Text
z = Text -> TransformFn
TransformFn (Text -> TransformFn) -> Text -> TransformFn
forall a b. (a -> b) -> a -> b
$ Text
"translateZ(" Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
z Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")"
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/translate3d
--
translate3d :: MisoString -> MisoString -> MisoString -> TransformFn
translate3d :: Text -> Text -> Text -> TransformFn
translate3d Text
x Text
y Text
z = Text -> TransformFn
TransformFn (Text -> TransformFn) -> Text -> TransformFn
forall a b. (a -> b) -> a -> b
$ Text
"translate3d(" Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text -> [Text] -> Text
MS.intercalate Text
"," [Text
x, Text
y, Text
z] Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")"
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/rotate
--
-- >>> renderTransformFn (rotate (deg 45))
-- "rotate(45.0deg)"
--
rotate :: MisoString -> TransformFn
rotate :: Text -> TransformFn
rotate Text
a = Text -> TransformFn
TransformFn (Text -> TransformFn) -> Text -> TransformFn
forall a b. (a -> b) -> a -> b
$ Text
"rotate(" Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
a Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")"
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/rotateX
--
rotateX :: MisoString -> TransformFn
rotateX :: Text -> TransformFn
rotateX Text
a = Text -> TransformFn
TransformFn (Text -> TransformFn) -> Text -> TransformFn
forall a b. (a -> b) -> a -> b
$ Text
"rotateX(" Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
a Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")"
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/rotateY
--
rotateY :: MisoString -> TransformFn
rotateY :: Text -> TransformFn
rotateY Text
a = Text -> TransformFn
TransformFn (Text -> TransformFn) -> Text -> TransformFn
forall a b. (a -> b) -> a -> b
$ Text
"rotateY(" Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
a Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")"
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/rotateZ
--
rotateZ :: MisoString -> TransformFn
rotateZ :: Text -> TransformFn
rotateZ Text
a = Text -> TransformFn
TransformFn (Text -> TransformFn) -> Text -> TransformFn
forall a b. (a -> b) -> a -> b
$ Text
"rotateZ(" Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
a Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")"
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/rotate3d
-- x, y, z are unitless direction vector components; angle uses a unit constructor like 'deg'.
--
rotate3d :: Double -> Double -> Double -> MisoString -> TransformFn
rotate3d :: Double -> Double -> Double -> Text -> TransformFn
rotate3d Double
x Double
y Double
z Text
a = Text -> TransformFn
TransformFn (Text -> TransformFn) -> Text -> TransformFn
forall a b. (a -> b) -> a -> b
$ Text
"rotate3d(" Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text -> [Text] -> Text
MS.intercalate Text
"," [Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
x, Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
y, Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
z, Text
a] Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")"
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/scale
-- Uniform scale on both axes.
--
-- >>> renderTransformFn (scale 1.5)
-- "scale(1.5)"
--
scale :: Double -> TransformFn
scale :: Double -> TransformFn
scale Double
n = Text -> TransformFn
TransformFn (Text -> TransformFn) -> Text -> TransformFn
forall a b. (a -> b) -> a -> b
$ Text
"scale(" Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
n Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")"
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/scale
-- Non-uniform scale: separate X and Y factors.
--
scaleXY :: Double -> Double -> TransformFn
scaleXY :: Double -> Double -> TransformFn
scaleXY Double
x Double
y = Text -> TransformFn
TransformFn (Text -> TransformFn) -> Text -> TransformFn
forall a b. (a -> b) -> a -> b
$ Text
"scale(" Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
x Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
"," Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
y Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")"
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/scale3d
--
scale3d :: Double -> Double -> Double -> TransformFn
scale3d :: Double -> Double -> Double -> TransformFn
scale3d Double
x Double
y Double
z = Text -> TransformFn
TransformFn (Text -> TransformFn) -> Text -> TransformFn
forall a b. (a -> b) -> a -> b
$ Text
"scale3d(" Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text -> [Text] -> Text
MS.intercalate Text
"," [Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
x, Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
y, Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
z] Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")"
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/scaleX
--
scaleX :: Double -> TransformFn
scaleX :: Double -> TransformFn
scaleX Double
n = Text -> TransformFn
TransformFn (Text -> TransformFn) -> Text -> TransformFn
forall a b. (a -> b) -> a -> b
$ Text
"scaleX(" Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
n Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")"
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/scaleY
--
scaleY :: Double -> TransformFn
scaleY :: Double -> TransformFn
scaleY Double
n = Text -> TransformFn
TransformFn (Text -> TransformFn) -> Text -> TransformFn
forall a b. (a -> b) -> a -> b
$ Text
"scaleY(" Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
n Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")"
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/scaleZ
--
scaleZ :: Double -> TransformFn
scaleZ :: Double -> TransformFn
scaleZ Double
n = Text -> TransformFn
TransformFn (Text -> TransformFn) -> Text -> TransformFn
forall a b. (a -> b) -> a -> b
$ Text
"scaleZ(" Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
n Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")"
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/perspective
-- The @perspective()@ transform function, distinct from the @perspective@ CSS property.
--
-- >>> renderTransformFn (perspectiveFn (px 500))
-- "perspective(500px)"
--
perspectiveFn :: MisoString -> TransformFn
perspectiveFn :: Text -> TransformFn
perspectiveFn Text
d = Text -> TransformFn
TransformFn (Text -> TransformFn) -> Text -> TransformFn
forall a b. (a -> b) -> a -> b
$ Text
"perspective(" Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
d Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")"
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/matrix3d
-- 4x4 homogeneous matrix in column-major order; each tuple is one column.
--
-- > matrix3d (1,0,0,0) (0,1,0,0) (0,0,1,0) (10,20,0,1)
--
matrix3d
  :: (Double, Double, Double, Double)
  -> (Double, Double, Double, Double)
  -> (Double, Double, Double, Double)
  -> (Double, Double, Double, Double)
  -> TransformFn
matrix3d :: (Double, Double, Double, Double)
-> (Double, Double, Double, Double)
-> (Double, Double, Double, Double)
-> (Double, Double, Double, Double)
-> TransformFn
matrix3d (Double
a1,Double
b1,Double
c1,Double
d1) (Double
a2,Double
b2,Double
c2,Double
d2) (Double
a3,Double
b3,Double
c3,Double
d3) (Double
a4,Double
b4,Double
c4,Double
d4) =
  Text -> TransformFn
TransformFn (Text -> TransformFn) -> Text -> TransformFn
forall a b. (a -> b) -> a -> b
$ Text
"matrix3d(" Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
values Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")"
  where
    values :: Text
values = Text -> [Text] -> Text
MS.intercalate Text
","
      [ Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
a1, Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
b1, Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
c1, Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
d1
      , Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
a2, Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
b2, Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
c2, Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
d2
      , Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
a3, Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
b3, Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
c3, Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
d3
      , Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
a4, Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
b4, Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
c4, Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms Double
d4
      ]
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/skew
--
skew :: MisoString -> MisoString -> TransformFn
skew :: Text -> Text -> TransformFn
skew Text
x Text
y = Text -> TransformFn
TransformFn (Text -> TransformFn) -> Text -> TransformFn
forall a b. (a -> b) -> a -> b
$ Text
"skew(" Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
x Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
"," Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
y Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")"
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/skewX
--
skewX :: MisoString -> TransformFn
skewX :: Text -> TransformFn
skewX Text
a = Text -> TransformFn
TransformFn (Text -> TransformFn) -> Text -> TransformFn
forall a b. (a -> b) -> a -> b
$ Text
"skewX(" Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
a Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")"
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/skewY
--
skewY :: MisoString -> TransformFn
skewY :: Text -> TransformFn
skewY Text
a = Text -> TransformFn
TransformFn (Text -> TransformFn) -> Text -> TransformFn
forall a b. (a -> b) -> a -> b
$ Text
"skewY(" Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
a Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")"
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/transition-delay
--
transitionDelay :: MisoString -> Style
transitionDelay :: Text -> Style
transitionDelay Text
x = Text
"transition-delay" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/transition-duration
--
transitionDuration :: MisoString -> Style
transitionDuration :: Text -> Style
transitionDuration Text
x = Text
"transition-duration" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/transition
--
transition :: MisoString -> Style
transition :: Text -> Style
transition Text
x = Text
"transition" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | Single-property @transition@ shorthand: @property@, @duration@, and
-- @timing-function@ combined into one @transition@ 'Style' — i.e. __one__ inline
-- key, not the three @transition-*@ longhands.
--
-- Prefer this whenever the tween is also reset imperatively elsewhere (e.g.
-- @transition: none@ on the main thread, see "Miso.Native.MainThread"): the reset
-- lands on the @transition@ key, and separate longhands would survive it.
--
-- >>> transition_ "transform" (s 0.3) (cubicBezier 0.22 1 0.36 1)
-- ("transition","transform 0.3s cubic-bezier(0.22,1,0.36,1)")
--
-- @since 1.13.0.0
transition_ :: MisoString -> MisoString -> MisoString -> Style
transition_ :: Text -> Text -> Text -> Style
transition_ Text
property Text
duration Text
timing =
  Text
"transition" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: (Text
property Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
" " Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
duration Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
" " Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
timing)
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/transition-property
--
transitionProperty :: MisoString -> Style
transitionProperty :: Text -> Style
transitionProperty Text
x = Text
"transition-property" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/transition-timing-function
--
transitionTimingFunction :: MisoString -> Style
transitionTimingFunction :: Text -> Style
transitionTimingFunction Text
x = Text
"transition-timing-function" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | A @cubic-bezier()@ easing value, for use with 'transition',
-- 'transitionTimingFunction', or an animation's timing function. Unlike the
-- @translate@\/@rotate@\/… helpers this is a /timing/ function, not a
-- t'TransformFn', so it produces a bare 'MisoString' value.
--
-- >>> cubicBezier 0.22 1 0.36 1
-- "cubic-bezier(0.22,1,0.36,1)"
--
-- @since 1.13.0.0
cubicBezier :: Double -> Double -> Double -> Double -> MisoString
cubicBezier :: Double -> Double -> Double -> Double -> Text
cubicBezier Double
a Double
b Double
c Double
d =
  Text
"cubic-bezier(" Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text -> [Text] -> Text
MS.intercalate Text
"," ((Double -> Text) -> [Double] -> [Text]
forall a b. (a -> b) -> [a] -> [b]
map Double -> Text
forall str. ToMisoString str => str -> Text
MS.ms [Double
a, Double
b, Double
c, Double
d]) Text -> Text -> Text
forall a. Semigroup a => a -> a -> a
<> Text
")"
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/user-select
--
userSelect :: MisoString -> Style
userSelect :: Text -> Style
userSelect Text
x = Text
"user-select" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/vertical-align
--
verticalAlign :: MisoString -> Style
verticalAlign :: Text -> Style
verticalAlign Text
x = Text
"vertical-align" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/visibility
--
visibility :: MisoString -> Style
visibility :: Text -> Style
visibility Text
x = Text
"visibility" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/white-space
--
whiteSpace :: MisoString -> Style
whiteSpace :: Text -> Style
whiteSpace Text
x = Text
"white-space" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/width
--
width :: MisoString -> Style
width :: Text -> Style
width Text
x = Text
"width" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/will-change
--
willChange :: MisoString -> Style
willChange :: Text -> Style
willChange Text
x = Text
"will-change" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/word-break
--
wordBreak :: MisoString -> Style
wordBreak :: Text -> Style
wordBreak Text
x = Text
"word-break" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/xAutoFontSize
--
xAutoFontSize :: MisoString -> Style
xAutoFontSize :: Text -> Style
xAutoFontSize Text
x = Text
"-x-auto-font-size" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/xAutoFontSizePresetSizes
--
xAutoFontSizePresetSizes :: MisoString -> Style
xAutoFontSizePresetSizes :: Text -> Style
xAutoFontSizePresetSizes Text
x = Text
"-x-auto-font-size-preset-sizes" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/xHandleColor
--
xHandleColor :: Color -> Style
xHandleColor :: Color -> Style
xHandleColor Color
x = Text
"-x-handle-color" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Color -> Text
renderColor Color
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/xHandleSize
--
xHandleSize :: MisoString -> Style
xHandleSize :: Text -> Style
xHandleSize Text
x = Text
"-x-handle-size" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Text
x
-----------------------------------------------------------------------------
-- | https://developer.mozilla.org/en-US/docs/Web/CSS/z-index
--
zIndex :: Int -> Style
zIndex :: Int -> Style
zIndex Int
x = Text
"z-index" Text -> Text -> Style
forall k v. k -> v -> (k, v)
=: Int -> Text
forall str. ToMisoString str => str -> Text
MS.ms Int
x
-----------------------------------------------------------------------------