feat: add sass support

5 files changed, 31 insertions, 3 deletions

diff --git a/.gitignore b/.gitignore
index b3d7013..e769f21 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,4 +1,5 @@
 .direnv/
+.sass-cache/
 result
 result/
 _cache
diff --git a/css/default.css b/css/default.scss
index 381ff73..a33ba78 100644
--- a/css/default.css
+++ b/css/default.scss
@@ -42,7 +42,9 @@ h2 {
 article .header {
   font-size: 1.4rem;
   font-style: italic;
-  color: #555;
+  /* color: #555; */
+  $myColor: red;
+  color: $myColor;
 }
 
 .logo a {
@@ -57,23 +59,29 @@ article .header {
     margin: 0;
     padding: 0 5%;
   }
+
   header {
     margin: 4.2rem 0;
   }
+
   nav {
     margin: 0 auto 3rem;
     text-align: center;
   }
+
   footer {
     text-align: center;
   }
+
   .logo {
     text-align: center;
     margin: 1rem auto 3rem;
   }
+
   .logo a {
     font-size: 2.4rem;
   }
+
   nav a {
     display: block;
     line-height: 1.6;
@@ -86,23 +94,29 @@ article .header {
     margin: 0;
     padding: 0 5%;
   }
+
   header {
     margin: 4.2rem 0;
   }
+
   nav {
     margin: 0 auto 3rem;
     text-align: center;
   }
+
   footer {
     text-align: center;
   }
+
   .logo {
     text-align: center;
     margin: 1rem auto 3rem;
   }
+
   .logo a {
     font-size: 2.4rem;
   }
+
   nav a {
     display: inline;
     margin: 0 0.6rem;
@@ -115,27 +129,33 @@ article .header {
     margin: 0 auto;
     padding: 0;
   }
+
   header {
     margin: 0 0 3rem;
     padding: 1.2rem 0;
   }
+
   nav {
     margin: 0;
     text-align: right;
   }
+
   nav a {
     margin: 0 0 0 1.2rem;
     display: inline;
   }
+
   footer {
     text-align: right;
   }
+
   .logo {
     margin: 0;
     text-align: left;
   }
+
   .logo a {
     float: left;
     font-size: 1.8rem;
   }
-}
+}
\ No newline at end of file
diff --git a/flake.nix b/flake.nix
index 33c3149..aa7851f 100644
--- a/flake.nix
+++ b/flake.nix
@@ -25,7 +25,7 @@
             tools = hp: {inherit (hp) hakyll;};
             hlsCheck.enable = true;
             mkShellArgs = {
-              buildInputs = [pkgs.just];
+              buildInputs = with pkgs; [just sass];
               shellHook = "just -l -u";
             };
           };
diff --git a/site.hs b/site.hs
index 851d53d..a392545 100644
--- a/site.hs
+++ b/site.hs
@@ -3,6 +3,7 @@
 
 import Data.Monoid (mappend)
 import Hakyll
+import Hakyll.Web.Sass (sassCompiler)
 
 --------------------------------------------------------------------------------
 main :: IO ()
@@ -15,6 +16,11 @@ main = hakyll $ do
     route   idRoute
     compile compressCssCompiler
 
+  match "css/*.scss" $ do
+    route $ setExtension "css"
+    let compressCssItem = fmap compressCss
+    compile (compressCssItem <$> sassCompiler)
+
   match (fromList ["about.rst", "contact.markdown"]) $ do
     route $ setExtension "html"
     compile $
diff --git a/skiletro.cabal b/skiletro.cabal
index 993f0b9..36dda08 100644
--- a/skiletro.cabal
+++ b/skiletro.cabal
@@ -7,5 +7,6 @@ executable site
   main-is:          site.hs
   build-depends:    base == 4.*
                   , hakyll == 4.16.*
+                  , hakyll-sass == 0.2.*
   ghc-options:      -threaded -rtsopts -with-rtsopts=-N
   default-language: Haskell2010