From 8060fc370a8e16c7f39b1f63c6dc9127073eb5fe Mon Sep 17 00:00:00 2001 From: Joris Guyonvarch Date: Mon, 16 Mar 2015 21:59:06 +0100 Subject: Updating design --- design/design.css | 56 +++++++++++++++++++++-------------------------- src/Model/IdGenerator.elm | 2 +- src/Model/Model.elm | 5 ++--- src/Model/Timer.elm | 2 +- src/Update/Update.elm | 7 ++---- src/View/Timer.elm | 2 +- src/View/View.elm | 27 ++++++++--------------- 7 files changed, 41 insertions(+), 60 deletions(-) diff --git a/design/design.css b/design/design.css index a1a8ce7..5e737a0 100644 --- a/design/design.css +++ b/design/design.css @@ -1,43 +1,40 @@ h1 { - font-size: 50px; + font-size: 70px; padding: 20px; background-color: #111111; color: white; - letter-spacing: 8px; -} - -.addTimer { - background-color: #222222; - padding: 5px; - line-height: 30px; -} - -.addTimer > input { - border: 1px solid #111111; - padding: 5px; - height: 30px; + letter-spacing: 10px; + padding: 30px; + margin-bottom: 20px; } -.addTimer > button { - border: 1px solid #111111; - height: 30px; +button.addTimer { + position: absolute; + bottom: 10px; + left: 10px; + color: #33AA22; + border: 5px solid #33AA22; + background-color: white; + border-radius: 5px; + font-size: 50px; } .timers { - padding: 10px; + text-align: center; + font-size: 30px; } .timer { - line-height: 50px; - height: 50px; + line-height: 80px; + height: 80px; } .block { display: inline-block; background-color: #EEEEEE; text-align: center; - height: 50px; - margin-right: 5px; + height: 80px; + margin-right: 20px; border-radius: 2px; } @@ -46,27 +43,24 @@ h1 { } .timer > button.name { - width: 200px; + width: 300px; border: none; } .timer > .time { - width: 100px; -} - -.timer > button.restart { - border: none; + width: 200px; } -.timer > button.stop { +.timer > button { border: none; + width: 100px; + font-size: 30px; } .timer > button.remove { - border: none; color: #AA2222; } .timer:not(last-child) { - margin-bottom: 10px; + margin-bottom: 20px; } diff --git a/src/Model/IdGenerator.elm b/src/Model/IdGenerator.elm index 8bce44f..ba760d8 100644 --- a/src/Model/IdGenerator.elm +++ b/src/Model/IdGenerator.elm @@ -11,7 +11,7 @@ type alias IdGenerator = } initialIdGenerator = - { counter = 0 + { counter = 1 } getId : IdGenerator -> (Id, IdGenerator) diff --git a/src/Model/Model.elm b/src/Model/Model.elm index a3b4780..9a20219 100644 --- a/src/Model/Model.elm +++ b/src/Model/Model.elm @@ -14,7 +14,6 @@ import Model.IdGenerator (..) type alias Model = { currentTime : Time - , newTimerName : String , timers : Dict Id Timer , timerIdGenerator : IdGenerator } @@ -22,9 +21,9 @@ type alias Model = initialModel : Time -> Model initialModel initialTime = let (id, idGenerator) = getId initialIdGenerator + timerName = "Timer " ++ (toString id) in { currentTime = initialTime - , newTimerName = "" - , timers = Dict.insert id (initialTimer initialTime "Timer") Dict.empty + , timers = Dict.insert id (initialTimer initialTime timerName) Dict.empty , timerIdGenerator = idGenerator } diff --git a/src/Model/Timer.elm b/src/Model/Timer.elm index bfb734d..754a62a 100644 --- a/src/Model/Timer.elm +++ b/src/Model/Timer.elm @@ -23,7 +23,7 @@ initialTimer creationTime name = , name = name , initialTime = initialTime , currentTime = initTime initialTime - , isRunning = True + , isRunning = False } substractTimerTime : Time -> Timer -> Timer diff --git a/src/Update/Update.elm b/src/Update/Update.elm index 635e29d..aa31a84 100644 --- a/src/Update/Update.elm +++ b/src/Update/Update.elm @@ -18,7 +18,6 @@ import Update.UpdateTimer (..) type Action = NoOp - | RenameNewTimer String | AddNewTimer | DeltaTime Time | UpdateTimer Id TimerAction @@ -31,14 +30,12 @@ update : Action -> Model -> Model update action model = case action of NoOp -> model - RenameNewTimer name -> - { model | newTimerName <- name } AddNewTimer -> let (id, newTimerIdGenerator) = getId model.timerIdGenerator + timerName = "Timer " ++ (toString id) in { model - | timers <- Dict.insert id (initialTimer model.currentTime model.newTimerName) model.timers + | timers <- Dict.insert id (initialTimer model.currentTime timerName) model.timers , timerIdGenerator <- newTimerIdGenerator - , newTimerName <- "" } DeltaTime delta -> { model diff --git a/src/View/Timer.elm b/src/View/Timer.elm index 271de5c..5d34c7e 100644 --- a/src/View/Timer.elm +++ b/src/View/Timer.elm @@ -49,4 +49,4 @@ timeView time = let totalSeconds = truncate (time / 1000) totalMinutes = totalSeconds // 60 restSeconds = totalSeconds `rem` 60 - in (toString totalMinutes) ++ ":" ++ (String.padLeft 2 '0' (toString restSeconds)) + in (toString totalMinutes) ++ " : " ++ (String.padLeft 2 '0' (toString restSeconds)) diff --git a/src/View/View.elm b/src/View/View.elm index ae60807..2f12902 100644 --- a/src/View/View.elm +++ b/src/View/View.elm @@ -24,7 +24,7 @@ view model = div [] [ h1 [] [ text "Timer" ] - , addTimer model.newTimerName + , addTimer , model.timers |> Dict.toList |> List.sortBy (.creationTime << snd) @@ -32,24 +32,15 @@ view model = |> timers ] -addTimer : String -> Html -addTimer name = - div - [ class "addTimer" ] - [ input - [ placeholder "Name" - , value name - , on "input" targetValue (Signal.send updates << RenameNewTimer) - , onEnter (Signal.send updates AddNewTimer) - , autofocus True - ] +addTimer : Html +addTimer = + button + [ class "addTimer" + , onClick (Signal.send updates AddNewTimer) + ] + [ i + [ class "fa fa-fw fa-plus" ] [] - , button - [ onClick (Signal.send updates AddNewTimer) ] - [ i - [ class "fa fa-fw fa-plus" ] - [] - ] ] onEnter : Signal.Message -> Attribute -- cgit v1.2.3