From 5bfd349bedb9c395cbeb38bb888e379ba36d5d35 Mon Sep 17 00:00:00 2001 From: Joris Date: Wed, 30 Dec 2015 17:01:56 +0100 Subject: Minor design modifications --- src/server/Design/Header.hs | 4 +++- src/server/Design/Helper.hs | 23 +++++++++++++++++++++-- src/server/Design/Media.hs | 2 +- src/server/Design/SignIn.hs | 9 +++++++-- 4 files changed, 32 insertions(+), 6 deletions(-) (limited to 'src/server/Design') diff --git a/src/server/Design/Header.hs b/src/server/Design/Header.hs index 9f83778..5ef3fb0 100644 --- a/src/server/Design/Header.hs +++ b/src/server/Design/Header.hs @@ -6,6 +6,8 @@ module Design.Header import Clay +import Data.Monoid ((<>)) + import Design.Color as C import Design.Constants @@ -36,4 +38,4 @@ headerDesign = backgroundColor C.red color C.white fontSize iconFontSize - hover & transform (scale 1.2 1.2) + hover & i ? transform (scale 1.2 1.2) diff --git a/src/server/Design/Helper.hs b/src/server/Design/Helper.hs index 6e2fde3..bd11766 100644 --- a/src/server/Design/Helper.hs +++ b/src/server/Design/Helper.hs @@ -3,14 +3,19 @@ module Design.Helper ( clearFix , defaultButton + , iconButton , defaultInput , centeredWithMargin , expandBlock , verticalCentering ) where +import Prelude hiding (span) + import Clay +import Data.Monoid ((<>)) + import Design.Constants import Design.Color as C import qualified Clay.Display as D @@ -23,15 +28,29 @@ clearFix = clear both defaultButton :: Color -> Color -> Size Abs -> Css -defaultButton backgroundCol textCol height = do +defaultButton backgroundCol textCol h = do backgroundColor backgroundCol color textCol borderRadius radius radius radius radius verticalAlign middle cursor pointer - lineHeight height + lineHeight h textAlign (alignSide sideCenter) +iconButton :: Color -> Color -> Size Abs -> Css +iconButton backgroundCol textCol h = do + defaultButton backgroundCol textCol h + i <> span ? do + height h + lineHeight h + span ? do + display inlineBlock + marginLeft (px 20) + i ? do + marginLeft (px 20) + marginRight (px 20) + hover & i ? transform (scale 1.2 1.2) + defaultInput :: Integer -> Css defaultInput inputHeight = do height (px inputHeight) diff --git a/src/server/Design/Media.hs b/src/server/Design/Media.hs index 925e2f9..df91505 100644 --- a/src/server/Design/Media.hs +++ b/src/server/Design/Media.hs @@ -11,7 +11,7 @@ limit :: Integer limit = 950 smallFeature :: [Feature] -smallFeature = [M.maxWidth (px (limit - 1))] +smallFeature = [M.maxWidth (px limit)] largeFeature :: [Feature] largeFeature = [M.minWidth (px limit)] diff --git a/src/server/Design/SignIn.hs b/src/server/Design/SignIn.hs index 7aff720..92e485b 100644 --- a/src/server/Design/SignIn.hs +++ b/src/server/Design/SignIn.hs @@ -8,15 +8,20 @@ import Clay import Design.Color as C import Design.Helper -import Design.Animation.Opacity signInDesign :: Css signInDesign = ".signIn" ? do + button ? do + display block + margin (em 5) auto (em 2) auto + iconButton C.blue C.white (em 2.5) + fontSize (em 1.5) + position relative + ".result" ? do - marginTop (px 40) textAlign (alignSide sideCenter) ".success" ? color C.greenSuccess ".error" ? color C.redError -- cgit v1.2.3