diff options
27 files changed, 488 insertions, 422 deletions
diff --git a/src/client/elm/LoggedIn/Home/Account/View.elm b/src/client/elm/LoggedIn/Home/Account/View.elm index 63fb997..bec75d5 100644 --- a/src/client/elm/LoggedIn/Home/Account/View.elm +++ b/src/client/elm/LoggedIn/Home/Account/View.elm @@ -9,7 +9,7 @@ import LoggedData exposing (LoggedData) import LoggedIn.Home.Model as HomeModel import LoggedIn.Home.Model.Payer exposing (..) -import LoggedIn.View.Price exposing (price) +import LoggedIn.View.Format as Format import Model exposing (Model) import Model.User exposing (getUserName) @@ -36,5 +36,5 @@ exceedingPayer loggedData homeModel payer = ] , span [ class "amount" ] - [ text ("+ " ++ (price loggedData.conf payer.amount)) ] + [ text ("+ " ++ (Format.price loggedData.conf payer.amount)) ] ] diff --git a/src/client/elm/LoggedIn/Home/View.elm b/src/client/elm/LoggedIn/Home/View.elm index 7e6ba40..43cc9cf 100644 --- a/src/client/elm/LoggedIn/Home/View.elm +++ b/src/client/elm/LoggedIn/Home/View.elm @@ -20,7 +20,7 @@ import Mailbox view : LoggedData -> LoggedInModel.Model -> Html view loggedData loggedIn = div - [ class "loggedIn" ] + [ class "home" ] [ AddPaymentView.view loggedData loggedIn , div [ class "expandables" ] diff --git a/src/client/elm/LoggedIn/Home/View/Monthly.elm b/src/client/elm/LoggedIn/Home/View/Monthly.elm index c001331..237b551 100644 --- a/src/client/elm/LoggedIn/Home/View/Monthly.elm +++ b/src/client/elm/LoggedIn/Home/View/Monthly.elm @@ -12,7 +12,7 @@ import LoggedIn.Action as LoggedInAction import LoggedIn.Home.Action as HomeAction import LoggedIn.Home.Model as HomeModel -import LoggedIn.View.Price exposing (price) +import LoggedIn.View.Format as Format import LoggedIn.Home.View.Expand exposing (..) import Model.Payment as Payment exposing (Payments, Payment, monthly) @@ -52,7 +52,7 @@ monthlyCount loggedData monthlyPayments homeModel = [ class "header" , onClick Mailbox.address (Action.UpdateLoggedIn << LoggedInAction.HomeAction <| HomeAction.ToggleMonthlyDetail) ] - [ text (getParamMessage [toString count, price loggedData.conf total] key loggedData.translations) + [ text (getParamMessage [toString count, Format.price loggedData.conf total] key loggedData.translations) , expand ExpandDown homeModel.monthlyDetail ] @@ -81,7 +81,7 @@ paymentLine loggedData homeModel payment = , ("refund", payment.cost < 0) ] ] - [ text (price loggedData.conf payment.cost) ] + [ text (Format.price loggedData.conf payment.cost) ] , div [ class "cell delete" , onClick Mailbox.address (Action.UpdateLoggedIn <| LoggedInAction.DeletePayment payment.id) diff --git a/src/client/elm/LoggedIn/Home/View/Table.elm b/src/client/elm/LoggedIn/Home/View/Table.elm index 71aa4e5..5ac740c 100644 --- a/src/client/elm/LoggedIn/Home/View/Table.elm +++ b/src/client/elm/LoggedIn/Home/View/Table.elm @@ -17,7 +17,7 @@ import LoggedIn.Action as LoggedInAction import LoggedIn.Home.Action as HomeAction import LoggedIn.Home.Model as HomeModel import LoggedIn.View.Date exposing (..) -import LoggedIn.View.Price exposing (price) +import LoggedIn.View.Format as Format import Model.User exposing (getUserName) import Model.Payment as Payment exposing (..) @@ -68,7 +68,7 @@ paymentLine loggedData homeModel payment = , ("refund", payment.cost < 0) ] ] - [ text (price loggedData.conf payment.cost) ] + [ text (Format.price loggedData.conf payment.cost) ] , div [ class "cell user" ] [ payment.userId diff --git a/src/client/elm/LoggedIn/Income/View.elm b/src/client/elm/LoggedIn/Income/View.elm index 010b503..f62902a 100644 --- a/src/client/elm/LoggedIn/Income/View.elm +++ b/src/client/elm/LoggedIn/Income/View.elm @@ -24,14 +24,14 @@ import LoggedIn.Action as LoggedInAction import LoggedIn.Income.Action as IncomeAction import LoggedIn.View.Date exposing (renderShortDate) -import LoggedIn.View.Price exposing (price) +import LoggedIn.View.Format as Format import Utils.Maybe exposing (isJust) view : LoggedData -> IncomeModel.Model -> Html view loggedData incomeModel = div - [] + [ class "income" ] [ h1 [] [ text <| getMessage "AddIncome" loggedData.translations ] , addIncomeView loggedData incomeModel.addIncome , h1 [] [ text <| getMessage "MonthlyNetIncomes" loggedData.translations ] @@ -71,7 +71,7 @@ addIncomeView loggedData addIncome = incomesView : LoggedData -> Html incomesView loggedData = - ol + ul [] ( loggedData.incomes |> Dict.toList @@ -87,7 +87,7 @@ incomeView loggedData (incomeId, income) = [] [ text <| renderShortDate (Date.fromTime income.creation) loggedData.translations , text " − " - , text <| price loggedData.conf income.amount + , text <| Format.price loggedData.conf income.amount , text " − " , button [ onClick Mailbox.address (Action.UpdateLoggedIn <| LoggedInAction.DeleteIncome incomeId) ] diff --git a/src/client/elm/LoggedIn/Stat/View.elm b/src/client/elm/LoggedIn/Stat/View.elm index 76acd8f..3fe9d1f 100644 --- a/src/client/elm/LoggedIn/Stat/View.elm +++ b/src/client/elm/LoggedIn/Stat/View.elm @@ -3,40 +3,59 @@ module LoggedIn.Stat.View ) where import Html exposing (..) +import Html.Attributes exposing (..) import LoggedData exposing (LoggedData) -import Model.Payment exposing (Payments) +import Model.Payment as Payment exposing (Payments) import Model.Conf exposing (Conf) +import Model.Translations exposing (getMessage) -import LoggedIn.View.Price exposing (price) +import LoggedIn.View.Format as Format + +import View.Plural exposing (plural) view : LoggedData -> Html view loggedData = div - [] - [ h1 [] [ text "Total" ] - , paymentDetail loggedData.conf loggedData.payments + [ class "stat" ] + [ h1 [] [ text (getMessage "Overall" loggedData.translations) ] + , paymentsDetail loggedData (Payment.punctual loggedData.payments) + , h1 [] [ text (getMessage "ByMonths" loggedData.translations) ] + , monthsDetail loggedData ] -paymentDetail : Conf -> Payments -> Html -paymentDetail conf payments = +paymentsDetail : LoggedData -> Payments -> Html +paymentsDetail loggedData payments = ul [] [ li [] - [ payments - |> List.length - |> toString - |> text - , text " payments" + [ let single = getMessage "Payment" loggedData.translations + multiple = getMessage "Payments" loggedData.translations + in text <| plural (List.length payments) single multiple ] , li [] [ payments |> List.map .cost |> List.sum - |> price conf + |> Format.price loggedData.conf |> text ] ] + +monthsDetail : LoggedData -> Html +monthsDetail loggedData = + ul + [] + [] + +monthDetail : String -> Int -> Html +monthDetail month amount = + li + [] + [ text month + , text " " + , text (toString amount) + ] diff --git a/src/client/elm/LoggedIn/View.elm b/src/client/elm/LoggedIn/View.elm index b1ec4d3..dbbab33 100644 --- a/src/client/elm/LoggedIn/View.elm +++ b/src/client/elm/LoggedIn/View.elm @@ -3,6 +3,7 @@ module LoggedIn.View ) where import Html exposing (..) +import Html.Attributes exposing (..) import TransitRouter import Route exposing (..) @@ -19,9 +20,12 @@ import LoggedIn.Stat.View as StatView view : Model -> LoggedInModel.Model -> Html view model loggedIn = - let loggedData = LoggedData.build model loggedIn - in case TransitRouter.getRoute model of - Empty -> text "" - Home -> HomeView.view loggedData loggedIn.home - Income -> UserView.view loggedData loggedIn.income - Stat -> StatView.view loggedData + div + [ class "loggedIn" ] + [ let loggedData = LoggedData.build model loggedIn + in case TransitRouter.getRoute model of + Empty -> text "" + Home -> HomeView.view loggedData loggedIn.home + Income -> UserView.view loggedData loggedIn.income + Stat -> StatView.view loggedData + ] diff --git a/src/client/elm/LoggedIn/View/Price.elm b/src/client/elm/LoggedIn/View/Format.elm index 2bfed23..7925a5c 100644 --- a/src/client/elm/LoggedIn/View/Price.elm +++ b/src/client/elm/LoggedIn/View/Format.elm @@ -1,4 +1,4 @@ -module LoggedIn.View.Price +module LoggedIn.View.Format ( price ) where @@ -8,13 +8,13 @@ import Model.Conf exposing (Conf) price : Conf -> Int -> String price conf amount = - ( formatInt amount + ( number amount ++ " " ++ conf.currency ) -formatInt : Int -> String -formatInt n = +number : Int -> String +number n = abs n |> toString |> toList diff --git a/src/client/elm/View/Plural.elm b/src/client/elm/View/Plural.elm new file mode 100644 index 0000000..6e480fd --- /dev/null +++ b/src/client/elm/View/Plural.elm @@ -0,0 +1,7 @@ +module View.Plural + ( plural + ) where + +plural : Int -> String -> String -> String +plural n single multiple = + (toString n) ++ " " ++ if n <= 1 then single else multiple diff --git a/src/server/Design/Animation/Opacity.hs b/src/server/Design/Animation/Opacity.hs deleted file mode 100644 index cc720fd..0000000 --- a/src/server/Design/Animation/Opacity.hs +++ /dev/null @@ -1,17 +0,0 @@ -{-# LANGUAGE OverloadedStrings #-} - -module Design.Animation.Opacity - ( opacityAnimation - ) where - -import Data.String (fromString) - -import Clay - -import Design.Animation.Keyframes - -opacityAnimation :: Css -opacityAnimation = do - animationName (fromString . show $ OpacityKeyframes) - animationDuration (sec 0.2) - animationTimingFunction ease diff --git a/src/server/Design/Global.hs b/src/server/Design/Global.hs index c41d06f..90dd842 100644 --- a/src/server/Design/Global.hs +++ b/src/server/Design/Global.hs @@ -8,17 +8,26 @@ import Clay import Data.Text.Lazy (Text) -import Design.Header -import Design.SignIn -import Design.LoggedIn +import qualified Design.Header as HeaderDesign +import qualified Design.SignIn as SignInDesign +import qualified Design.LoggedIn as LoggedInDesign + import Design.Animation.Keyframes +import Design.Color as Color + globalDesign :: Text globalDesign = renderWith compact [] global global :: Css global = do + header ? HeaderDesign.design + ".signIn" ? SignInDesign.design + ".loggedIn" ? LoggedInDesign.design + + allKeyframes + body ? do position relative minWidth (px 550) @@ -26,10 +35,15 @@ global = do a ? cursor pointer - allKeyframes - - signInDesign - - headerDesign - - loggedInDesign + h1 ? do + fontSize (px 20) + color Color.red + marginBottom (em 1) + + ul ? do + marginBottom (em 1) + li ? do + marginBottom (em 0.5) + before & do + content (stringContent "• ") + color Color.red diff --git a/src/server/Design/Header.hs b/src/server/Design/Header.hs index e361cb1..d4546f8 100644 --- a/src/server/Design/Header.hs +++ b/src/server/Design/Header.hs @@ -1,7 +1,7 @@ {-# LANGUAGE OverloadedStrings #-} module Design.Header - ( headerDesign + ( design ) where import Data.Monoid ((<>)) @@ -11,51 +11,49 @@ import Clay import Design.Color as C import Design.Constants -headerDesign :: Css -headerDesign = - - header ? do - let headerHeight = px 80 - let headerPadding = px 20 - let darkenedRed = C.red +. 10 - lineHeight headerHeight - height headerHeight - marginBottom blockMarginBottom +design :: Css +design = do + let headerHeight = px 80 + let headerPadding = px 20 + let darkenedRed = C.red +. 10 + lineHeight headerHeight + height headerHeight + marginBottom blockMarginBottom + position relative + backgroundColor C.red + color C.white + + ".item" ? do + float floatLeft + paddingLeft headerPadding + paddingRight headerPadding + hover & backgroundColor darkenedRed + focus & backgroundColor darkenedRed position relative - backgroundColor C.red + ".current" & after & do + display block + content (stringContent "") + height (px 5) + width (pct 100) + position absolute + bottom (px 0) + left (px 0) + backgroundColor C.white + + ".title" ? do + height (pct 100) + fontSize (px 35) + textAlign (alignSide sideLeft) + paddingLeft headerPadding + paddingRight headerPadding + + (".name" <> ".signOut") ? float floatRight + + ".name" ? do + paddingLeft headerPadding + paddingRight headerPadding + + ".signOut" ? do + height (pct 100) + fontSize iconFontSize color C.white - - ".item" ? do - float floatLeft - paddingLeft headerPadding - paddingRight headerPadding - hover & backgroundColor darkenedRed - focus & backgroundColor darkenedRed - position relative - ".current" & after & do - display block - content (stringContent "") - height (px 5) - width (pct 100) - position absolute - bottom (px 0) - left (px 0) - backgroundColor C.white - - ".title" ? do - height (pct 100) - fontSize (px 35) - textAlign (alignSide sideLeft) - paddingLeft headerPadding - paddingRight headerPadding - - (".name" <> ".signOut") ? float floatRight - - ".name" ? do - paddingLeft headerPadding - paddingRight headerPadding - - ".signOut" ? do - height (pct 100) - fontSize iconFontSize - color C.white diff --git a/src/server/Design/LoggedIn.hs b/src/server/Design/LoggedIn.hs index d35276b..63ff413 100644 --- a/src/server/Design/LoggedIn.hs +++ b/src/server/Design/LoggedIn.hs @@ -1,28 +1,22 @@ {-# LANGUAGE OverloadedStrings #-} module Design.LoggedIn - ( loggedInDesign + ( design ) where -import Clay - -import Design.LoggedIn.Add -import Design.LoggedIn.Expandables -import Design.LoggedIn.Table -import Design.LoggedIn.Pages -import Design.Animation.Opacity - -loggedInDesign :: Css -loggedInDesign = +import Data.Monoid ((<>)) - ".loggedIn" ? do - - opacityAnimation - - addDesign +import Clay - expandablesDesign +import qualified Design.LoggedIn.Home as HomeDesign +import qualified Design.LoggedIn.Income as IncomeDesign +import qualified Design.LoggedIn.Stat as StatDesign - tableDesign +design :: Css +design = do + ".home" ? HomeDesign.design + ".income" ? IncomeDesign.design + ".stat" ? StatDesign.design - pagesDesign + (".income" <> ".stat") ? do + "margin" -: "0 2vw" diff --git a/src/server/Design/LoggedIn/Add.hs b/src/server/Design/LoggedIn/Add.hs deleted file mode 100644 index ef0603c..0000000 --- a/src/server/Design/LoggedIn/Add.hs +++ /dev/null @@ -1,89 +0,0 @@ -{-# LANGUAGE OverloadedStrings #-} - -module Design.LoggedIn.Add - ( addDesign - ) where - -import Data.Monoid ((<>)) - -import Clay - -import Design.Color as C -import Design.Helper -import Design.Constants - -addDesign :: Css -addDesign = - - form # ".addPayment" ? do - centeredWithMargin - marginBottom blockMarginBottom - display flex - "justify-content" -: "center" - - ".name" <> ".cost" ? do - position relative - display flex - marginRight (pct blockPercentMargin) - label ? do - fontWeight bold - display inlineBlock - width (px 50) - textAlign (alignSide sideCenter) - backgroundColor C.darkGrey - color C.white - height (px inputHeight) - lineHeight (px inputHeight) - fontSize (px 22) - verticalAlign middle - cursor cursorText - borderRadius (px 0) radius radius (px 0) - input ? do - defaultInput inputHeight - 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) - - button # ".frequency" ? do - fontSize (pct 90) - marginRight (pct blockPercentMargin) - - (".punctual" <> ".monthly") ? do - 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) focusLighten - paddingLeft (px 15) - paddingRight (px 15) - i ? marginLeft (px 10) - ".waitingServer" & ("cursor" -: "not-allowed") - - ".name.error" <> ".cost.error" ? do - input ? borderColor C.redError - label ? backgroundColor C.redError - "input:focus + label" ? backgroundColor C.redError - - ".errorMessage" ? do - position absolute - color C.redError - top (px (inputHeight + 10)) - left (px 0) diff --git a/src/server/Design/LoggedIn/Expandables.hs b/src/server/Design/LoggedIn/Expandables.hs deleted file mode 100644 index 90ea32d..0000000 --- a/src/server/Design/LoggedIn/Expandables.hs +++ /dev/null @@ -1,31 +0,0 @@ -{-# LANGUAGE OverloadedStrings #-} - -module Design.LoggedIn.Expandables - ( expandablesDesign - ) where - --- import Data.Monoid ((<>)) --- -import Clay - -import Design.Color as C -import Design.Helper -import Design.Constants - -expandablesDesign :: Css -expandablesDesign = - - ".expandables" ? do - - ".expand" ? do - position absolute - right blockPadding - bottom (px 2) - - ".monthlyPayments" ? expandBlock C.blue C.white (px inputHeight) - - ".account" ? do - expandBlock C.green C.white (px inputHeight) - ".userName" ? marginRight (px 10) - - ".detail" |> ".header" ? borderRadius radius radius 0 0 diff --git a/src/server/Design/LoggedIn/Home.hs b/src/server/Design/LoggedIn/Home.hs new file mode 100644 index 0000000..be99a2c --- /dev/null +++ b/src/server/Design/LoggedIn/Home.hs @@ -0,0 +1,19 @@ +{-# LANGUAGE OverloadedStrings #-} + +module Design.LoggedIn.Home + ( design + ) where + +import Clay + +import qualified Design.LoggedIn.Home.Add as AddDesign +import qualified Design.LoggedIn.Home.Expandables as ExpandablesDesign +import qualified Design.LoggedIn.Home.Table as TableDesign +import qualified Design.LoggedIn.Home.Pages as PagesDesign + +design :: Css +design = do + form # ".addPayment" ? AddDesign.design + ".expandables" ? ExpandablesDesign.design + ".table" ? TableDesign.design + ".pages" ? PagesDesign.design diff --git a/src/server/Design/LoggedIn/Home/Add.hs b/src/server/Design/LoggedIn/Home/Add.hs new file mode 100644 index 0000000..7613ba3 --- /dev/null +++ b/src/server/Design/LoggedIn/Home/Add.hs @@ -0,0 +1,87 @@ +{-# LANGUAGE OverloadedStrings #-} + +module Design.LoggedIn.Home.Add + ( design + ) where + +import Data.Monoid ((<>)) + +import Clay + +import Design.Color as C +import Design.Helper +import Design.Constants + +design :: Css +design = do + centeredWithMargin + marginBottom blockMarginBottom + display flex + "justify-content" -: "center" + + ".name" <> ".cost" ? do + position relative + display flex + marginRight (pct blockPercentMargin) + label ? do + fontWeight bold + display inlineBlock + width (px 50) + textAlign (alignSide sideCenter) + backgroundColor C.darkGrey + color C.white + height (px inputHeight) + lineHeight (px inputHeight) + fontSize (px 22) + verticalAlign middle + cursor cursorText + borderRadius (px 0) radius radius (px 0) + input ? do + defaultInput inputHeight + 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) + + button # ".frequency" ? do + fontSize (pct 90) + marginRight (pct blockPercentMargin) + + (".punctual" <> ".monthly") ? do + 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) focusLighten + paddingLeft (px 15) + paddingRight (px 15) + i ? marginLeft (px 10) + ".waitingServer" & ("cursor" -: "not-allowed") + + ".name.error" <> ".cost.error" ? do + input ? borderColor C.redError + label ? backgroundColor C.redError + "input:focus + label" ? backgroundColor C.redError + + ".errorMessage" ? do + position absolute + color C.redError + top (px (inputHeight + 10)) + left (px 0) diff --git a/src/server/Design/LoggedIn/Home/Expandables.hs b/src/server/Design/LoggedIn/Home/Expandables.hs new file mode 100644 index 0000000..5ba5711 --- /dev/null +++ b/src/server/Design/LoggedIn/Home/Expandables.hs @@ -0,0 +1,27 @@ +{-# LANGUAGE OverloadedStrings #-} + +module Design.LoggedIn.Home.Expandables + ( design + ) where + +import Clay + +import Design.Color as C +import Design.Helper +import Design.Constants + +design :: Css +design = do + + ".expand" ? do + position absolute + right blockPadding + bottom (px 2) + + ".monthlyPayments" ? expandBlock C.blue C.white (px inputHeight) + + ".account" ? do + expandBlock C.green C.white (px inputHeight) + ".userName" ? marginRight (px 10) + + ".detail" |> ".header" ? borderRadius radius radius 0 0 diff --git a/src/server/Design/LoggedIn/Home/Pages.hs b/src/server/Design/LoggedIn/Home/Pages.hs new file mode 100644 index 0000000..932865c --- /dev/null +++ b/src/server/Design/LoggedIn/Home/Pages.hs @@ -0,0 +1,32 @@ +{-# LANGUAGE OverloadedStrings #-} + +module Design.LoggedIn.Home.Pages + ( design + ) where + +import Clay + +import Design.Color as C +import Design.Helper +import Design.Constants + +design :: Css +design = do + padding (px 30) (px 30) (px 30) (px 30) + textAlign (alignSide (sideCenter)) + clearFix + + ".page" ? do + defaultButton C.white C.darkGrey (px 50) focusDarken + display inlineBlock + border solid (px 2) C.darkGrey + marginRight (px 10) + paddingLeft (px 10) + paddingRight (px 10) + fontWeight bold + + ":not(.current)" & cursor pointer + + ".current" & do + borderColor C.red + color C.red diff --git a/src/server/Design/LoggedIn/Home/Table.hs b/src/server/Design/LoggedIn/Home/Table.hs new file mode 100644 index 0000000..58ffb33 --- /dev/null +++ b/src/server/Design/LoggedIn/Home/Table.hs @@ -0,0 +1,97 @@ +{-# LANGUAGE OverloadedStrings #-} + +module Design.LoggedIn.Home.Table + ( design + ) where + +import Data.Monoid ((<>)) + +import Clay +import qualified Clay.Display as D + +import Design.Color as C +import Design.Media +import Design.Constants +import Design.Helper + +design :: Css +design = do + display D.table + width (pct 100) + textAlign (alignSide (sideCenter)) + "border-spacing" -: "10 px" + + ".header" <> ".row" ? display tableRow + let headerHeight = (px 70) + + ".header" ? do + fontWeight bold + backgroundColor C.blue + color C.white + fontSize iconFontSize + lineHeight headerHeight + + ".row" ? do + 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" |> button ? visibility visible + + ".cell" ? do + display tableCell + position relative + ".category" & width (pct 40) + ".cost" & do + width (pct 17) + ".refund" & color C.green + ".user" & width (pct 20) + ".date" & do + width (pct 20) + smallScreen $ do + ".shortDate" ? display inline + ".longDate" ? display none + largeScreen $ do + ".shortDate" ? display none + ".longDate" ? display inline + ".delete" & do + position relative + width (pct 3) + textAlign (alignSide sideCenter) + button ? do + defaultButton C.red C.white (px rowHeightPx) focusLighten + borderRadius (px 0) (px 0) (px 0) (px 0) + position absolute + top (px 0) + right (px 0) + width (pct 100) + visibility hidden diff --git a/src/server/Design/LoggedIn/Income.hs b/src/server/Design/LoggedIn/Income.hs new file mode 100644 index 0000000..b7efb9e --- /dev/null +++ b/src/server/Design/LoggedIn/Income.hs @@ -0,0 +1,10 @@ +{-# LANGUAGE OverloadedStrings #-} + +module Design.LoggedIn.Income + ( design + ) where + +import Clay + +design :: Css +design = h1 ? paddingBottom (px 0) diff --git a/src/server/Design/LoggedIn/Pages.hs b/src/server/Design/LoggedIn/Pages.hs deleted file mode 100644 index f7946b8..0000000 --- a/src/server/Design/LoggedIn/Pages.hs +++ /dev/null @@ -1,34 +0,0 @@ -{-# LANGUAGE OverloadedStrings #-} - -module Design.LoggedIn.Pages - ( pagesDesign - ) where - -import Clay - -import Design.Color as C -import Design.Helper -import Design.Constants - -pagesDesign :: Css -pagesDesign = - - ".pages" ? do - padding (px 30) (px 30) (px 30) (px 30) - textAlign (alignSide (sideCenter)) - clearFix - - ".page" ? do - defaultButton C.white C.darkGrey (px 50) focusDarken - display inlineBlock - border solid (px 2) C.darkGrey - marginRight (px 10) - paddingLeft (px 10) - paddingRight (px 10) - fontWeight bold - - ":not(.current)" & cursor pointer - - ".current" & do - borderColor C.red - color C.red diff --git a/src/server/Design/LoggedIn/Stat.hs b/src/server/Design/LoggedIn/Stat.hs new file mode 100644 index 0000000..42bcb71 --- /dev/null +++ b/src/server/Design/LoggedIn/Stat.hs @@ -0,0 +1,10 @@ +{-# LANGUAGE OverloadedStrings #-} + +module Design.LoggedIn.Stat + ( design + ) where + +import Clay + +design :: Css +design = h1 ? paddingBottom (px 0) diff --git a/src/server/Design/LoggedIn/Table.hs b/src/server/Design/LoggedIn/Table.hs deleted file mode 100644 index e5ed4bf..0000000 --- a/src/server/Design/LoggedIn/Table.hs +++ /dev/null @@ -1,99 +0,0 @@ -{-# LANGUAGE OverloadedStrings #-} - -module Design.LoggedIn.Table - ( tableDesign - ) where - -import Data.Monoid ((<>)) - -import Clay -import qualified Clay.Display as D - -import Design.Color as C -import Design.Media -import Design.Constants -import Design.Helper - -tableDesign :: Css -tableDesign = - - ".table" ? do - display D.table - width (pct 100) - textAlign (alignSide (sideCenter)) - "border-spacing" -: "10 px" - - ".header" <> ".row" ? display tableRow - let headerHeight = (px 70) - - ".header" ? do - fontWeight bold - backgroundColor C.blue - color C.white - fontSize iconFontSize - lineHeight headerHeight - - ".row" ? do - 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" |> button ? visibility visible - - ".cell" ? do - display tableCell - position relative - ".category" & width (pct 40) - ".cost" & do - width (pct 17) - ".refund" & color C.green - ".user" & width (pct 20) - ".date" & do - width (pct 20) - smallScreen $ do - ".shortDate" ? display inline - ".longDate" ? display none - largeScreen $ do - ".shortDate" ? display none - ".longDate" ? display inline - ".delete" & do - position relative - width (pct 3) - textAlign (alignSide sideCenter) - button ? do - defaultButton C.red C.white (px rowHeightPx) focusLighten - borderRadius (px 0) (px 0) (px 0) (px 0) - position absolute - top (px 0) - right (px 0) - width (pct 100) - visibility hidden diff --git a/src/server/Design/SignIn.hs b/src/server/Design/SignIn.hs index 814cca3..c319d1e 100644 --- a/src/server/Design/SignIn.hs +++ b/src/server/Design/SignIn.hs @@ -1,7 +1,7 @@ {-# LANGUAGE OverloadedStrings #-} module Design.SignIn - ( signInDesign + ( design ) where import Clay @@ -10,33 +10,31 @@ import Design.Color as C import Design.Helper import Design.Constants (focusLighten) -signInDesign :: Css -signInDesign = - - ".signIn" ? do - - form ? do - let inputHeight = 50 - width (px 500) - marginTop (px 100) - marginLeft auto - marginRight auto - - input ? do - defaultInput inputHeight - display block - width (pct 100) - marginBottom (px 10) - - button ? do - iconButton C.blue C.white (px inputHeight) focusLighten - display block - width (pct 100) - fontSize (em 1.2) - ".waitingServer" & ("cursor" -: "not-allowed") - - ".result" ? do - marginTop (px 40) - textAlign (alignSide sideCenter) - ".success" ? color C.green - ".error" ? color C.redError +design :: Css +design = do + + form ? do + let inputHeight = 50 + width (px 500) + marginTop (px 100) + marginLeft auto + marginRight auto + + input ? do + defaultInput inputHeight + display block + width (pct 100) + marginBottom (px 10) + + button ? do + iconButton C.blue C.white (px inputHeight) focusLighten + display block + width (pct 100) + fontSize (em 1.2) + ".waitingServer" & ("cursor" -: "not-allowed") + + ".result" ? do + marginTop (px 40) + textAlign (alignSide sideCenter) + ".success" ? color C.green + ".error" ? color C.redError diff --git a/src/server/Model/Message/Key.hs b/src/server/Model/Message/Key.hs index 83d0467..b42cdcd 100644 --- a/src/server/Model/Message/Key.hs +++ b/src/server/Model/Message/Key.hs @@ -62,10 +62,14 @@ data Key = | Monthly | SingularMonthlyCount | PluralMonthlyCount + | Payment + | Payments -- Statistics | Statistics + | Overall + | ByMonths -- Income diff --git a/src/server/Model/Message/Translations.hs b/src/server/Model/Message/Translations.hs index 8c1ba08..1d3fbe6 100644 --- a/src/server/Model/Message/Translations.hs +++ b/src/server/Model/Message/Translations.hs @@ -231,18 +231,24 @@ m l Monthly = French -> "Mensuel" m l SingularMonthlyCount = - T.concat - [ case l of - English -> "{1} monthly payment of {2}" - French -> "{1} paiement mensuel de {2}" - ] + case l of + English -> "{1} monthly payment of {2}" + French -> "{1} paiement mensuel de {2}" m l PluralMonthlyCount = - T.concat - [ case l of - English -> "{1} monthly payments totalling {2}" - French -> "{1} paiements mensuels comptabilisant {2}" - ] + case l of + English -> "{1} monthly payments totalling {2}" + French -> "{1} paiements mensuels comptabilisant {2}" + +m l Payment = + case l of + English -> "payment" + French -> "paiement" + +m l Payments = + case l of + English -> "payments" + French -> "paiements" -- Statistics @@ -251,6 +257,16 @@ m l Statistics = English -> "Statistics" French -> "Statistiques" +m l Overall = + case l of + English -> "Overall" + French -> "Global" + +m l ByMonths = + case l of + English -> "By months" + French -> "Par mois" + -- Income m l AddIncome = |