blob: a4917529392ab4e67daa9a69989e10ba9c0aba4f (
plain) (
blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
|
module FlashCard exposing (render)
import Html exposing (..)
import Html.Attributes exposing (..)
import Html.Events exposing (..)
import Responsive
import State
import Tailwind
import Theory
render :
{ chord : Theory.Chord
, visible : Bool
}
-> Html State.Msg
render { chord, visible } =
let
classes =
[ "bg-white"
, "fixed"
, "top-0"
, "left-0"
, "z-30"
, "w-screen"
, "h-screen"
, Tailwind.if_ visible "opacity-100" "opacity-0"
]
in
button
[ classes |> Tailwind.use |> class ]
[ h1
[ [ "text-center"
, "transform"
, "-rotate-90"
, Responsive.h1
]
|> Tailwind.use
|> class
]
[ text (Theory.viewChord chord) ]
]
|
