From 133c68ed5f4b49b4b4284c1264e110c4bdffb268 Mon Sep 17 00:00:00 2001
From: Abdullah Esmail <aesmail@hey.com>
Date: Fri, 8 Sep 2023 00:15:00 +0300
Subject: [PATCH] allow more customizations to widgets.

---
 lib/kaffy_web/templates/home/_progress.html.eex | 6 ++++--
 lib/kaffy_web/templates/home/_text.html.eex     | 3 ++-
 lib/kaffy_web/templates/home/_tidbit.html.eex   | 9 ++++++---
 3 files changed, 12 insertions(+), 6 deletions(-)

diff --git a/lib/kaffy_web/templates/home/_progress.html.eex b/lib/kaffy_web/templates/home/_progress.html.eex
index 7bbdef68..789536fe 100644
--- a/lib/kaffy_web/templates/home/_progress.html.eex
+++ b/lib/kaffy_web/templates/home/_progress.html.eex
@@ -1,4 +1,6 @@
-<div class="col-md-<%= @widget.width %> grid-margin stretch-card">
+<% color = Map.get(@widget, :color, "danger") %>
+<% width = Map.get(@widget, :width, 6) %>
+<div class="col-md-<%= width %> grid-margin stretch-card">
     <div class="card shadow">
         <div class="card-header">
             <h4><%= @widget.title %></h4>
@@ -6,7 +8,7 @@
         <div class="card-body">
             <p class="font-weight-bold text-black"><%= @widget.content %> <span class="float-right"><%= @widget.percentage %>%</span></p>
             <div class="progress">
-                <div class="progress-bar bg-danger" role="progressbar" style="width: <%= @widget.percentage %>%" aria-valuenow="<%= @widget.percentage %>" aria-valuemin="0" aria-valuemax="100"></div>
+                <div class="progress-bar bg-<%= color %>" role="progressbar" style="width: <%= @widget.percentage %>%" aria-valuenow="<%= @widget.percentage %>" aria-valuemin="0" aria-valuemax="100"></div>
             </div>
         </div>
     </div>
diff --git a/lib/kaffy_web/templates/home/_text.html.eex b/lib/kaffy_web/templates/home/_text.html.eex
index e42d1e71..f0a78896 100644
--- a/lib/kaffy_web/templates/home/_text.html.eex
+++ b/lib/kaffy_web/templates/home/_text.html.eex
@@ -1,4 +1,5 @@
-<div class="col-md-<%= @widget.width %> grid-margin stretch-card">
+<% width = Map.get(@widget, :width, 6) %>
+<div class="col-md-<%= width %> grid-margin stretch-card">
     <div class="card shadow">
         <div class="card-header py-3">
             <h4><%= @widget.title %></h4>
diff --git a/lib/kaffy_web/templates/home/_tidbit.html.eex b/lib/kaffy_web/templates/home/_tidbit.html.eex
index bd8a6bc3..a4ad2949 100644
--- a/lib/kaffy_web/templates/home/_tidbit.html.eex
+++ b/lib/kaffy_web/templates/home/_tidbit.html.eex
@@ -1,7 +1,10 @@
-<div class="col-md-<%= @widget.width %> grid-margin stretch-card">
-    <div class="card shadow border-left-success">
+<% color = Map.get(@widget, :color, "success") %>
+<% width = Map.get(@widget, :width, 3) %>
+
+<div class="col-md-<%= width %> grid-margin stretch-card">
+    <div class="card shadow border-left-<%= color %>">
         <div class="card-body">
-            <p class="font-weight-normal mb-1 text-success"><strong><%= @widget.title %></strong> <i class="<%= if @widget[:full_icon] do %><%= @widget.full_icon %><% else %>fas fa-<%= @widget.icon %><% end %> float-right"></i></p>
+            <p class="font-weight-normal mb-1 text-<%= color %>"><strong><%= @widget.title %></strong> <i class="<%= if @widget[:full_icon] do %><%= @widget.full_icon %><% else %>fas fa-<%= @widget.icon %><% end %> float-right"></i></p>
             <h2 class="mt-1"><%= @widget.content %></h2>
         </div>
     </div>