Trying to write css

1 files changed, 108 insertions, 0 deletions

diff --git a/src/WWW/Css.hs b/src/WWW/Css.hs
new file mode 100644
index 0000000..164b2af
--- /dev/null
+++ b/src/WWW/Css.hs
@@ -0,0 +1,108 @@
+module WWW.Css where
+
+import Control.Monad
+import Clay
+import Clay.Flexbox qualified as F
+import Data.Text (Text)
+import Diagrams.Attributes (SomeColor)
+
+import WWW.Colors qualified as G
+
+
+
+colorVariables :: G.Gruvbox SomeColor -> Css
+colorVariables gb = do
+    "--html-bg" -: "test"
+
+rootColors :: Css
+rootColors = do
+    ":root[color-mode=light]" ? do
+        colorVariables G.gruvboxLightH
+    ":root[color-mode=dark]" ? do
+        colorVariables G.gruvboxDarkH
+
+general :: Css
+general = do
+    html ? do
+        fontFamily [ "Fira Sans" ] [ sansSerif ]
+        backgroundColor $ cvar "html-bg"
+        color $ cvar "fg"
+        margin (em 1) auto auto auto
+    body ? do
+        backgroundColor $ cvar "bg"
+        join4 margin auto
+        maxWidth (cm 30)
+        border (px 1) solid $ cvar "fg"
+        join4 padding $ em 1
+    a ? do
+        color $ cvar "href"
+        textDecoration underline
+        hover & do
+            color $ cvar "href-hover"
+    header ? do
+        padding nil nil nil nil
+        margin nil nil nil nil
+        fontSize $ em 1
+        fontWeight bold
+        textDecoration none
+    footer ? do
+        clear both
+        paddingTop $ px 10
+        paddingBottom $ px 15
+        fontWeight bold
+        hr ? do
+            borderTop (px 3) double $ cvar "hr"
+            borderBottomWidth 0
+        a ? do
+            textDecoration none
+            color $ cvar "footer-href"
+        a # hover ? do
+            textDecoration underline
+            color $ cvar "footer-href-hover"
+    code ? do
+        fontFamily [ "Fira Code" ] [ monospace ]
+        backgroundColor $ cvar "code-bg"
+        join4 padding $ px 2
+
+
+someClasses :: Css
+someClasses = do
+    ".pull-left" ? do
+        float floatLeft
+    ".pull-right" ? do
+        float floatRight
+
+menu :: Css
+menu = do
+    clear both
+    display block
+    "width" -: "100%"
+    margin 0 0 (em 1) 0
+    color $ cvar "bg"
+    backgroundColor $ cvar "fg"
+    "overflow" -: "hidden"
+    a ? do
+        display block
+        float floatLeft
+        padding (px 5) (px 10) (px 5) (px 10)
+        color $ cvar "bg"
+    a # hover ? do
+        color $ cvar "href-hover"
+
+
+
+
+-- helpers
+
+join3 :: Monad m => m (m (m a)) -> m a
+join3 = join . join
+
+join4 :: Monad m => m (m (m (m a))) -> m a
+join4 = join . join3
+
+cvar :: Text -> Color
+cvar n = Other $ value $ "var(--" <> n <> ")"
+-- root :: Css
+-- root = do
+--     ":root" ? do
+--         "--