Highlight current page in header

1 files changed, 18 insertions, 8 deletions

diff --git a/src/client/elm/View/Header.elm b/src/client/elm/View/Header.elm
index 7a6fefc..2edde27 100644
--- a/src/client/elm/View/Header.elm
+++ b/src/client/elm/View/Header.elm
@@ -5,6 +5,8 @@ module View.Header
 import Signal exposing (Address)
 import Dict
 
+import TransitRouter
+
 import Route exposing (..)
 
 import Html exposing (..)
@@ -21,18 +23,26 @@ import View.Click exposing (clickTo)
 
 renderHeader : Address Action -> Model -> Html
 renderHeader address model =
-  let item route name additionalClasses =
+  let item = specialItem True ""
+      specialItem showCurrent additionalClasses route name =
         a
-          ([ class ("item " ++ additionalClasses) ] ++ clickTo route)
-          [ text (getMessage name model.translations) ]
+          ( [ classList
+              [ ("item", True)
+              , (additionalClasses, True)
+              , ("current", showCurrent && TransitRouter.getRoute model == route)
+              ]
+            ] ++ clickTo route
+          )
+          [ text (getMessage name model.translations)
+          ]
   in
       header
         []
-        ( [item Home "SharedCost" "title"] ++
-          case model.view of
+        ( case model.view of
             LoggedInView { me, users } ->
-              [ item Income "Income" ""
-              , item Stat "Statistics" ""
+              [ specialItem True "title" Home "SharedCost"
+              , item Income "Income"
+              , item Stat "Statistics"
               , button
                   [ class "signOut item"
                   , onClick address SignOut
@@ -47,5 +57,5 @@ renderHeader address model =
                   ]
               ]
             _ ->
-              []
+              [specialItem False "title" Home "SharedCost"]
         )