From fd75be6abe51449c1b6eb6972983d63cd42c0f8b Mon Sep 17 00:00:00 2001
From: efim <efim.nefedov@nordigy.ru>
Date: Sun, 25 Jun 2023 20:06:30 +0000
Subject: [PATCH] feat: enabling TailwindCSS styling

with manual running of cli:
tailwindcss -i ./src/input.css -o ./dist/output.css --watch
---
 .gitignore                                    |  1 +
 flake.nix                                     |  1 +
 scala-cli-cask-attempt/src/input.css          |  3 +++
 .../src/main/scala/app/Main.scala             | 20 +++++++++++++++++--
 scala-cli-cask-attempt/tailwind.config.js     |  9 +++++++++
 5 files changed, 32 insertions(+), 2 deletions(-)
 create mode 100644 scala-cli-cask-attempt/src/input.css
 create mode 100644 scala-cli-cask-attempt/tailwind.config.js

diff --git a/.gitignore b/.gitignore
index cd9fb00..4d3c838 100644
--- a/.gitignore
+++ b/.gitignore
@@ -2,3 +2,4 @@
 .scala-build/
 .metals/
 .direnv
+*/dist/
diff --git a/flake.nix b/flake.nix
index 74b4d98..fec5605 100644
--- a/flake.nix
+++ b/flake.nix
@@ -13,6 +13,7 @@
               pkgs.scala-cli
               pkgs.sbt
               pkgs.scalafmt
+              pkgs.nodePackages.tailwindcss
             ];
           };
         }
diff --git a/scala-cli-cask-attempt/src/input.css b/scala-cli-cask-attempt/src/input.css
new file mode 100644
index 0000000..b5c61c9
--- /dev/null
+++ b/scala-cli-cask-attempt/src/input.css
@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
diff --git a/scala-cli-cask-attempt/src/main/scala/app/Main.scala b/scala-cli-cask-attempt/src/main/scala/app/Main.scala
index 0f040f9..242767f 100644
--- a/scala-cli-cask-attempt/src/main/scala/app/Main.scala
+++ b/scala-cli-cask-attempt/src/main/scala/app/Main.scala
@@ -6,6 +6,7 @@ package app
 
 import scalatags.Text.all._
 import scala.util.Random
+import scalatags.Text.tags2
 
 object Main extends cask.MainRoutes {
   @cask.get("/")
@@ -13,15 +14,27 @@ object Main extends cask.MainRoutes {
     doctype("html")(
       html(
         head(
+          tags2.title("Trying out the starter page"),
+          meta(
+            charset := "UTF-8"
+          ),
+          meta(
+            name := "viewport",
+            content := "width=device-width, initial-scale=1.0"
+          ),
+          link(rel := "stylesheet", href := "/dist/output.css")
           // title("Hello testing")
         ),
         body(
+          cls := "bg-blue-50 grid place-content-center h-screen",
           div(
-            h1("This is it, the start"),
+            h1(
+              cls := "text-2xl font-bold",
+              "This is it, the start"),
             p("Let's keep going"),
             ul(
               Range(1, 15).map(index =>
-                li(a(s"article with number $index", href := s"/article/$index"))
+                li(a(s"article with number $index", href := s"/article/$index", cls := "underline text-blue-500"))
               )
             )
           )
@@ -30,6 +43,9 @@ object Main extends cask.MainRoutes {
     )
   }
 
+  @cask.staticFiles("/dist")
+  def staticFileRoutes() = "/dist"
+
   @cask.get("/article/:id")
   def articlePage(id: Long) = {
     doctype("html")(
diff --git a/scala-cli-cask-attempt/tailwind.config.js b/scala-cli-cask-attempt/tailwind.config.js
new file mode 100644
index 0000000..5ff1852
--- /dev/null
+++ b/scala-cli-cask-attempt/tailwind.config.js
@@ -0,0 +1,9 @@
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+    content: ["./src/**/*.scala"],
+  theme: {
+    extend: {},
+  },
+  plugins: [],
+}
+