diff --git a/Cargo.lock b/Cargo.lock
index 127e4f0..26eb64a 100644
--- a/Cargo.lock
+++ b/Cargo.lock
@@ -153,7 +153,7 @@ dependencies = [
  "actix-utils",
  "futures-core",
  "futures-util",
- "mio",
+ "mio 1.0.2",
  "socket2 0.5.7",
  "tokio",
  "tokio-uring",
@@ -1076,6 +1076,7 @@ dependencies = [
  "migration",
  "redis",
  "rswind",
+ "rswind_cli",
  "sea-orm",
  "serde",
  "serde_json",
@@ -1479,6 +1480,27 @@ version = "2.1.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "e8c02a5121d4ea3eb16a80748c74f5549a5665e4c21333c6098f283870fbdea6"
 
+[[package]]
+name = "file-id"
+version = "0.2.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "6584280525fb2059cba3db2c04abf947a1a29a45ddae89f3870f8281704fafc9"
+dependencies = [
+ "windows-sys 0.48.0",
+]
+
+[[package]]
+name = "filetime"
+version = "0.2.25"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "35c0522e981e68cbfa8c3f978441a5f34b30b96e146b33cd3359176b50fe8586"
+dependencies = [
+ "cfg-if",
+ "libc",
+ "libredox",
+ "windows-sys 0.59.0",
+]
+
 [[package]]
 name = "flume"
 version = "0.11.1"
@@ -1505,6 +1527,15 @@ dependencies = [
  "percent-encoding",
 ]
 
+[[package]]
+name = "fsevent-sys"
+version = "4.1.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "76ee7a02da4d231650c7cea31349b889be2f45ddb3ef3032d2ec8185f6313fd2"
+dependencies = [
+ "libc",
+]
+
 [[package]]
 name = "funty"
 version = "2.0.0"
@@ -1686,6 +1717,7 @@ dependencies = [
  "bstr",
  "regex-automata 0.4.8",
  "regex-syntax 0.8.5",
+ "serde",
 ]
 
 [[package]]
@@ -1914,6 +1946,26 @@ dependencies = [
  "syn 2.0.82",
 ]
 
+[[package]]
+name = "inotify"
+version = "0.9.6"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "f8069d3ec154eb856955c1c0fbffefbf5f3c40a104ec912d4797314c1801abff"
+dependencies = [
+ "bitflags 1.3.2",
+ "inotify-sys",
+ "libc",
+]
+
+[[package]]
+name = "inotify-sys"
+version = "0.1.5"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "e05c02b5e89bff3b946cedeca278abc628fe811e604f027c45a8aa3cf793d0eb"
+dependencies = [
+ "libc",
+]
+
 [[package]]
 name = "inout"
 version = "0.1.3"
@@ -1983,6 +2035,26 @@ dependencies = [
  "serde",
 ]
 
+[[package]]
+name = "kqueue"
+version = "1.0.8"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "7447f1ca1b7b563588a205fe93dea8df60fd981423a768bc1c0ded35ed147d0c"
+dependencies = [
+ "kqueue-sys",
+ "libc",
+]
+
+[[package]]
+name = "kqueue-sys"
+version = "1.0.4"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "ed9625ffda8729b85e45cf04090035ac368927b8cebc34898e7c120f52e4838b"
+dependencies = [
+ "bitflags 1.3.2",
+ "libc",
+]
+
 [[package]]
 name = "kv-log-macro"
 version = "1.0.7"
@@ -2029,6 +2101,17 @@ version = "0.2.8"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "4ec2a862134d2a7d32d7983ddcdd1c4923530833c9f2ea1a44fc5fa473989058"
 
+[[package]]
+name = "libredox"
+version = "0.1.3"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "c0ff37bd590ca25063e35af745c343cb7a0271906fb7b37e4813e8f79f00268d"
+dependencies = [
+ "bitflags 2.6.0",
+ "libc",
+ "redox_syscall",
+]
+
 [[package]]
 name = "libsqlite3-sys"
 version = "0.30.1"
@@ -2199,6 +2282,18 @@ dependencies = [
  "adler2",
 ]
 
+[[package]]
+name = "mio"
+version = "0.8.11"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "a4a650543ca06a924e8b371db273b2756685faae30f8487da1b56505a8f78b0c"
+dependencies = [
+ "libc",
+ "log",
+ "wasi",
+ "windows-sys 0.48.0",
+]
+
 [[package]]
 name = "mio"
 version = "1.0.2"
@@ -2273,6 +2368,39 @@ dependencies = [
  "minimal-lexical",
 ]
 
+[[package]]
+name = "notify"
+version = "6.1.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "6205bd8bb1e454ad2e27422015fb5e4f2bcc7e08fa8f27058670d208324a4d2d"
+dependencies = [
+ "bitflags 2.6.0",
+ "crossbeam-channel",
+ "filetime",
+ "fsevent-sys",
+ "inotify",
+ "kqueue",
+ "libc",
+ "log",
+ "mio 0.8.11",
+ "walkdir",
+ "windows-sys 0.48.0",
+]
+
+[[package]]
+name = "notify-debouncer-full"
+version = "0.3.2"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "fb7fd166739789c9ff169e654dc1501373db9d80a4c3f972817c8a4d7cf8f34e"
+dependencies = [
+ "crossbeam-channel",
+ "file-id",
+ "log",
+ "notify",
+ "parking_lot",
+ "walkdir",
+]
+
 [[package]]
 name = "nu-ansi-term"
 version = "0.46.0"
@@ -3129,6 +3257,30 @@ dependencies = [
  "wasm-bindgen",
 ]
 
+[[package]]
+name = "rswind_cli"
+version = "0.0.1-alpha.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "f3d818e725a7f58844c2a90a4a7fd48b1bfb119bb9b2eb8270c8a039c47801f0"
+dependencies = [
+ "clap",
+ "colored",
+ "config",
+ "cssparser",
+ "globset",
+ "notify",
+ "notify-debouncer-full",
+ "rayon",
+ "rswind",
+ "rswind_extractor",
+ "rustc-hash",
+ "smol_str",
+ "thiserror",
+ "tracing",
+ "tracing-subscriber",
+ "walkdir",
+]
+
 [[package]]
 name = "rswind_common"
 version = "0.0.1-alpha.1"
@@ -4119,7 +4271,7 @@ dependencies = [
  "backtrace",
  "bytes",
  "libc",
- "mio",
+ "mio 1.0.2",
  "parking_lot",
  "pin-project-lite",
  "signal-hook-registry",
diff --git a/Cargo.toml b/Cargo.toml
index de98b1a..2226749 100644
--- a/Cargo.toml
+++ b/Cargo.toml
@@ -13,11 +13,11 @@ redis = { version = "0.27.5", features = ["tokio", "json", "uuid", "tokio-comp",
 sea-orm = { version = "1.1.0", default-features = false, features = ["chrono", "macros", "runtime-actix-rustls", "serde_json", "sqlx-postgres", "with-uuid"] }
 tracing = "0.1.40"
 tracing-subscriber = "0.3.18"
-rswind = "0.0.1-alpha.1"
 serde = "1.0.210"
 serde_json = "1.0.132"
 uuid = { version = "1.11.0", features = ["v4", "v8"] }
 migration = { path = "./migration" }
+rswind = "0.0.1-alpha.1"
+rswind_cli = "0.0.1-alpha.1"
 
 [build-dependencies]
-rswind = "0.0.1-alpha.1"
diff --git a/build.rs b/build.rs
index 0c9afba..1501d1a 100644
--- a/build.rs
+++ b/build.rs
@@ -1,6 +1,3 @@
-use glob::GlobMatcher;
-use rswind::*;
-
 fn main() {
     // let mut p = create_app();
     // p.processor.options.watch = false;
diff --git a/src/main.rs b/src/main.rs
index e0fd3f1..6b59fc9 100644
--- a/src/main.rs
+++ b/src/main.rs
@@ -15,6 +15,7 @@ mod entities;
 #[derive(Debug, Template)]
 #[template(path = "recipe_card.html")]
 struct RecipeCard {
+    id: i64,
     author: Option<String>,
     image_url: String,
     title: String,
@@ -131,6 +132,7 @@ async fn index_html(db: Data<DatabaseConnection>) -> IndexTemplate {
         recipies: recipies
             .into_iter()
             .map(|r| RecipeCard {
+                id: r.id,
                 author: r.author,
                 image_url: r.image_url.unwrap_or_default(),
                 title: r.title,
@@ -200,6 +202,7 @@ async fn styles_css() -> HttpResponse {
 #[actix_web::main]
 async fn main() {
     let _ = tracing_subscriber::fmt::init();
+    // rswind_cli::cli(["--cwd", ".", "-o", "./templates/styles.css"]);
 
     tracing::info!("You can define admins by setting env variable ADMINS");
     tracing::info!("    Example: ADMINS=login1:pass1,login2,pass2");
diff --git a/templates/recipe_card.html b/templates/recipe_card.html
index 45c909d..4f69d1b 100644
--- a/templates/recipe_card.html
+++ b/templates/recipe_card.html
@@ -1,4 +1,4 @@
-<div class="card hover:shadow-lg transition ease-linear transform hover:scale-105">
+<a class="card hover:shadow-lg transition ease-linear transform hover:scale-105" href="/recipies/{{id}}">
     <img src={{image_url}} alt="noodles" class="w-full h-32 md:h-48 object-cover">
     <div class="m-4">
         <span class="font-bold">{{title}}</span>
@@ -19,4 +19,4 @@
     </div>
         {% when None %}
         {% endmatch %}
-</div>
+</a>
diff --git a/templates/styles.css b/templates/styles.css
index 0433949..9aa2888 100644
--- a/templates/styles.css
+++ b/templates/styles.css
@@ -560,10 +560,42 @@ video {
   margin: 1rem;
 }
 
+.mb-2{
+  margin-bottom: 0.5rem;
+}
+
+.mb-3{
+  margin-bottom: 0.75rem;
+}
+
+.mb-5{
+  margin-bottom: 1.25rem;
+}
+
+.mb-7{
+  margin-bottom: 1.75rem;
+}
+
 .ml-2{
   margin-left: 0.5rem;
 }
 
+.ml-6{
+  margin-left: 1.5rem;
+}
+
+.ml-auto{
+  margin-left: auto;
+}
+
+.mr-2{
+  margin-right: 0.5rem;
+}
+
+.mr-auto{
+  margin-right: auto;
+}
+
 .mt-12{
   margin-top: 3rem;
 }
@@ -580,54 +612,6 @@ video {
   margin-top: 2rem;
 }
 
-.mb-2{
-  margin-bottom: 0.5rem;
-}
-
-.mb-3{
-  margin-bottom: 0.75rem;
-}
-
-.mb-5{
-  margin-bottom: 1.25rem;
-}
-
-.mb-6{
-  margin-bottom: 1.5rem;
-}
-
-.mb-7{
-  margin-bottom: 1.75rem;
-}
-
-.mb-8{
-  margin-bottom: 2rem;
-}
-
-.ml-6{
-  margin-left: 1.5rem;
-}
-
-.ml-\[1\.7rem\]{
-  margin-left: 1.7rem;
-}
-
-.ml-auto{
-  margin-left: auto;
-}
-
-.mr-4{
-  margin-right: 1rem;
-}
-
-.mr-auto{
-  margin-right: auto;
-}
-
-.mr-2{
-  margin-right: 0.5rem;
-}
-
 .block{
   display: block;
 }
@@ -640,10 +624,6 @@ video {
   display: flex;
 }
 
-.table{
-  display: table;
-}
-
 .grid{
   display: grid;
 }
@@ -672,10 +652,6 @@ video {
   width: 1.5rem;
 }
 
-.w-full{
-  width: 100%;
-}
-
 .w-\[20\.2rem\]{
   width: 20.2rem;
 }
@@ -684,9 +660,8 @@ video {
   width: 20rem;
 }
 
-.w-fit{
-  width: -moz-fit-content;
-  width: fit-content;
+.w-full{
+  width: 100%;
 }
 
 .transform{
@@ -725,26 +700,18 @@ video {
   gap: 2.5rem;
 }
 
-.rounded-xl{
-  border-radius: 0.75rem;
-}
-
 .border-b{
   border-bottom-width: 1px;
 }
 
-.border-r-4{
-  border-right-width: 4px;
-}
-
-.border-b-2{
-  border-bottom-width: 2px;
-}
-
 .border-b-\[2px\]{
   border-bottom-width: 2px;
 }
 
+.border-r-4{
+  border-right-width: 4px;
+}
+
 .border-gray-100{
   --tw-border-opacity: 1;
   border-color: rgb(243 244 246 / var(--tw-border-opacity));
@@ -775,11 +742,6 @@ video {
   background-color: rgb(226 226 213 / var(--tw-bg-opacity));
 }
 
-.bg-rose-50{
-  --tw-bg-opacity: 1;
-  background-color: rgb(255 241 242 / var(--tw-bg-opacity));
-}
-
 .object-cover{
   -o-object-fit: cover;
      object-fit: cover;
@@ -809,19 +771,10 @@ video {
   padding-bottom: 1.5rem;
 }
 
-.py-5{
-  padding-top: 1.25rem;
-  padding-bottom: 1.25rem;
-}
-
 .pb-2{
   padding-bottom: 0.5rem;
 }
 
-.pl-1{
-  padding-left: 0.25rem;
-}
-
 .pb-4{
   padding-bottom: 1rem;
 }
@@ -830,18 +783,14 @@ video {
   padding-bottom: 1.5rem;
 }
 
+.pl-1{
+  padding-left: 0.25rem;
+}
+
 .pl-3{
   padding-left: 0.75rem;
 }
 
-.pl-7{
-  padding-left: 1.75rem;
-}
-
-.pl-8{
-  padding-left: 2rem;
-}
-
 .pl-\[1\.7rem\]{
   padding-left: 1.7rem;
 }
@@ -872,11 +821,6 @@ video {
   line-height: 1;
 }
 
-.text-sm{
-  font-size: 0.875rem;
-  line-height: 1.25rem;
-}
-
 .text-\[17px\]{
   font-size: 17px;
 }
@@ -890,14 +834,9 @@ video {
   line-height: 1.5rem;
 }
 
-.text-lg{
-  font-size: 1.125rem;
-  line-height: 1.75rem;
-}
-
-.text-xl{
-  font-size: 1.25rem;
-  line-height: 1.75rem;
+.text-sm{
+  font-size: 0.875rem;
+  line-height: 1.25rem;
 }
 
 .font-bold{
@@ -916,10 +855,6 @@ video {
   line-height: 2.5rem;
 }
 
-.leading-\[2\.8rem\]{
-  line-height: 2.8rem;
-}
-
 .text-gray-500{
   --tw-text-opacity: 1;
   color: rgb(107 114 128 / var(--tw-text-opacity));
@@ -945,21 +880,11 @@ video {
   color: rgb(136 136 131 / var(--tw-text-opacity));
 }
 
-.text-rose-900{
-  --tw-text-opacity: 1;
-  color: rgb(136 19 55 / var(--tw-text-opacity));
-}
-
 .text-stone-500{
   --tw-text-opacity: 1;
   color: rgb(120 113 108 / var(--tw-text-opacity));
 }
 
-.text-stone-600{
-  --tw-text-opacity: 1;
-  color: rgb(87 83 78 / var(--tw-text-opacity));
-}
-
 .text-stone-700{
   --tw-text-opacity: 1;
   color: rgb(68 64 60 / var(--tw-text-opacity));
@@ -1081,18 +1006,10 @@ video {
 }
 
 @media (min-width: 640px){
-  .sm\:ml-0{
-    margin-left: 0px;
-  }
-
   .sm\:ml-auto{
     margin-left: auto;
   }
 
-  .sm\:mr-0{
-    margin-right: 0px;
-  }
-
   .sm\:mr-auto{
     margin-right: auto;
   }
@@ -1113,10 +1030,6 @@ video {
     width: auto;
   }
 
-  .sm\:w-full{
-    width: 100%;
-  }
-
   .sm\:rounded-3xl{
     border-radius: 1.5rem;
   }
@@ -1138,27 +1051,6 @@ video {
     padding: 2.5rem;
   }
 
-  .sm\:py-6{
-    padding-top: 1.5rem;
-    padding-bottom: 1.5rem;
-  }
-
-  .sm\:pb-0{
-    padding-bottom: 0px;
-  }
-
-  .sm\:pl-8{
-    padding-left: 2rem;
-  }
-
-  .sm\:text-left{
-    text-align: left;
-  }
-
-  .sm\:text-\[16px\]{
-    font-size: 16px;
-  }
-
   .sm\:text-base{
     font-size: 1rem;
     line-height: 1.5rem;