From 960570f130cd5d9e4f2376edd399874c6740f650 Mon Sep 17 00:00:00 2001
From: Jonni Liljamo <jonni@liljamo.com>
Date: Thu, 31 Aug 2023 15:25:05 +0300
Subject: [PATCH] fix: make placeholder lighter in tag input

---
 static/styles.css            | 10 ++++++++++
 template/templates/tags.tmpl |  4 ++--
 2 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/static/styles.css b/static/styles.css
index 3f7ecbd..a4f1c67 100644
--- a/static/styles.css
+++ b/static/styles.css
@@ -786,6 +786,16 @@ video {
   color: rgb(30 41 59 / var(--tw-placeholder-opacity));
 }
 
+.placeholder-slate-400::-moz-placeholder {
+  --tw-placeholder-opacity: 1;
+  color: rgb(148 163 184 / var(--tw-placeholder-opacity));
+}
+
+.placeholder-slate-400::placeholder {
+  --tw-placeholder-opacity: 1;
+  color: rgb(148 163 184 / var(--tw-placeholder-opacity));
+}
+
 .opacity-0 {
   opacity: 0;
 }
diff --git a/template/templates/tags.tmpl b/template/templates/tags.tmpl
index 5a92703..7a5c8dd 100644
--- a/template/templates/tags.tmpl
+++ b/template/templates/tags.tmpl
@@ -7,9 +7,9 @@
 	Tags
 </p>
 <form class="flex flex-col" action="/api/tags/new" method="POST">
-	<p class="text-sm" for="display_name">New Tag</p>
+	<p class="text-sm" for="tag">New Tag</p>
 	<div class="flex gap-2">
-		<input class="w-full h-8 p-1 border-2 rounded-md placeholder-slate-800 focus:outline-none" type="text" placeholder="..." name="tag" id="tag"/>
+		<input class="w-full h-8 p-1 border-2 rounded-md placeholder-slate-400 focus:outline-none" type="text" placeholder="..." name="tag" id="tag"/>
 		<button class="group w-fit h-8 p-1 border-2 rounded-md drop-shadow-md bg-slate-50 hover:bg-slate-200 transition-colors" type="submit">
 			<svg class="absolute h-5 w-5 stroke-emerald-600 group-hover:stroke-emerald-700 transition-colors" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
 				<path d="M15 12L12 12M12 12L9 12M12 12L12 9M12 12L12 15" stroke-width="1.5" stroke-linecap="round"/>
-- 
2.44.1