From 0cf977dee4f09dcf91e2ddac8107a1482b9cc822 Mon Sep 17 00:00:00 2001
From: Kieran Klukas <kieran@dunkirk.sh>
Date: Fri, 24 Apr 2026 10:17:20 -0400
Subject: [PATCH] feat: add lucid icons

---
 ui/static/style.css      | 7 +++++--
 ui/templates/recipe.html | 4 ++--
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/ui/static/style.css b/ui/static/style.css
index ae54c53..28141a9 100644
--- a/ui/static/style.css
+++ b/ui/static/style.css
@@ -10,6 +10,7 @@
   --accent-hover:#c44e03;
   --border:#e0ddd8;
   --check-bg:#f0ede8;
+  --btn-hover:#f6f6f6;
   --error-bg:#fef2f2;
   --error-text:#991b1b;
   --ai-badge:#7c3aed;
@@ -296,11 +297,11 @@ footer a:hover{color:var(--accent)}
   background:var(--accent);
   color:#fff;
 }
-.timer-btn:active{transform:scale(0.96)}
+.timer-btn:hover{background:var(--btn-hover)}
 
 .tmr{font-weight:500;cursor:pointer;transition:color 0.2s;white-space:nowrap}
 .tmr:hover{color:var(--accent)}
-.tmr::before{content:"⏲";font-size:0.8em;margin-right:0.4em}
+.tmr::before{content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='10' x2='14' y1='2' y2='2'/%3E%3Cline x1='12' x2='15' y1='14' y2='11'/%3E%3Ccircle cx='12' cy='14' r='8'/%3E%3C/svg%3E");margin-right:0.4em;vertical-align:middle}
 
 .cook-link{
   font-family:'SF Mono','Fira Code','Cascadia Code',monospace;
@@ -344,6 +345,8 @@ footer a:hover{color:var(--accent)}
 }
 .meta-link:hover{color:var(--text-muted);text-decoration:underline}
 
+.meta-icon{vertical-align:-2px;margin-right:0.15em}
+
 .flagged-header{margin-bottom:1.5rem}
 .flagged-header h2{font-size:1.5rem;font-weight:600;font-family:'Poppins',system-ui,sans-serif}
 .flagged-empty{color:var(--text-muted);font-size:0.95rem}
diff --git a/ui/templates/recipe.html b/ui/templates/recipe.html
index 1ade423..4277fa3 100644
--- a/ui/templates/recipe.html
+++ b/ui/templates/recipe.html
@@ -36,8 +36,8 @@
 <div class="recipe-header">
   <h2>{{.Recipe.Name}}</h2>
   <div class="recipe-meta">
-    {{if .Recipe.PrepTime}}<span>⏱ {{fmtDuration .Recipe.PrepTime}} prep</span>{{end}}
-    {{if .Recipe.CookTime}}<span>⏱ {{fmtDuration .Recipe.CookTime}} cook</span>{{end}}
+    {{if .Recipe.PrepTime}}<span><svg class="meta-icon" xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><path d="M12 6v6l4 2"/></svg> {{fmtDuration .Recipe.PrepTime}} prep</span>{{end}}
+    {{if .Recipe.CookTime}}<span><svg class="meta-icon" xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><path d="M12 6v6l4 2"/></svg> {{fmtDuration .Recipe.CookTime}} cook</span>{{end}}
     {{if .Recipe.Yield}}<span>Serves {{.Recipe.Yield}}</span>{{end}}
     <a href="/cook?url={{.TargetURL | urlquery}}" class="cook-link">.cook</a>
     <a href="/flag?url={{.TargetURL | urlquery}}" class="flag-link{{if .IsFlagged}} flagged{{end}}" title="Flag as problematic – saves recipe for review"><svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 22V4a1 1 0 0 1 .4-.8A6 6 0 0 1 8 2c3 0 5 2 7.333 2q2 0 3.067-.8A1 1 0 0 1 20 4v10a1 1 0 0 1-.4.8A6 6 0 0 1 16 16c-3 0-5-2-8-2a6 6 0 0 0-4 1.528"/></svg></a>
-- 
2.51.2