From a8309988518af5bddf62d6a326d990fde4069b40 Mon Sep 17 00:00:00 2001 From: Joris Date: Sun, 3 Jan 2016 19:41:31 +0100 Subject: Set focus properties to button elements --- src/client/elm/Main.elm | 4 +- src/client/elm/Model/Action.elm | 4 +- src/client/elm/Model/Action/LoggedInAction.elm | 4 +- src/client/elm/Model/Communication.elm | 15 ------ src/client/elm/Server.elm | 65 ++++++++++++++++++++++++ src/client/elm/ServerCommunication.elm | 69 -------------------------- src/client/elm/Update.elm | 28 +++++++---- src/client/elm/Update/LoggedIn.elm | 17 +++++-- src/client/elm/View/Header.elm | 3 +- src/client/elm/View/LoggedIn/Account.elm | 3 +- src/client/elm/View/LoggedIn/AddPayment.elm | 5 +- src/client/elm/View/LoggedIn/Monthly.elm | 5 +- src/client/elm/View/LoggedIn/Table.elm | 3 +- src/client/elm/View/SignIn.elm | 2 +- src/server/Design/Color.hs | 5 +- src/server/Design/Constants.hs | 10 +++- src/server/Design/Global.hs | 2 + src/server/Design/Header.hs | 3 +- src/server/Design/Helper.hs | 20 ++++---- src/server/Design/LoggedIn/Add.hs | 13 ++++- src/server/Design/LoggedIn/Expandables.hs | 9 ++-- src/server/Design/LoggedIn/Pages.hs | 7 +-- src/server/Design/LoggedIn/Table.hs | 52 +++++++++++++++---- src/server/Design/SignIn.hs | 4 +- src/server/Model/Message/Translations.hs | 4 +- 25 files changed, 195 insertions(+), 161 deletions(-) delete mode 100644 src/client/elm/Model/Communication.elm create mode 100644 src/client/elm/Server.elm delete mode 100644 src/client/elm/ServerCommunication.elm (limited to 'src') diff --git a/src/client/elm/Main.elm b/src/client/elm/Main.elm index 34afa92..e8bbd54 100644 --- a/src/client/elm/Main.elm +++ b/src/client/elm/Main.elm @@ -20,7 +20,7 @@ import View exposing (view) import Persona as Persona exposing (operations) -import ServerCommunication exposing (initViewAction) +import Server main : Signal Html main = app.html @@ -29,7 +29,7 @@ app : App Model app = StartApp.start { init = ( initialModel initialTime translations config - , Effects.task initViewAction + , Effects.task Server.initViewAction ) , view = view , update = update diff --git a/src/client/elm/Model/Action.elm b/src/client/elm/Model/Action.elm index 033467d..ba47f2d 100644 --- a/src/client/elm/Model/Action.elm +++ b/src/client/elm/Model/Action.elm @@ -10,14 +10,14 @@ import Model.Payment exposing (Payments) import Model.Payer exposing (Payers) import Model.Action.SignInAction exposing (SignInAction) import Model.Action.LoggedInAction exposing (LoggedInAction) -import Model.Communication exposing (Communication) type Action = NoOp - | ServerCommunication Communication | SignIn String + | SetIncome Time Int | UpdateTime Time | GoLoggedInView Users UserId Payments Payments Int Payers | UpdateSignIn SignInAction | UpdateLoggedIn LoggedInAction | GoSignInView + | SignOut diff --git a/src/client/elm/Model/Action/LoggedInAction.elm b/src/client/elm/Model/Action/LoggedInAction.elm index 18d2224..ef81b09 100644 --- a/src/client/elm/Model/Action/LoggedInAction.elm +++ b/src/client/elm/Model/Action/LoggedInAction.elm @@ -8,11 +8,13 @@ import Model.Action.AccountAction exposing (AccountAction) import Model.Action.AddPaymentAction exposing (AddPaymentAction) type LoggedInAction = - UpdateAdd AddPaymentAction + NoOp + | UpdateAdd AddPaymentAction | UpdatePayments Payments | AddPayment String Int PaymentFrequency | ValidateAddPayment PaymentId String Int PaymentFrequency | DeletePayment Payment PaymentFrequency + | ValidateDeletePayment Payment PaymentFrequency | ToggleEdit PaymentId | UpdatePage Int | UpdateMonthly MonthlyAction diff --git a/src/client/elm/Model/Communication.elm b/src/client/elm/Model/Communication.elm deleted file mode 100644 index b8da175..0000000 --- a/src/client/elm/Model/Communication.elm +++ /dev/null @@ -1,15 +0,0 @@ -module Model.Communication - ( Communication(..) - ) where - -import Time exposing (Time) - -import Model.User exposing (UserId) -import Model.Payment exposing (..) - -type Communication = - SignIn String - | SetIncome Time Int - | AddPayment String Int PaymentFrequency - | DeletePayment Payment PaymentFrequency - | SignOut diff --git a/src/client/elm/Server.elm b/src/client/elm/Server.elm new file mode 100644 index 0000000..cb65868 --- /dev/null +++ b/src/client/elm/Server.elm @@ -0,0 +1,65 @@ +module Server + ( signIn + , addPayment + , deletePayment + , setIncome + , signOut + , initViewAction + ) where + +import Signal +import Task as Task exposing (Task) +import Http +import Json.Decode as Json exposing ((:=)) +import Date +import Time exposing (Time) +import Debug + +import SimpleHTTP exposing (..) + +import Model.Action as U exposing (Action) +import Model.Action.LoggedInAction as UL exposing (LoggedInAction) +import Model.Action.MonthlyAction as UM exposing (MonthlyAction) +import Model.Action.AccountAction as UA exposing (AccountAction) +import Model.Payment exposing (..) +import Model.Payer exposing (Payers, payersDecoder) +import Model.User exposing (Users, usersDecoder, UserId, userIdDecoder) + +import Update.SignIn exposing (updateSignIn) + +signIn : String -> Task Http.Error Action +signIn assertion = + post ("/signIn?assertion=" ++ assertion) + |> flip Task.andThen (always initViewAction) + +addPayment : String -> Int -> PaymentFrequency -> Task Http.Error LoggedInAction +addPayment name cost frequency = + post ("/payment/add?name=" ++ name ++ "&cost=" ++ (toString cost) ++ "&frequency=" ++ (toString frequency)) + |> flip Task.andThen (decodeHttpValue <| "id" := paymentIdDecoder) + |> Task.map (\paymentId -> (UL.ValidateAddPayment paymentId name cost frequency)) + +deletePayment : Payment -> PaymentFrequency -> Task Http.Error LoggedInAction +deletePayment payment frequency = + post ("payment/delete?id=" ++ (toString payment.id)) + |> Task.map (always (UL.ValidateDeletePayment payment frequency)) + +setIncome : Time -> Int -> Task Http.Error Action +setIncome currentTime amount = + post ("/income?amount=" ++ (toString amount)) + |> Task.map (always (U.UpdateLoggedIn (UL.UpdateAccount (UA.UpdateIncome currentTime amount)))) + +signOut : Task Http.Error Action +signOut = + post "/signOut" + |> Task.map (always U.GoSignInView) + +initViewAction = Task.onError loggedInView (always <| Task.succeed U.GoSignInView) + +loggedInView : Task Http.Error Action +loggedInView = + Task.map U.GoLoggedInView (Http.get usersDecoder "/users") + `Task.andMap` (Http.get ("id" := userIdDecoder) "/whoAmI") + `Task.andMap` (Http.get paymentsDecoder "/monthlyPayments") + `Task.andMap` (Http.get paymentsDecoder "/payments") + `Task.andMap` (Http.get ("number" := Json.int) "/payments/count") + `Task.andMap` (Http.get payersDecoder "/payers") diff --git a/src/client/elm/ServerCommunication.elm b/src/client/elm/ServerCommunication.elm deleted file mode 100644 index 7c46d79..0000000 --- a/src/client/elm/ServerCommunication.elm +++ /dev/null @@ -1,69 +0,0 @@ -module ServerCommunication - ( sendRequest - , initViewAction - ) where - -import Signal -import Task as Task exposing (Task) -import Http -import Json.Decode as Json exposing ((:=)) -import Date -import Time exposing (Time) -import Debug - -import SimpleHTTP exposing (..) - -import Model.Communication exposing (..) -import Model.Action as U exposing (Action) -import Model.Action.LoggedInAction as UL -import Model.Action.MonthlyAction as UM -import Model.Action.AccountAction as UA -import Model.Payment exposing (..) -import Model.Payer exposing (Payers, payersDecoder) -import Model.User exposing (Users, usersDecoder, UserId, userIdDecoder) - -import Update.SignIn exposing (updateSignIn) - -sendRequest : Communication -> Task Http.Error U.Action -sendRequest communication = - case communication of - - SignIn assertion -> - post ("/signIn?assertion=" ++ assertion) - |> flip Task.andThen (always initViewAction) - - AddPayment name cost frequency -> - post (addPaymentURL name cost frequency) - |> flip Task.andThen (decodeHttpValue <| "id" := paymentIdDecoder) - |> Task.map (\paymentId -> (U.UpdateLoggedIn (UL.ValidateAddPayment paymentId name cost frequency))) - - DeletePayment payment frequency -> - post (deletePaymentURL payment.id) - |> Task.map (always (U.UpdateLoggedIn (UL.DeletePayment payment frequency))) - - SetIncome currentTime amount -> - post ("/income?amount=" ++ (toString amount)) - |> Task.map (always (U.UpdateLoggedIn (UL.UpdateAccount (UA.UpdateIncome currentTime amount)))) - - SignOut -> - post "/signOut" - |> Task.map (always U.GoSignInView) - -addPaymentURL : String -> Int -> PaymentFrequency -> String -addPaymentURL name cost frequency = - "/payment/add?name=" ++ name ++ "&cost=" ++ (toString cost) ++ "&frequency=" ++ (toString frequency) - -deletePaymentURL : PaymentId -> String -deletePaymentURL id = - "payment/delete?id=" ++ (toString id) - -initViewAction = Task.onError loggedInView (always <| Task.succeed U.GoSignInView) - -loggedInView : Task Http.Error Action -loggedInView = - Task.map U.GoLoggedInView (Http.get usersDecoder "/users") - `Task.andMap` (Http.get ("id" := userIdDecoder) "/whoAmI") - `Task.andMap` (Http.get paymentsDecoder "/monthlyPayments") - `Task.andMap` (Http.get paymentsDecoder "/payments") - `Task.andMap` (Http.get ("number" := Json.int) "/payments/count") - `Task.andMap` (Http.get payersDecoder "/payers") diff --git a/src/client/elm/Update.elm b/src/client/elm/Update.elm index a33d47d..b473c9d 100644 --- a/src/client/elm/Update.elm +++ b/src/client/elm/Update.elm @@ -6,7 +6,7 @@ import Task import Effects exposing (Effects) -import ServerCommunication exposing (sendRequest) +import Server import Model exposing (Model) import Model.Translations exposing (getMessage) @@ -16,7 +16,6 @@ import Model.Action.LoggedInAction exposing (LoggedInAction) import Model.View as V import Model.View.SignInView exposing (..) import Model.View.LoggedInView exposing (..) -import Model.Communication as Communication exposing (Communication) import Update.LoggedIn exposing (updateLoggedIn) import Update.SignIn exposing (updateSignIn) @@ -32,25 +31,25 @@ update action model = SignIn assertion -> ( applySignIn model (SignInAction.WaitingServer) - , sendRequest (Communication.SignIn assertion) + , Server.signIn assertion |> flip Task.onError (\_ -> Task.succeed (UpdateSignIn (SignInAction.ErrorLogin (getMessage "ErrorSignIn" model.translations))) ) |> Effects.task ) - GoLoggedInView users me monthlyPayments payments paymentsCount payers -> - ( { model | view = V.LoggedInView (initLoggedInView users me monthlyPayments payments paymentsCount payers) } - , Effects.none - ) - - ServerCommunication communication -> + SetIncome currentTime amount -> ( model - , sendRequest communication + , Server.setIncome currentTime amount |> flip Task.onError (always <| Task.succeed NoOp) |> Effects.task ) + GoLoggedInView users me monthlyPayments payments paymentsCount payers -> + ( { model | view = V.LoggedInView (initLoggedInView users me monthlyPayments payments paymentsCount payers) } + , Effects.none + ) + UpdateTime time -> ({ model | currentTime = time }, Effects.none) @@ -63,6 +62,13 @@ update action model = UpdateLoggedIn loggedInAction -> applyLoggedIn model loggedInAction + SignOut -> + ( model + , Server.signOut + |> flip Task.onError (always <| Task.succeed NoOp) + |> Effects.task + ) + applySignIn : Model -> SignInAction -> Model applySignIn model signInAction = case model.view of @@ -77,7 +83,7 @@ applyLoggedIn model loggedInAction = V.LoggedInView loggedInView -> let (loggedInView, effects) = updateLoggedIn model loggedInAction loggedInView in ( { model | view = V.LoggedInView loggedInView } - , effects + , Effects.map UpdateLoggedIn effects ) _ -> (model, Effects.none) diff --git a/src/client/elm/Update/LoggedIn.elm b/src/client/elm/Update/LoggedIn.elm index fe53af7..69a1b75 100644 --- a/src/client/elm/Update/LoggedIn.elm +++ b/src/client/elm/Update/LoggedIn.elm @@ -8,17 +8,15 @@ import Dict import Effects exposing (Effects) import Task -import ServerCommunication exposing (sendRequest) +import Server import Model exposing (Model) import Model.User exposing (UserId) import Model.Payment exposing (..) -import Model.Action exposing (..) import Model.Action.LoggedInAction exposing (..) import Model.Action.AccountAction exposing (..) import Model.Action.MonthlyAction as Monthly import Model.Action.AddPaymentAction as AddPayment -import Model.Communication as Communication exposing (Communication) import Model.View.LoggedInView exposing (..) import Model.View.LoggedIn.AddPayment exposing (..) @@ -26,10 +24,12 @@ import Update.LoggedIn.AddPayment exposing (updateAddPayment) import Update.LoggedIn.Monthly exposing (updateMonthly) import Update.LoggedIn.Account exposing (updateAccount) -updateLoggedIn : Model -> LoggedInAction -> LoggedInView -> (LoggedInView, Effects Action) +updateLoggedIn : Model -> LoggedInAction -> LoggedInView -> (LoggedInView, Effects LoggedInAction) updateLoggedIn model action loggedInView = case action of + NoOp -> (loggedInView, Effects.none) + UpdateAdd addPaymentAction -> ( { loggedInView | add = updateAddPayment addPaymentAction loggedInView.add } , Effects.none @@ -42,7 +42,7 @@ updateLoggedIn model action loggedInView = AddPayment name cost frequency -> ( { loggedInView | add = updateAddPayment AddPayment.WaitingServer loggedInView.add } - , sendRequest (Communication.AddPayment name cost frequency) + , Server.addPayment name cost frequency |> flip Task.onError (always <| Task.succeed NoOp) |> Effects.task ) @@ -75,6 +75,13 @@ updateLoggedIn model action loggedInView = ) DeletePayment payment frequency -> + ( loggedInView + , Server.deletePayment payment frequency + |> flip Task.onError (always <| Task.succeed NoOp) + |> Effects.task + ) + + ValidateDeletePayment payment frequency -> case frequency of Monthly -> ( { loggedInView diff --git a/src/client/elm/View/Header.elm b/src/client/elm/View/Header.elm index 9d57c05..b8a5bf1 100644 --- a/src/client/elm/View/Header.elm +++ b/src/client/elm/View/Header.elm @@ -10,7 +10,6 @@ import Html.Events exposing (..) import Model exposing (Model) import Model.Translations exposing (getMessage) -import Model.Communication as Communication import Model.Action exposing (..) import Model.View exposing (..) @@ -27,7 +26,7 @@ renderHeader address model = LoggedInView _ -> button [ class "icon" - , onClick address (ServerCommunication Communication.SignOut) + , onClick address SignOut ] [ renderIcon "power-off" ] _ -> diff --git a/src/client/elm/View/LoggedIn/Account.elm b/src/client/elm/View/LoggedIn/Account.elm index 9459740..a7c20d5 100644 --- a/src/client/elm/View/LoggedIn/Account.elm +++ b/src/client/elm/View/LoggedIn/Account.elm @@ -17,7 +17,6 @@ import Model.Translations exposing (getParamMessage, getMessage) import Model.Action exposing (..) import Model.Action.LoggedInAction exposing (..) import Model.Action.AccountAction exposing (..) -import Model.Communication as Communication import Model.View.LoggedInView exposing (LoggedInView) import Model.View.LoggedIn.Account exposing (..) @@ -95,7 +94,7 @@ incomeEdition address model account edition = H.form [ case validateIncome edition.income model.translations of Ok validatedAmount -> - onSubmitPrevDefault address (ServerCommunication <| Communication.SetIncome model.currentTime validatedAmount) + onSubmitPrevDefault address (SetIncome model.currentTime validatedAmount) Err error -> onSubmitPrevDefault address (UpdateLoggedIn << UpdateAccount << UpdateEditionError <| error) , class "income" diff --git a/src/client/elm/View/LoggedIn/AddPayment.elm b/src/client/elm/View/LoggedIn/AddPayment.elm index 283d392..0b39591 100644 --- a/src/client/elm/View/LoggedIn/AddPayment.elm +++ b/src/client/elm/View/LoggedIn/AddPayment.elm @@ -13,10 +13,9 @@ import Html.Events exposing (..) import Model exposing (Model) import Model.Payment exposing (PaymentFrequency(..)) import Model.Translations exposing (getMessage) -import Model.Action exposing (..) +import Model.Action as Action exposing (..) import Model.Action.LoggedInAction as LoggedInAction exposing (..) import Model.Action.AddPaymentAction exposing (..) -import Model.Communication as Communication import Model.View.LoggedIn.AddPayment exposing (..) import Model.View.LoggedInView exposing (LoggedInView) @@ -32,7 +31,7 @@ addPayment address model loggedInView = H.form [ let update = if loggedInView.add.waitingServer - then NoOp + then Action.NoOp else case (validateName loggedInView.add.name model.translations, validateCost loggedInView.add.cost model.translations) of (Ok name, Ok cost) -> diff --git a/src/client/elm/View/LoggedIn/Monthly.elm b/src/client/elm/View/LoggedIn/Monthly.elm index c0294d7..2e9ff1e 100644 --- a/src/client/elm/View/LoggedIn/Monthly.elm +++ b/src/client/elm/View/LoggedIn/Monthly.elm @@ -13,9 +13,8 @@ import Model exposing (Model) import Model.Payment as Payment exposing (Payments, Payment) import Model.Translations exposing (getMessage, getParamMessage) import Model.Action exposing (..) -import Model.Action.LoggedInAction exposing (..) +import Model.Action.LoggedInAction as LoggedInAction exposing (..) import Model.Action.MonthlyAction exposing (..) -import Model.Communication as Communication import Model.View.LoggedIn.Monthly exposing (Monthly) import Model.View.LoggedInView exposing (LoggedInView) @@ -81,7 +80,7 @@ paymentLine address model loggedInView payment = [ text (price model payment.cost) ] , div [ class "cell delete" - , onClick address (ServerCommunication <| Communication.DeletePayment payment Payment.Monthly) + , onClick address (UpdateLoggedIn <| LoggedInAction.DeletePayment payment Payment.Monthly) ] [ button [] [ renderIcon "times" ] ] diff --git a/src/client/elm/View/LoggedIn/Table.elm b/src/client/elm/View/LoggedIn/Table.elm index cb3969b..ca5680f 100644 --- a/src/client/elm/View/LoggedIn/Table.elm +++ b/src/client/elm/View/LoggedIn/Table.elm @@ -17,7 +17,6 @@ import Model.Payment exposing (..) import Model.Translations exposing (getMessage) import Model.Action exposing (..) import Model.Action.LoggedInAction exposing (..) -import Model.Communication as Communication import Model.View.LoggedInView exposing (LoggedInView) import View.Icon exposing (renderIcon) @@ -88,7 +87,7 @@ paymentLine address model loggedInView payment = div [ class "cell delete" ] [ button - [ onClick address (ServerCommunication <| Communication.DeletePayment payment Punctual)] + [ onClick address (UpdateLoggedIn <| DeletePayment payment Punctual)] [ renderIcon "times" ] ] else diff --git a/src/client/elm/View/SignIn.elm b/src/client/elm/View/SignIn.elm index 4b9f2bb..c21c16c 100644 --- a/src/client/elm/View/SignIn.elm +++ b/src/client/elm/View/SignIn.elm @@ -26,7 +26,7 @@ renderSignIn address model signInView = [ class "signIn" ] [ button ( if signInView.waitingServer - then [] + then [ class "waitingServer" ] else [ onClick operations.address Persona.SignIn ] ) [ span [] [ text (getMessage "SignIn" model.translations) ] diff --git a/src/server/Design/Color.hs b/src/server/Design/Color.hs index adbe50f..126a231 100644 --- a/src/server/Design/Color.hs +++ b/src/server/Design/Color.hs @@ -5,9 +5,6 @@ import qualified Clay.Color as C white :: C.Color white = C.white -greenSuccess :: C.Color -greenSuccess = C.green - redError :: C.Color redError = C.red @@ -15,7 +12,7 @@ red :: C.Color red = C.rgb 207 92 86 green :: C.Color -green = C.rgb 169 220 175 +green = C.rgb 159 210 165 blue :: C.Color blue = C.rgb 108 162 164 diff --git a/src/server/Design/Constants.hs b/src/server/Design/Constants.hs index 6c4ab90..94df14b 100644 --- a/src/server/Design/Constants.hs +++ b/src/server/Design/Constants.hs @@ -20,8 +20,14 @@ blockPercentMargin = (100 - blockPercentWidth) / 2 blockMarginBottom :: Size Abs blockMarginBottom = px 50 -rowHeight :: Size Abs -rowHeight = px 60 +rowHeightPx :: Integer +rowHeightPx = 60 inputHeight :: Integer inputHeight = 40 + +focusLighten :: Color -> Color +focusLighten color = color +. 20 + +focusDarken :: Color -> Color +focusDarken color = color -. 20 diff --git a/src/server/Design/Global.hs b/src/server/Design/Global.hs index 9f5a4fc..c41d06f 100644 --- a/src/server/Design/Global.hs +++ b/src/server/Design/Global.hs @@ -24,6 +24,8 @@ global = do minWidth (px 550) fontFamily ["Cantarell"] [sansSerif] + a ? cursor pointer + allKeyframes signInDesign diff --git a/src/server/Design/Header.hs b/src/server/Design/Header.hs index 5ef3fb0..a45a7b2 100644 --- a/src/server/Design/Header.hs +++ b/src/server/Design/Header.hs @@ -6,8 +6,6 @@ module Design.Header import Clay -import Data.Monoid ((<>)) - import Design.Color as C import Design.Constants @@ -39,3 +37,4 @@ headerDesign = color C.white fontSize iconFontSize hover & i ? transform (scale 1.2 1.2) + focus & i ? transform (scale 1.2 1.2) diff --git a/src/server/Design/Helper.hs b/src/server/Design/Helper.hs index 40218f8..f4c19fa 100644 --- a/src/server/Design/Helper.hs +++ b/src/server/Design/Helper.hs @@ -27,19 +27,22 @@ clearFix = display D.table clear both -defaultButton :: Color -> Color -> Size Abs -> Css -defaultButton backgroundCol textCol h = do +defaultButton :: Color -> Color -> Size a -> (Color -> Color) -> Css +defaultButton backgroundCol textCol h focusOp = do backgroundColor backgroundCol color textCol borderRadius radius radius radius radius verticalAlign middle cursor pointer lineHeight h + height h textAlign (alignSide sideCenter) + hover & backgroundColor (focusOp backgroundCol) + focus & backgroundColor (focusOp backgroundCol) -iconButton :: Color -> Color -> Size Abs -> Css -iconButton backgroundCol textCol h = do - defaultButton backgroundCol textCol h +iconButton :: Color -> Color -> Size Abs -> (Color -> Color) -> Css +iconButton backgroundCol textCol h focusOp = do + defaultButton backgroundCol textCol h focusOp i <> span ? do height h lineHeight h @@ -49,11 +52,10 @@ iconButton backgroundCol textCol h = do i ? do marginLeft (px 15) marginRight (px 20) - hover & i ? transform (scale 1.2 1.2) defaultInput :: Integer -> Css -defaultInput inputHeight = do - height (px inputHeight) +defaultInput h = do + height (px h) padding (px 10) (px 10) (px 10) (px 10) borderRadius radius radius radius radius border solid (px 1) C.darkGrey @@ -72,7 +74,7 @@ expandBlock headerBackground headerColor headerHeight = do marginLeft (pct blockPercentMargin) marginRight (pct blockPercentMargin) ".header" ? do - defaultButton headerBackground headerColor headerHeight + defaultButton headerBackground headerColor headerHeight focusLighten width (pct 100) fontSize (px 18) borderRadius radius radius radius radius diff --git a/src/server/Design/LoggedIn/Add.hs b/src/server/Design/LoggedIn/Add.hs index 3bdfb65..ef0603c 100644 --- a/src/server/Design/LoggedIn/Add.hs +++ b/src/server/Design/LoggedIn/Add.hs @@ -43,6 +43,9 @@ addDesign = borderRadius radius (px 0) (px 0) radius "width" -: "calc(100% - 40px)" "input:focus + label" ? backgroundColor C.grey + hover & do + input ? borderColor C.grey + label ? backgroundColor C.grey ".name" ? minWidth (px 150) @@ -51,18 +54,24 @@ addDesign = marginRight (pct blockPercentMargin) (".punctual" <> ".monthly") ? do - defaultButton C.lightGrey C.darkGrey (px $ inputHeight `Prelude.div` 2) + defaultButton C.lightGrey C.darkGrey (px $ inputHeight `Prelude.div` 2) focusLighten paddingLeft (px 15) paddingRight (px 15) ".selected" & do backgroundColor C.blue color C.white + hover & (".punctual" <> ".monthly") ? + ".selected" & backgroundColor (focusLighten C.blue) + + focus & (".punctual" <> ".monthly") ? + ".selected" & backgroundColor (focusLighten C.blue) + ".punctual" ? borderRadius radius radius 0 0 ".monthly" ? borderRadius 0 0 radius radius button # ".add" ? do - defaultButton C.red C.white (px inputHeight) + defaultButton C.red C.white (px inputHeight) focusLighten paddingLeft (px 15) paddingRight (px 15) i ? marginLeft (px 10) diff --git a/src/server/Design/LoggedIn/Expandables.hs b/src/server/Design/LoggedIn/Expandables.hs index 66a9b06..8ef42cd 100644 --- a/src/server/Design/LoggedIn/Expandables.hs +++ b/src/server/Design/LoggedIn/Expandables.hs @@ -22,7 +22,8 @@ expandablesDesign = right blockPadding bottom (px 2) - ".monthlyPayments" ? expandBlock C.blue C.white (px inputHeight) + ".monthlyPayments" ? do + expandBlock C.blue C.white (px inputHeight) ".account" ? do expandBlock C.green C.white (px inputHeight) @@ -35,7 +36,7 @@ expandablesDesign = backgroundColor C.lightGrey padding (px 0) (px 20) (px 0) (px 20) position relative - lineHeight rowHeight + lineHeight (px rowHeightPx) input ? do defaultInput inputHeight @@ -50,10 +51,10 @@ expandablesDesign = marginTop (px (-5)) ".validateIncomeEdition" <> ".editIncomeEdition" ? - defaultButton C.red C.white (px inputHeight) + defaultButton C.red C.white (px inputHeight) focusLighten ".undoIncomeEdition" ? - defaultButton C.blue C.white (px inputHeight) + defaultButton C.blue C.white (px inputHeight) focusLighten ".error" ? do color C.redError diff --git a/src/server/Design/LoggedIn/Pages.hs b/src/server/Design/LoggedIn/Pages.hs index c42e9f3..f7946b8 100644 --- a/src/server/Design/LoggedIn/Pages.hs +++ b/src/server/Design/LoggedIn/Pages.hs @@ -19,17 +19,12 @@ pagesDesign = clearFix ".page" ? do + defaultButton C.white C.darkGrey (px 50) focusDarken display inlineBlock border solid (px 2) C.darkGrey - color C.darkGrey - borderRadius radius radius radius radius marginRight (px 10) - let h = 50 paddingLeft (px 10) paddingRight (px 10) - height (px h) - lineHeight (px h) - textAlign (alignSide (sideCenter)) fontWeight bold ":not(.current)" & cursor pointer diff --git a/src/server/Design/LoggedIn/Table.hs b/src/server/Design/LoggedIn/Table.hs index 2876fa1..d9fc318 100644 --- a/src/server/Design/LoggedIn/Table.hs +++ b/src/server/Design/LoggedIn/Table.hs @@ -12,6 +12,7 @@ import qualified Clay.Display as D import Design.Color as C import Design.Media import Design.Constants +import Design.Helper tableDesign :: Css tableDesign = @@ -33,20 +34,48 @@ tableDesign = lineHeight headerHeight ".row" ? do - fontSize (px 20) - cursor pointer - lineHeight rowHeight - nthChild "odd" & backgroundColor C.lightGrey + fontSize (px 18) + lineHeight (px rowHeightPx) + + hover & do + let (borderW, triangleW, triangleH) = (4, 6, 8) + ".cell:first-child::before" ? do + display block + content (stringContent "") + position absolute + top (px 0) + left (px 0) + + width (px borderW) + height (px rowHeightPx) + backgroundColor C.green + + ".cell:first-child::after" ? do + display block + content (stringContent "") + position absolute + top (px (rowHeightPx `Prelude.div` 2 - triangleH)) + left (px borderW) + + width (px 0) + height (px 0) + borderTop solid (px triangleH) transparent + borderBottom solid (px triangleH) transparent + borderLeft solid (px triangleW) C.green + + nthChild "odd" & do + backgroundColor C.lightGrey ".edition" & do backgroundColor C.paymentFocus - ".delete" ? visibility visible + ".delete" |> button ? visibility visible ".cell" ? do display tableCell + position relative ".category" & width (pct 40) ".cost" & do width (pct 17) - ".refund" & color C.greenSuccess + ".refund" & color C.green ".user" & width (pct 20) ".date" & do width (pct 20) @@ -57,12 +86,13 @@ tableDesign = ".shortDate" ? display none ".longDate" ? display inline ".delete" & do + position relative width (pct 3) - height rowHeight textAlign (alignSide sideCenter) - backgroundColor C.red - visibility hidden button ? do + defaultButton C.red C.white (px rowHeightPx) focusLighten + position absolute + top (px 0) + right (px 0) width (pct 100) - height (pct 100) - color C.white + visibility hidden diff --git a/src/server/Design/SignIn.hs b/src/server/Design/SignIn.hs index a90832e..a565ee4 100644 --- a/src/server/Design/SignIn.hs +++ b/src/server/Design/SignIn.hs @@ -8,6 +8,7 @@ import Clay import Design.Color as C import Design.Helper +import Design.Constants signInDesign :: Css signInDesign = @@ -17,9 +18,10 @@ signInDesign = button ? do display block margin (em 5) auto (em 2) auto - iconButton C.blue C.white (em 2.5) + iconButton C.blue C.white (em 2.5) focusLighten fontSize (em 1.5) position relative + ".waitingServer" & ("cursor" -: "not-allowed") ".error" ? do textAlign (alignSide sideCenter) diff --git a/src/server/Model/Message/Translations.hs b/src/server/Model/Message/Translations.hs index 2212e1a..7ca6483 100644 --- a/src/server/Model/Message/Translations.hs +++ b/src/server/Model/Message/Translations.hs @@ -191,8 +191,8 @@ m l PluralMonthlyCount = m l Income = T.concat [ case l of - English -> "You have a monthly net income of {1}" - French -> "Votre revenu mensuel net est de {1}" + English -> "Monthly net income: {1}" + French -> "Revenu mensuel net : {1}" ] m l NoIncome = -- cgit v1.2.3