aboutsummaryrefslogtreecommitdiff
path: root/src/server/Design
diff options
context:
space:
mode:
Diffstat (limited to 'src/server/Design')
-rw-r--r--src/server/Design/Animation/Keyframes.hs26
-rw-r--r--src/server/Design/Animation/Opacity.hs17
-rw-r--r--src/server/Design/Global.hs3
-rw-r--r--src/server/Design/LoggedIn.hs3
-rw-r--r--src/server/Design/SignIn.hs3
5 files changed, 52 insertions, 0 deletions
diff --git a/src/server/Design/Animation/Keyframes.hs b/src/server/Design/Animation/Keyframes.hs
new file mode 100644
index 0000000..3ea5575
--- /dev/null
+++ b/src/server/Design/Animation/Keyframes.hs
@@ -0,0 +1,26 @@
+{-# LANGUAGE OverloadedStrings #-}
+
+module Design.Animation.Keyframes
+ ( Keyframes(..)
+ , allKeyframes
+ ) where
+
+import Data.String (fromString)
+
+import Clay
+
+data Keyframes =
+ OpacityKeyframes
+ deriving (Eq, Show)
+
+allKeyframes :: Css
+allKeyframes =
+ keyframes
+ (fromString . show $ OpacityKeyframes)
+ [ ( 0
+ , opacity 0
+ )
+ , ( 100
+ , opacity 1
+ )
+ ]
diff --git a/src/server/Design/Animation/Opacity.hs b/src/server/Design/Animation/Opacity.hs
new file mode 100644
index 0000000..cc720fd
--- /dev/null
+++ b/src/server/Design/Animation/Opacity.hs
@@ -0,0 +1,17 @@
+{-# 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 092e66e..9f5a4fc 100644
--- a/src/server/Design/Global.hs
+++ b/src/server/Design/Global.hs
@@ -11,6 +11,7 @@ import Data.Text.Lazy (Text)
import Design.Header
import Design.SignIn
import Design.LoggedIn
+import Design.Animation.Keyframes
globalDesign :: Text
globalDesign = renderWith compact [] global
@@ -23,6 +24,8 @@ global = do
minWidth (px 550)
fontFamily ["Cantarell"] [sansSerif]
+ allKeyframes
+
signInDesign
headerDesign
diff --git a/src/server/Design/LoggedIn.hs b/src/server/Design/LoggedIn.hs
index 35a30a6..d35276b 100644
--- a/src/server/Design/LoggedIn.hs
+++ b/src/server/Design/LoggedIn.hs
@@ -10,12 +10,15 @@ import Design.LoggedIn.Add
import Design.LoggedIn.Expandables
import Design.LoggedIn.Table
import Design.LoggedIn.Pages
+import Design.Animation.Opacity
loggedInDesign :: Css
loggedInDesign =
".loggedIn" ? do
+ opacityAnimation
+
addDesign
expandablesDesign
diff --git a/src/server/Design/SignIn.hs b/src/server/Design/SignIn.hs
index 2350c54..6bacc3a 100644
--- a/src/server/Design/SignIn.hs
+++ b/src/server/Design/SignIn.hs
@@ -8,12 +8,15 @@ import Clay
import Design.Color as C
import Design.Helper
+import Design.Animation.Opacity
signInDesign :: Css
signInDesign =
".signIn" ? do
+ opacityAnimation
+
form ? do
let inputHeight = 50
width (px 500)