Show resume and projects from a configuration file

1 files changed, 125 insertions, 0 deletions

diff --git a/src/Design/Resume.hs b/src/Design/Resume.hs
new file mode 100644
index 0000000..d668987
--- /dev/null
+++ b/src/Design/Resume.hs
@@ -0,0 +1,125 @@
+{-# LANGUAGE OverloadedStrings #-}
+
+module Design.Resume
+  ( resumeCss
+  ) where
+
+import           Prelude      hiding ((**))
+
+import           Clay
+import qualified Clay.Flexbox as CF
+
+import qualified Design.Color as Color
+import qualified Design.Media as Media
+import qualified Design.Size  as Size
+
+resumeCss :: Css
+resumeCss =
+  ".section" ? do
+    position relative
+    margin (pct 0) (pct 10) (pct 0) (pct 10)
+
+    h1 ? textTransform capitalize
+
+    ".identity" ? do
+      ".mail" <> ".git" ? do
+        Size.indentation
+        i ? marginRight (em 0.5)
+
+        Media.mobile $ do
+          fontSize (px 14)
+          marginBottom (px 15)
+
+        Media.tablet $ do
+          fontSize (px 18)
+          marginBottom (px 25)
+
+        Media.desktop $ do
+          fontSize (px 20)
+          marginBottom (px 30)
+
+    ".pdf" ? do
+      position absolute
+      right (px 0)
+      top (px 0)
+      color Color.red
+      transition "all" (ms 100) ease (sec 0)
+      i ? marginRight (px 0)
+      hover & transform (scale 1.2 1.2)
+
+      Media.mobile $ do
+        lineHeight (px 30)
+        height (px 30)
+        fontSize (px 20)
+
+      Media.tablet $ do
+        lineHeight (px 40)
+        height (px 40)
+        fontSize (px 30)
+
+      Media.desktop $ do
+        lineHeight (px 50)
+        height (px 50)
+        fontSize (px 40)
+
+    ".item" ? do
+      marginBottom (px 40)
+      Size.indentation
+      Media.mobile $ marginBottom (px 25)
+
+      ".title" <> ".location" <> ".description" ? do
+        Size.lineHeight
+
+      ".title" ? do
+        Media.desktop $ do
+          display flex
+          marginBottom (px 10)
+
+        ".skills" & do
+          Size.tabletMarginBottom
+
+        ".text" ? do
+          backgroundColor Color.orange
+          color Color.white
+          padding (px 0) (px 10) (px 0) (px 10)
+          sym borderRadius (px 2)
+          Media.mobileTablet $ marginBottom (px 10)
+
+        ".date" ? do
+          fontStyle italic
+          Media.mobile $ fontSize (pct 90)
+          Media.desktop $ marginLeft (px 15)
+
+      ".description" ? ".detail" ?
+        marginTop Size.listItemSep
+
+      ".location" ? do
+        color Color.green
+        Media.mobile $ do
+          fontSize (pct 90)
+          marginBottom (px 10)
+        Size.tabletMarginBottom
+
+    ".itemList" ? marginTop (px 5)
+
+    ".bullets" |> ".detail" ? do
+      Media.mobile $ marginBottom Size.listItemSep
+      Size.tabletMarginBottom
+
+    ".bullets" |> li ? do
+      Size.lineHeight
+      before & do
+        content (stringContent "•")
+        color Color.red
+        display inlineBlock
+        marginRight (px 10)
+
+    ".technos" ? do
+      display flex
+      flexWrap CF.wrap
+      sym2 margin (px 5) (px 0)
+
+    ".technos" |> ".techno" ? do
+      lineHeight normal
+      borderBottom solid (px 2) lightgray
+      margin (px 10) (px 15) (px 5) (px 0)