aboutsummaryrefslogtreecommitdiff
path: root/src/server/Design/LoggedIn
diff options
context:
space:
mode:
Diffstat (limited to 'src/server/Design/LoggedIn')
-rw-r--r--src/server/Design/LoggedIn/Add.hs13
-rw-r--r--src/server/Design/LoggedIn/Expandables.hs9
-rw-r--r--src/server/Design/LoggedIn/Pages.hs7
-rw-r--r--src/server/Design/LoggedIn/Table.hs52
4 files changed, 58 insertions, 23 deletions
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