{-
   - This file is part of `typers`.
   -
   - `typers` is free software: you can redistribute it and/or modify
   - it under the terms of the GNU Affero Public License as published by
   - the Free Software Foundation, either version 3 of the License, or
   - (at your option) any later version.
   -
   - `typers` is distributed in the hope that it will be useful,
   - but WITHOUT ANY WARRANTY; without even the implied warranty of
   - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
   - GNU Affero Public License for more details.
   -
   - You should have received a copy of the GNU Affero Public License
   - along with `typers`.  If not, see <https://www.gnu.org/licenses/>.
-}


module Styles exposing (..)

import Base exposing (WordStatus(..))
import Css exposing (..)
import Css.Global exposing (global, selector)
import Html
import Html.Styled exposing (..)


styledButton : List (Attribute msg) -> List (Html msg) -> Html msg
styledButton =
    styled
        button
        [ marginTop (px 12)
        , marginBottom (px 12)
        , paddingTop (px 12)
        , paddingBottom (px 12)
        , paddingLeft (px 0)
        , paddingRight (px 0)
        , border (px 0)
        , backgroundColor (hex "#fff")
        , borderRadius (px 4)
        ]


correctInputStyle : Style
correctInputStyle =
    color (hex "#000")


wrongInputStyle : Style
wrongInputStyle =
    wrongWordStyle


styledInput : Bool -> List (Attribute msg) -> List (Html msg) -> Html msg
styledInput inputStatus =
    styled
        input
        [ fontFamily monospace
        , if inputStatus then
            correctInputStyle

          else
            wrongInputStyle
        , border zero
        , paddingTop (px 12)
        , paddingBottom (px 12)
        , width (pct 95)
        ]


styledListItem : List (Attribute msg) -> List (Html msg) -> Html msg
styledListItem =
    styled
        li
        [ display inline
        ]


styledUnorderedList : List (Attribute msg) -> List (Html msg) -> Html msg
styledUnorderedList =
    styled
        ul
        [ listStyle Css.none
        , padding (px 0)
        ]


styledExternalLink : List (Attribute msg) -> List (Html msg) -> Html msg
styledExternalLink =
    styled
        a
        [ textDecoration underline
        , color (hex "#666")
        ]


styledTextBox : List (Attribute msg) -> List (Html msg) -> Html msg
styledTextBox =
    styled
        div
        [ color (hex "#000")
        , fontFamily monospace
        , border (px 0)
        , borderRadius (px 4)
        , paddingTop (px 12)
        , paddingBottom (px 12)
        , display inlineBlock
        ]


actionContainer : List (Attribute msg) -> List (Html msg) -> Html msg
actionContainer =
    styled
        div
        [ padding (px 12)
        , width (pct 100)
        ]


wrongWordStyle : Style
wrongWordStyle =
    color (hex "#f07178")


correctWordStyle : Style
correctWordStyle =
    color (hex "#13CA91")


todoWordStyle : Style
todoWordStyle =
    color (hex "#787878")


currentWordStyle : Style
currentWordStyle =
    textDecoration underline


wordStyle : WordStatus -> Style
wordStyle w =
    case w of
        Correct ->
            correctWordStyle

        Wrong ->
            wrongWordStyle

        Todo ->
            todoWordStyle

        CurrentWord ->
            currentWordStyle