From fe50c4042848681833d15fab27466d1d2d4bda45 Mon Sep 17 00:00:00 2001 From: Joris Date: Tue, 5 Apr 2016 23:52:13 +0200 Subject: Ameliore design in income page and stat page --- src/server/Design/LoggedIn/Home/Table.hs | 97 ++++++++++++++++++++++++++++++++ 1 file changed, 97 insertions(+) create mode 100644 src/server/Design/LoggedIn/Home/Table.hs (limited to 'src/server/Design/LoggedIn/Home/Table.hs') 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 -- cgit v1.2.3