{-# LANGUAGE OverloadedStrings #-}

module Design.SignIn
  ( signInDesign
  ) where

import Clay

import Design.Color as C
import Design.Helper

signInDesign :: Css
signInDesign =

  ".signIn" ? do

    form ? do
      let inputHeight = 50
      width (px 500)
      marginTop (px 100)
      marginLeft auto
      marginRight auto

      input ? do
        defaultInput inputHeight
        display block
        width (pct 100)
        marginBottom (px 10)

      button ? do
        defaultButton C.red C.white (px inputHeight)
        display block
        width (pct 100)

    ".result" ? do
      marginTop (px 40)
      textAlign (alignSide sideCenter)
      ".success" ? color C.greenSuccess
      ".error" ? color C.redError