welton/RRBEC
1
0
Fork 0
mirror of https://github.com/welton89/RRBEC.git synced 2026-04-05 21:45:41 +00:00
Code Issues Packages Projects Releases Wiki Activity

style: padronixação modal | tooltips

Browse Source
This commit is contained in:
Welton Moura
2025-01-22 08:45:56 -03:00
parent 891f23ec2e
commit 155cf44fec
6 changed files with 68 additions and 92 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
gestaoRaul/comandas/templates/viewcomanda.html
View File

@@ -86,11 +86,14 @@ Detalhes {{comanda.name}}
<td > <td >
{{item.product.name}} {{item.product.name}}
{% if item.product.cuisine == True %} {% if item.product.cuisine == True %}
<span data-tooltip="Observações para preparo." data-flow="top">
<img <img
onclick="openModalObs({{item.id}})" onclick="openModalObs({{item.id}})"
src="{% static 'midia/icons/note.svg' %}" src="{% static 'midia/icons/note.svg' %}"
style="width: 25px; height: 35px; cursor: pointer;"> style="width: 25px; height: 35px; cursor: pointer;">
</img> </img>
</span>
{% endif %} {% endif %}
</td> </td>
@@ -145,17 +148,16 @@ Detalhes {{comanda.name}}
<dialog id="modal-obs" style="display: none;"> <dialog id="modal-obs" style="display: none;">
<article> <article>
<h2>Observação do Pedido</h2> <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> <div>
<div style="display: flex;gap: 10px;">
<button onclick="addOrder()" >OK</button> <button type="submit" onclick="addOrder()" >OK</button>
<button onclick="closeModalObs()" >Cancela</button> <button type="button" onclick="closeModalObs()" style="background-color:red;">Cancela</button>
</div> </div>
</div>
</dialog>
</article> </article>
</dialog>
@@ -168,13 +170,14 @@ Detalhes {{comanda.name}}
<h4 id="troco">Troco: </h4> <h4 id="troco">Troco: </h4>
</div> </div>
<footer> <footer>
<button class="secondary" hx-get="{% url 'paymentComanda' comanda.id %} " hx-trigger="click" hx-swap="none" onclick="backPage()" style="background-color:green;"> <div style="display: flex;gap: 10px;">
Receber
<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>
<button class="secondary" onclick=" modal_conta_client()"> <button type="button" onclick="close_modal_payment_comanda()" style="background-color:red;">Cancelar</button>
Conta Cliente </div>
</button>
<button onclick="close_modal_payment_comanda()" style="background-color:red;">Cancelar</button>
</footer> </footer>
</article> </article>
</dialog> </dialog>
@@ -195,8 +198,10 @@ Detalhes {{comanda.name}}
{% endfor %} {% endfor %}
</select> </select>
<div style="display: flex;gap: 10px;">
<button type="submit">Alterar</button> <button type="submit">Alterar</button>
<button type="button" onclick="closeModalAlter()" style="background-color:red;">Cancelar</button> <button type="button" onclick="closeModalAlter()" style="background-color:red;">Cancelar</button>
</div>
</form> </form>
</article> </article>
</dialog > </dialog >
@@ -223,10 +228,11 @@ Detalhes {{comanda.name}}
</select> </select>
</div> </div>
<footer> <footer>
<button type="submit" class="secondary" style="background-color:green;" > <div style="display: flex;gap: 10px;">
Adicionar a conta <button type="submit" >
</button> Adicionar a conta</button>
<button onclick="close_modal_conta_client()" style="background-color:red;">Cancelar</button> <button type="button" onclick="close_modal_conta_client()" style="background-color:red;">Cancelar</button>
</div>
</form> </form>
</footer> </footer>
</article> </article>

BIN
gestaoRaul/db.sqlite3
View File

Binary file not shown.

24
gestaoRaul/products/templates/products.html
View File

@@ -56,20 +56,22 @@ Produtos
<input type="hidden" name="id-product" id="id-{{product.id}}" value="{{ product.id }}"> <input type="hidden" name="id-product" id="id-{{product.id}}" value="{{ product.id }}">
{% if product.active == True %} {% if product.active == True %}
<button style="background-color: rgba(255, 0, 0, 0); padding: 0px;"> <button style="background-color: rgba(255, 0, 0, 0); padding: 0px;border: 0px;">
<span data-tooltip="Ativar ou Desativar Produto" data-flow="top">
<img <img
src="{% static 'midia/icons/toggle-on.svg' %}" src="{% static 'midia/icons/toggle-on.svg' %}"
style=" width: 35px; height: 35px; cursor: pointer;" style=" width: 35px; height: 35px; cursor: pointer;" >
>
</img> </img>
</span>
</button> </button>
{% else %} {% 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 <img
src="{% static 'midia/icons/toggle-off.svg' %}" src="{% static 'midia/icons/toggle-off.svg' %}"
style=" width: 35px; height: 35px; cursor: pointer;" style=" width: 35px; height: 35px; cursor: pointer;" >
>
</img> </img>
<span>
</button> </button>
{% endif %} {% endif %}
@@ -106,10 +108,14 @@ Produtos
</select> </select>
<textarea id="productDescription" name="description" rows="4" placeholder="Descrição"></textarea> <textarea id="productDescription" name="description" rows="4" placeholder="Descrição"></textarea>
<footer class="grid-buttons"> <footer>
<div style="display: flex;gap: 10px;">
<button id="save" type="submit">Salvar</button> <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="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;">Fechar</button> <button type="button" onclick="closeModal()" style="background-color:red;">Cancelar</button>
</div>
</footer> </footer>
</form> </form>

3
gestaoRaul/templates/htmx_components/htmx_list_products_in_comanda.html
View File

@@ -11,11 +11,14 @@
<td> <td>
{{item.product.name}} {{item.product.name}}
{% if item.product.cuisine == True %} {% if item.product.cuisine == True %}
<span data-tooltip="Observações para preparo." data-flow="top">
<img <img
onclick="openModalObs({{item.id}})" onclick="openModalObs({{item.id}})"
src="{% static 'midia/icons/note.svg' %}" src="{% static 'midia/icons/note.svg' %}"
style="width: 25px; height: 35px; cursor: pointer;"> style="width: 25px; height: 35px; cursor: pointer;">
</img> </img>
<span>
{% endif %} {% endif %}
</td> </td>

14
gestaoRaul/templates/htmx_components/products/htmx_search_products.html
View File

@@ -32,20 +32,22 @@
<input type="hidden" name="id-product" id="id-{{product.id}}" value="{{ product.id }}"> <input type="hidden" name="id-product" id="id-{{product.id}}" value="{{ product.id }}">
{% if product.active == True %} {% if product.active == True %}
<button style="background-color: rgba(255, 0, 0, 0); padding: 0px;"> <button style="background-color: rgba(255, 0, 0, 0); padding: 0px;border: 0px;">
<span data-tooltip="Ativar ou Desativar Produto" data-flow="top">
<img <img
src="{% static 'midia/icons/toggle-on.svg' %}" src="{% static 'midia/icons/toggle-on.svg' %}"
style=" width: 35px; height: 35px; cursor: pointer;" style=" width: 35px; height: 35px; cursor: pointer;" >
>
</img> </img>
</span>
</button> </button>
{% else %} {% 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 <img
src="{% static 'midia/icons/toggle-off.svg' %}" src="{% static 'midia/icons/toggle-off.svg' %}"
style=" width: 35px; height: 35px; cursor: pointer;" style=" width: 35px; height: 35px; cursor: pointer;" >
>
</img> </img>
<span>
</button> </button>
{% endif %} {% endif %}

41
gestaoRaul/templates/static/comandas/css/comandas.css
View File

@@ -4,15 +4,12 @@
gap: 10px; gap: 10px;
max-width: 95%; max-width: 95%;
margin: 40px; margin: 40px;
/* margin: 0 auto; */
} }
.card-comanda { .card-comanda {
width: 80%; width: 80%;
gap: 3px; gap: 3px;
/* min-width: 220px;
min-height: 250px; */
background: var(--main-gradient); background: var(--main-gradient);
border-radius: 5px; border-radius: 5px;
box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2); 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); 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 { form {
display: flex; display: flex;
flex-direction: column; flex-direction: column;