From 31c8770439c60cccc78c25b8076230656a585231 Mon Sep 17 00:00:00 2001
From: KKlochko <KKlochko@protonmail.com>
Date: Sat, 22 Jul 2023 13:47:13 +0300
Subject: [PATCH] Update the style of buttons.

---
 CHANGELOG.org                     |  2 ++
 templates/partials/task_item.html | 11 +++++++++--
 templates/tasks/index.html        |  9 ++++++++-
 3 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/CHANGELOG.org b/CHANGELOG.org
index 323f591..e418df0 100644
--- a/CHANGELOG.org
+++ b/CHANGELOG.org
@@ -23,4 +23,6 @@
    Add the cancel button for a task form.
 ** 0.3.4 <2023-07-21 Fri>
    Add right alignment for buttons in a task item.
+** 0.3.5 <2023-07-22 Sat>
+   Update the style of buttons.
 
diff --git a/templates/partials/task_item.html b/templates/partials/task_item.html
index 8cfbd28..1763180 100644
--- a/templates/partials/task_item.html
+++ b/templates/partials/task_item.html
@@ -14,12 +14,19 @@
   <button type="button"
 	  hx-post="{% url 'tasks:task-update' task.id %}"
 	  hx-swap="outerHTML"
-	  class="ml-auto">
+	  class="inline-block px-5 py-1.5 bg-blue-600 text-white font-medium text-xs leading-tight
+          uppercase rounded shadow-md hover:bg-blue-700 hover:shadow-lg focus:bg-blue-700
+          focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg
+          transition duration-150 ease-in-out ml-auto">
     Update
   </button>
   <button type="button"
 	  hx-post="{% url 'tasks:task-delete' task.id %}"
-	  hx-swap="outerHTML">
+	  hx-swap="outerHTML"
+	  class="inline-block px-5 py-1.5 bg-red-600 text-white font-medium text-xs leading-tight
+          uppercase rounded shadow-md hover:bg-red-700 hover:shadow-lg focus:bg-red-700
+          focus:shadow-lg focus:outline-none focus:ring-0 active:bg-red-800 active:shadow-lg
+          transition duration-150 ease-in-out">
     Delete
   </button>
 </div>
diff --git a/templates/tasks/index.html b/templates/tasks/index.html
index 4a2ef1b..025e857 100644
--- a/templates/tasks/index.html
+++ b/templates/tasks/index.html
@@ -4,7 +4,14 @@
 {% block content %}
   <h1 class="text-3xl font-bold text-center my-2">Tasks</h1>
 
-  <button type="button" hx-get="{% url 'tasks:create-task-form' %}" hx-target="#task-items" hx-swap="beforeend">
+  <button type="button"
+	  hx-get="{% url 'tasks:create-task-form' %}"
+	  hx-target="#task-items"
+	  hx-swap="beforeend"
+	  class="inline-block px-14 py-2.5 bg-green-600 text-white font-medium text-xs leading-tight
+          uppercase rounded shadow-md hover:bg-green-700 hover:shadow-lg focus:bg-green-700
+          focus:shadow-lg focus:outline-none focus:ring-0 active:bg-green-800 active:shadow-lg
+          transition duration-150 ease-in-out mx-auto">
     Add a new task
   </button>