From 155cf44fecec8928befba99b647eae7df6899434 Mon Sep 17 00:00:00 2001
From: Welton Moura <weltonmoura@live.com>
Date: Wed, 22 Jan 2025 08:45:56 -0300
Subject: [PATCH] =?UTF-8?q?style:=20padronixa=C3=A7=C3=A3o=20modal=20|=20t?=
 =?UTF-8?q?ooltips?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../comandas/templates/viewcomanda.html       |  56 ++++++++++--------
 gestaoRaul/db.sqlite3                         | Bin 299008 -> 299008 bytes
 gestaoRaul/products/templates/products.html   |  36 ++++++-----
 .../htmx_list_products_in_comanda.html        |   3 +
 .../products/htmx_search_products.html        |  24 ++++----
 .../static/comandas/css/comandas.css          |  41 -------------
 6 files changed, 68 insertions(+), 92 deletions(-)

diff --git a/gestaoRaul/comandas/templates/viewcomanda.html b/gestaoRaul/comandas/templates/viewcomanda.html
index 6de8f1e..ddd2e9d 100644
--- a/gestaoRaul/comandas/templates/viewcomanda.html
+++ b/gestaoRaul/comandas/templates/viewcomanda.html
@@ -83,14 +83,17 @@ Detalhes {{comanda.name}}
     {%  for item in consumo%}
 
     <tr>
-      <td>
+      <td >
         {{item.product.name}}
         {% if item.product.cuisine == True %}
-        <img
-        onclick="openModalObs({{item.id}})"
-        src="{% static 'midia/icons/note.svg' %}"
-        style="width: 25px; height: 35px; cursor: pointer;">
-      </img>
+        <span data-tooltip="Observações para preparo." data-flow="top">
+
+          <img
+          onclick="openModalObs({{item.id}})"
+          src="{% static 'midia/icons/note.svg' %}"
+          style="width: 25px; height: 35px; cursor: pointer;">
+        </img>
+      </span>
         {% endif %}
 
       </td>
@@ -145,17 +148,16 @@ Detalhes {{comanda.name}}
 
     <dialog id="modal-obs" style="display: none;">
       <article>
-
         <h2>Observação do Pedido</h2>
-        <textarea style="height: 200px;" name="obs" id="obs"></textarea>
+        <p>Observações do pedido que serão enviadas para o preparo na cozinha.</p>
+        <textarea placeholder="Ex.: pedido sem cebola. para viagem." name="obs" id="obs"></textarea>
         <div>
-
-          <button onclick="addOrder()" >OK</button>
-          <button onclick="closeModalObs()" >Cancela</button>
+          <div style="display: flex;gap: 10px;">
+          <button type="submit" onclick="addOrder()" >OK</button>
+          <button type="button" onclick="closeModalObs()" style="background-color:red;">Cancela</button>
         </div>
-      </div>
-      </dialog>
     </article>
+      </dialog>
 
 
 
@@ -168,13 +170,14 @@ Detalhes {{comanda.name}}
       <h4 id="troco">Troco: </h4>
     </div>
     <footer>
-      <button class="secondary" hx-get="{% url 'paymentComanda' comanda.id %} " hx-trigger="click" hx-swap="none"  onclick="backPage()" style="background-color:green;">
-        Receber
-      </button>
-      <button class="secondary"  onclick=" modal_conta_client()">
-        Conta Cliente
-      </button>
-      <button onclick="close_modal_payment_comanda()" style="background-color:red;">Cancelar</button>
+      <div style="display: flex;gap: 10px;">
+
+        <button type="submit" hx-get="{% url 'paymentComanda' comanda.id %} " hx-trigger="click" hx-swap="none"  onclick="backPage()">Receber</button>
+        <button type="button" class="secondary"  onclick=" modal_conta_client()">
+          Conta
+        </button>
+        <button type="button" onclick="close_modal_payment_comanda()" style="background-color:red;">Cancelar</button>
+      </div>
     </footer>
   </article>
 </dialog>
@@ -195,9 +198,11 @@ Detalhes {{comanda.name}}
               {% endfor %}
 
           </select>
+          <div style="display: flex;gap: 10px;">
           <button type="submit">Alterar</button>
           <button type="button" onclick="closeModalAlter()" style="background-color:red;">Cancelar</button>
-      </form>
+        </div>
+        </form>
   </article>
 </dialog >
 
@@ -223,10 +228,11 @@ Detalhes {{comanda.name}}
        </select>
     </div>
     <footer>
-      <button type="submit" class="secondary" style="background-color:green;" >
-        Adicionar a conta
-      </button>
-      <button onclick="close_modal_conta_client()" style="background-color:red;">Cancelar</button>
+      <div style="display: flex;gap: 10px;">
+        <button type="submit" >
+          Adicionar a conta</button>
+        <button type="button" onclick="close_modal_conta_client()" style="background-color:red;">Cancelar</button>
+      </div>
     </form>
     </footer>
   </article>
diff --git a/gestaoRaul/db.sqlite3 b/gestaoRaul/db.sqlite3
index b37847f15e138c6c328f1e11d8ef2cd7429e0901..06f39df8b48e8fde91c858f4b685ec33b3ed64c6 100644
GIT binary patch
delta 289
zcmZozAk?rxXo57O%0wAwRuu-lWX6pt*?Npp%@_2xU(jPT`pEHzv6VfVk-u|0mjY8g
zKMON6C+GBDeWrXC1_lO}Z3aw?4J;h&493%0H!!8Mus`Bp-(IkRX*#<KrxAlHgCheY
zqmhA;sjh*cu91;~p`n$riIu6Lo{71Msj(sNcI_QZ*V&m{LD~;6C9&7>ZR1<dw_<zV
z0VZ)icD}s~?7S>e+k4J2l`%4xfD~O|(w%N{fyrrk$pt2$g7pmS;y?w}_n6ukC3$=q
z__;(_xZd$|@=f9s;GNDZ%d?oLf=gt()B~npoFWFA+zir=Kvx6Z#8jM`tB_xoKRxOV
jlRTsT^qcRQWVWZgVtUEQ!q>^5-5&UcX?x%s=JksKr3Oss

delta 305
zcmZozAk?rxXo57O)I=F)Rw)L(vhIy3*?NqU%@_2xU(jPT`pD7A*vcNw!2f4EmjY8g
zKMMl`1MBo&eWv{BfA|?WwzC*8{jF!=G-5EB&bomqorQy){n7S<4NTM7nUy*urZ3#V
zB*JTGY-MPyXKrd}Xlcs7U3&-9b#~^xAPonYlGt1M>iD+tt>2z^fJvN>osF51iJwJc
zd(SzhGDhb0AVn9LbeZ@{rW;*ga@t;Yf$1MFSdlnTQT08hHbzOlP6mE1Hx{mU{G5D~
z_yl;T^UCrp=BeQE-7fWj=@+L-dAX5+k*ThMp{}8Uf)UUurdB2vdKSheW@Z-rjAmNW
y+zf(_KwmL1GBLQO8X53)s_Rd``JPE;d&(=Omy9f$n%oTSfp3_$2fkrmzZd{BYg4NL

diff --git a/gestaoRaul/products/templates/products.html b/gestaoRaul/products/templates/products.html
index 63b364a..6fa6646 100644
--- a/gestaoRaul/products/templates/products.html
+++ b/gestaoRaul/products/templates/products.html
@@ -56,20 +56,22 @@ Produtos
             <input type="hidden"  name="id-product" id="id-{{product.id}}" value="{{ product.id }}">
 
           {% if product.active == True %}
-          <button style="background-color: rgba(255, 0, 0, 0); padding: 0px;">
-            <img 
-          src="{% static 'midia/icons/toggle-on.svg' %}" 
-          style=" width: 35px; height: 35px; cursor: pointer;" 
-           >
-        </img>
+          <button style="background-color: rgba(255, 0, 0, 0); padding: 0px;border: 0px;">
+            <span data-tooltip="Ativar ou Desativar Produto" data-flow="top">
+              <img 
+              src="{% static 'midia/icons/toggle-on.svg' %}" 
+              style=" width: 35px; height: 35px; cursor: pointer;" >
+            </img>
+          </span>
           </button>
           {% else %}
-          <button style="background-color: rgba(0, 128, 0, 0); padding: 0px;" >
+          <button style="background-color: rgba(0, 128, 0, 0); padding: 0px;border: 0px;" >
+            <span data-tooltip="Ativar ou Desativar Produto" data-flow="top">
             <img 
-          src="{% static 'midia/icons/toggle-off.svg' %}" 
-          style=" width: 35px; height: 35px; cursor: pointer;" 
-           >
-        </img>
+              src="{% static 'midia/icons/toggle-off.svg' %}" 
+              style=" width: 35px; height: 35px; cursor: pointer;" >
+            </img>
+            <span>
           </button>
 
           {% endif %}
@@ -106,10 +108,14 @@ Produtos
 
               </select>
             <textarea id="productDescription" name="description" rows="4" placeholder="Descrição"></textarea>
-            <footer class="grid-buttons">
-              <button id="save" type="submit">Salvar</button>
-              <button onclick="closeModal()" type="button" id="edit" hx-post="{% url 'editProduct' 1 %}" hx-trigger="click"  hx-target="#product-list" >Alterar</button>
-              <button type="button" onclick="closeModal()" style="background-color:red;">Fechar</button>
+            <footer>
+              <div style="display: flex;gap: 10px;">
+
+                
+                <button id="save" type="submit">Salvar</button>
+                <button type="submit" onclick="closeModal()" type="button" id="edit" hx-post="{% url 'editProduct' 1 %}" hx-trigger="click"  hx-target="#product-list" >Alterar</button>
+                <button type="button" onclick="closeModal()" style="background-color:red;">Cancelar</button>
+              </div>
             </footer>
         </form>
 
diff --git a/gestaoRaul/templates/htmx_components/htmx_list_products_in_comanda.html b/gestaoRaul/templates/htmx_components/htmx_list_products_in_comanda.html
index 4348e97..ac2c50e 100644
--- a/gestaoRaul/templates/htmx_components/htmx_list_products_in_comanda.html
+++ b/gestaoRaul/templates/htmx_components/htmx_list_products_in_comanda.html
@@ -11,11 +11,14 @@
   <td>
     {{item.product.name}}
     {% if item.product.cuisine == True %}
+    <span data-tooltip="Observações para preparo." data-flow="top">
+
     <img
     onclick="openModalObs({{item.id}})"
     src="{% static 'midia/icons/note.svg' %}"
     style="width: 25px; height: 35px; cursor: pointer;">
   </img>
+  <span>
     {% endif %}
 
   </td>
diff --git a/gestaoRaul/templates/htmx_components/products/htmx_search_products.html b/gestaoRaul/templates/htmx_components/products/htmx_search_products.html
index 71dd041..e31b700 100644
--- a/gestaoRaul/templates/htmx_components/products/htmx_search_products.html
+++ b/gestaoRaul/templates/htmx_components/products/htmx_search_products.html
@@ -32,20 +32,22 @@
     <input type="hidden"  name="id-product" id="id-{{product.id}}" value="{{ product.id }}">
 
   {% if product.active == True %}
-  <button style="background-color: rgba(255, 0, 0, 0); padding: 0px;">
-    <img 
-  src="{% static 'midia/icons/toggle-on.svg' %}" 
-  style=" width: 35px; height: 35px; cursor: pointer;" 
-   >
-</img>
+  <button style="background-color: rgba(255, 0, 0, 0); padding: 0px;border: 0px;">
+    <span data-tooltip="Ativar ou Desativar Produto" data-flow="top">
+      <img 
+      src="{% static 'midia/icons/toggle-on.svg' %}" 
+      style=" width: 35px; height: 35px; cursor: pointer;" >
+    </img>
+  </span>
   </button>
   {% else %}
-  <button style="background-color: rgba(0, 128, 0, 0); padding: 0px;" >
+  <button style="background-color: rgba(0, 128, 0, 0); padding: 0px;border: 0px;" >
+    <span data-tooltip="Ativar ou Desativar Produto" data-flow="top">
     <img 
-  src="{% static 'midia/icons/toggle-off.svg' %}" 
-  style=" width: 35px; height: 35px; cursor: pointer;" 
-   >
-</img>
+      src="{% static 'midia/icons/toggle-off.svg' %}" 
+      style=" width: 35px; height: 35px; cursor: pointer;" >
+    </img>
+    <span>
   </button>
   {% endif %}
 
diff --git a/gestaoRaul/templates/static/comandas/css/comandas.css b/gestaoRaul/templates/static/comandas/css/comandas.css
index a266e25..72463d1 100644
--- a/gestaoRaul/templates/static/comandas/css/comandas.css
+++ b/gestaoRaul/templates/static/comandas/css/comandas.css
@@ -4,15 +4,12 @@
   gap: 10px;
   max-width: 95%; 
   margin: 40px;
-  /* margin: 0 auto;  */
 }
 
 
 .card-comanda {
   width: 80%;
   gap: 3px;
-  /* min-width: 220px;
-  min-height: 250px; */
   background: var(--main-gradient);
   border-radius: 5px;
   box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2);
@@ -29,44 +26,6 @@
     box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.3);
   }
 
-
-  /* button {
-    background-color: #007BFF;
-    color: white;
-    padding: 10px 20px;
-    border: none;
-    border-radius: 5px;
-    cursor: pointer;
-}
-
-button:hover {
-    background-color: #0056b3;
-} */
-
-.modal {
-    display: none; 
-    position: fixed; 
-    padding: 20px;
-    top: 50%;
-    left: 50%;
-    width: 100%;
-    height: 100%;
-    overflow: auto;
-    background-color: rgba(0, 0, 0, 0.4); 
-    transform: translate(-50%, -50%);
-}
-
-.modal-content {
-    background-color: #fefefe;
-    margin: 15% auto;
-    padding: 20px;
-    border: 1px solid #888;
-    border-radius: 10px;
-    width: 90%; 
-    max-width: 500px;
-}
-
-
 form {
     display: flex;
     flex-direction: column;