From 255a7592a3d321d0d057a8476b61f67e38d55120 Mon Sep 17 00:00:00 2001
From: Dinesh Salunke <dineshsalunke@consultbop.com>
Date: Mon, 6 Nov 2023 16:46:46 +0530
Subject: [PATCH] refactor: style the footer

---
 templates/_partials/footer.tpl | 33 +++++++++++++++++++++++++++++----
 1 file changed, 29 insertions(+), 4 deletions(-)

diff --git a/templates/_partials/footer.tpl b/templates/_partials/footer.tpl
index 7b98c75..f07111b 100644
--- a/templates/_partials/footer.tpl
+++ b/templates/_partials/footer.tpl
@@ -27,18 +27,43 @@
       {hook h='displayFooterBefore'}
     {/block}
 </div>
-<div class="container mx-auto flex flex-col">
-    <div class="flex">
-      <div class="w-48 h-48 flex flex-col justify-center">
+<div class="container mx-auto flex flex-col gap-8">
+    <div class="flex flex-col lg:flex-row gap-8">
+      <div class="w-48 flex flex-row justify-center items-center">
           <a class="w-24 h-24" href="{$urls.base_url}">
             <img class="logo w-full aspect-square object-fit" src="{$shop.logo}" alt="{$shop.name}">
           </a>
       </div>
-      <div class="w-full flex flex-1">
+      <div class="w-full flex flex-1 flex-col lg:flex-row">
       {block name='hook_footer'}
         {hook h='displayFooter'}
       {/block}
       </div>
+      <div class="flex justify-center items-center gap-4">
+          <a class="p-4" href="{$urls.base_url}">
+            <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-brand-x" width="24" height="24" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round">
+              <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+              <path d="M4 4l11.733 16h4.267l-11.733 -16z"></path>
+              <path d="M4 20l6.768 -6.768m2.46 -2.46l6.772 -6.772"></path>
+            </svg>
+          </a>
+          <a class="p-4">
+            <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-brand-instagram" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+              <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+              <path d="M4 4m0 4a4 4 0 0 1 4 -4h8a4 4 0 0 1 4 4v8a4 4 0 0 1 -4 4h-8a4 4 0 0 1 -4 -4z"></path>
+              <path d="M12 12m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0"></path>
+              <path d="M16.5 7.5l0 .01"></path>
+            </svg>
+          </a>
+          <a class="p-4">
+            <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-brand-instagram" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+              <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+              <path d="M4 4m0 4a4 4 0 0 1 4 -4h8a4 4 0 0 1 4 4v8a4 4 0 0 1 -4 4h-8a4 4 0 0 1 -4 -4z"></path>
+              <path d="M12 12m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0"></path>
+              <path d="M16.5 7.5l0 .01"></path>
+            </svg>
+          </a>
+      </div>
     </div>
     <div class="flex">
       {block name='hook_footer_after'}