From bd54d575063463cf28a9b6d4a6954918093a35b3 Mon Sep 17 00:00:00 2001
From: pluja <codeberg@r3d.red>
Date: Thu, 23 May 2024 23:58:31 +0200
Subject: [PATCH] improve comments styling

---
 src/frontend/templates/service.html | 24 ++++++++++++++----------
 1 file changed, 14 insertions(+), 10 deletions(-)

diff --git a/src/frontend/templates/service.html b/src/frontend/templates/service.html
index dce4ea7..601ce0d 100644
--- a/src/frontend/templates/service.html
+++ b/src/frontend/templates/service.html
@@ -190,20 +190,24 @@
 </section>
 
 <!-- KYC Level -->
-<section class="flex justify-center items-center px-2 mb-2">{{partial "partials/kyc_level" .Service.KycLevel}}</section>
+<section class="flex justify-center items-center px-2">{{partial "partials/kyc_level" .Service.KycLevel}}</section>
 
-<!-- Attributes -->
 <section class="flex flex-col justify-center items-center p-4">
-  {{if .Attributes}}
-  <div class="grid grid-cols-1 auto-cols-max gap-2 md:grid-cols-2">{{range .Attributes}} {{partial "partials/attribute_line" .}} {{end}}</div>
-  {{end}} {{if .Service.Comments}}
-  <div class="my-2 space-y-1.5 max-w-lg">
-    {{range .Service.Comments}}
-    <p class="block px-3 py-1.5 text-sm font-bold text-center rounded-lg border transition duration-300 border-white/30 bg-white/10 hover:bg-white/20 hover:border-white">* {{.}}</p>
-    {{end}}
-  </div>
+  <!-- Notes / Comments -->
+  {{if .Service.Comments}}
+    <div class="mb-5 space-y-1.5 max-w-lg">
+      {{range .Service.Comments}}
+      <p
+        class="block px-3 py-1.5 text-sm font-bold text-center rounded-lg border transition duration-300 border-amber-300/30 bg-amber-300/10 hover:bg-amber-300/20 hover:border-amber-100/50">
+        {{ . | safe }}</p>
+      {{end}}
+    </div>
   {{end}}
 
+  <!-- Attributes -->
+  {{if .Attributes}}
+  <div class="grid grid-cols-1 auto-cols-max gap-2 mt-2 md:grid-cols-2">{{range .Attributes}} {{partial "partials/attribute_line" .}} {{end}}</div>
+  {{end}} 
   <span class="mt-6 text-xs text-white/20"> (updated {{humanizePbTimeString .Service.Updated}}) </span>
 </section>