aboutsummaryrefslogtreecommitdiff
path: root/src/server/Design
diff options
context:
space:
mode:
Diffstat (limited to 'src/server/Design')
-rw-r--r--src/server/Design/Global.hs46
1 files changed, 28 insertions, 18 deletions
diff --git a/src/server/Design/Global.hs b/src/server/Design/Global.hs
index 098269b..80498f8 100644
--- a/src/server/Design/Global.hs
+++ b/src/server/Design/Global.hs
@@ -17,12 +17,15 @@ import Design.Media
globalDesign :: Text
globalDesign = renderWith compact [] global
-iconFontSize :: Integer
-iconFontSize = 32
+iconFontSize :: Size Abs
+iconFontSize = px 32
radius :: Size Abs
radius = px 3
+blockPadding :: Size Abs
+blockPadding = px 15
+
global :: Css
global = do
@@ -50,28 +53,27 @@ global = do
backgroundColor C.white
color C.red
borderWidth (px 0)
- fontSize (px iconFontSize)
+ fontSize iconFontSize
hover & transform (scale 1.2 1.2)
".payments" ? do
let inputHeight = 40
".exceedingPayers" ? do
- width (pct 95)
- margin (px 0) auto (px 45) auto
- padding (px 15) (px 15) (px 15) (px 15)
+ centeredWithMargin
backgroundColor C.green
color C.white
fontWeight bold
- borderRadius (px 5) (px 5) (px 5) (px 5)
+ borderRadius radius radius radius radius
+ paddingLeft blockPadding
+ paddingRight blockPadding
- ".exceedingPayer" Clay.** ".userName" ? marginRight (px 10)
+ ".exceedingPayer" ? do
+ lineHeight (px inputHeight)
+ ".userName" ? marginRight (px 10)
form # ".add" ? do
- width (pct 95)
- marginLeft auto
- marginRight auto
- marginBottom (px 45)
+ centeredWithMargin
clearFix
".name" <> ".cost" ? do
@@ -141,8 +143,7 @@ global = do
left (px 0)
".monthlyPayments" ? do
- width (pct 95)
- margin (px 0) auto (px 45) auto
+ centeredWithMargin
button # ".count" ? do
width (pct 100)
@@ -150,6 +151,8 @@ global = do
borderRadius radius radius radius radius
textAlign (alignSide sideLeft)
position relative
+ paddingLeft blockPadding
+ paddingRight blockPadding
".expand" ? do
float floatRight
@@ -171,7 +174,7 @@ global = do
fontWeight bold
backgroundColor C.red
color C.white
- fontSize (px iconFontSize)
+ fontSize iconFontSize
lineHeight (px 70)
".row" ? do
@@ -181,7 +184,7 @@ global = do
nthChild "odd" & backgroundColor C.lightGrey
".edition" & do
backgroundColor C.paymentFocus
- ".remove" ? visibility visible
+ ".delete" ? visibility visible
".cell" ? do
display tableCell
@@ -196,7 +199,7 @@ global = do
largeScreen $ do
".shortDate" ? display none
".longDate" ? display inline
- ".remove" & do
+ ".delete" & do
width (px 10)
height (px 10)
textAlign (alignSide sideCenter)
@@ -212,7 +215,7 @@ global = do
display inlineBlock
border solid (px 2) C.darkGrey
color C.darkGrey
- borderRadius (px 2) (px 2) (px 2) (px 2)
+ borderRadius radius radius radius radius
marginRight (px 10)
let side = 50
width (px side)
@@ -280,3 +283,10 @@ defaultInput inputHeight = do
border solid (px 1) C.darkGrey
focus & borderColor C.grey
verticalAlign middle
+
+centeredWithMargin :: Css
+centeredWithMargin = do
+ width (pct 95)
+ marginLeft auto
+ marginRight auto
+ marginBottom (px 45)