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

feat: menu dropdown in navbar

Browse Source
This commit is contained in:
Welton Moura
2025-01-13 16:52:34 -03:00
parent 956841ef2a
commit 3dae764fc8
5 changed files with 87 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
gestaoRaul/db.sqlite3
View File

Binary file not shown.

38
gestaoRaul/templates/base.html
View File

@@ -1,7 +1,6 @@
{% load static %} {% load static %}
<!DOCTYPE html> <!DOCTYPE html>
<html lang="pt-BR"> <html lang="pt-BR">
<head> <head>
@@ -26,10 +25,20 @@
<ul> <ul>
<li class="nav-item"><a href="{% url 'home' %}" class="nav-link">Início</a></li> <li class="nav-item"><a href="{% url 'home' %}" class="nav-link">Início</a></li>
<li class="nav-item"><a href="{% url 'comandas' %}" class="nav-link">Comandas</a></li> <li class="nav-item"><a href="{% url 'comandas' %}" class="nav-link">Comandas</a></li>
<li class="nav-item"><a href="{% url 'pedidos' %}" class="nav-link"> Pedidos</a></li> <li class="nav-item"><a href="{% url 'pedidos' %}" class="nav-link">Cozinha</a></li>
<li class="nav-item"><a href="{% url 'products' %}" class="nav-link"> Produtos</a></li>
<li class="nav-item"><a href="{% url 'viewBalcao' %}" class="nav-link"> Balcão</a></li> <li class="nav-item"><a href="{% url 'viewBalcao' %}" class="nav-link"> Balcão</a></li>
<li class="nav-item"><a href="{% url 'mapMesas' %}" class="nav-link"> Mapa</a></li> <li class="nav-item"><a href="{% url 'mapMesas' %}" class="nav-link"> Mapa</a></li>
<div class="dropdown">
<li class="nav-item">Cadastros </li>
<div class="dropdown-content">
<a href="{% url 'products' %}" class="nav-link"> Produtos</a>
<a href="{% url 'products' %}" class="nav-link"> Categorias</a>
<a href="{% url 'products' %}" class="nav-link"> Clientes</a>
</div>
</div>
</ul> </ul>
</div> </div>
<div class="login-button"> <div class="login-button">
@@ -44,24 +53,25 @@
<ul> <ul>
<li class="nav-item"><a href="{% url 'home' %}" class="nav-link">Início</a></li> <li class="nav-item"><a href="{% url 'home' %}" class="nav-link">Início</a></li>
<li class="nav-item"><a href="{% url 'comandas' %}" class="nav-link">Comandas</a></li> <li class="nav-item"><a href="{% url 'comandas' %}" class="nav-link">Comandas</a></li>
<li class="nav-item"><a href="{% url 'pedidos' %}" class="nav-link">Pedidos</a></li> <li class="nav-item"><a href="{% url 'pedidos' %}" class="nav-link">Cozinha</a></li>
<li class="nav-item"><a href="{% url 'products' %}" class="nav-link">Produtos</a></li>
<li class="nav-item"><a href="{% url 'mapMesas' %}" class="nav-link">Mapa</a></li> <li class="nav-item"><a href="{% url 'mapMesas' %}" class="nav-link">Mapa</a></li>
</ul>
<div class="dropdown">
<li class="nav-item">Cadastros </li>
<div class="dropdown-content">
<a href="{% url 'products' %}" class="nav-link"> Produtos</a>
<a href="{% url 'products' %}" class="nav-link"> Categorias</a>
<a href="{% url 'products' %}" class="nav-link"> Clientes</a>
</div>
</div>
</ul>
<div class="login-button"> <div class="login-button">
<button onclick="entrar()"><a href="#">Entrar</a></button> <button onclick="entrar()"><a href="#">Entrar</a></button>
</div> </div>
</div> </div>
</header> </header>
<!-- <nav >
<ul>
<li><a href="{% url 'mesas' %}">Mesas</a></li>
<li><a href="#">Categorias</a></li>
</ul>
</nav> -->
</div> </div>

54
gestaoRaul/templates/static/base.css
View File

@@ -1,8 +1,11 @@
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500&display=swap');
body { body {
margin: 70px 0px 0px 0px; margin: 70px 0px 0px 0px;
/* padding: 15px; /* padding: 15px; */
font-family: Arial, sans-serif; */ }
h1{
text-align: center;
} }
* { * {
@@ -61,7 +64,6 @@ body {
border: none; border: none;
padding: 10px 15px; padding: 10px 15px;
border-radius: 5px; border-radius: 5px;
background-color: #0187a7;
margin-top: 10px; margin-top: 10px;
} }
@@ -80,7 +82,53 @@ body {
display: none; display: none;
} }
/* .dropbtn {
background-color: #04AA6D;
color: white;
padding: 16px;
font-size: 16px;
border: none;
}
*/
.dropdown {
position: relative;
display: inline-block;
color: #fff;
}
.dropdown-content {
display: none;
position: absolute;
border-radius: 5px;
background-color: #313238;
min-width: 160px;
box-shadow: 0px 3px 10px #464646;
}
.dropdown-content a {
color: rgb(255, 255, 255);
padding: 12px 16px;
text-decoration: none;
display: block;
}
.dropdown-content a:hover {
background-color: #7a7a7a;
border-radius: 5px;
}
.dropdown:hover .dropdown-content {display: block;}
/* .dropdown:hover .dropbtn {background-color: #3e8e41;} */
@media screen and (max-width: 730px) { @media screen and (max-width: 730px) {
.dropdown-content {
display: none;
margin-top: 40px;
position: relative;
border-radius: 0px;
min-width: 160px;
}
.nav-bar { .nav-bar {
padding: 0.1rem 2rem; padding: 0.1rem 2rem;
} }

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

@@ -3,7 +3,7 @@
grid-template-columns: repeat(5, 2fr); grid-template-columns: repeat(5, 2fr);
gap: 10px; gap: 10px;
max-width: 95%; max-width: 95%;
margin-top: 40px; margin: 40px;
/* margin: 0 auto; */ /* margin: 0 auto; */
} }
@@ -24,7 +24,7 @@
transition: transform 0.2s; transition: transform 0.2s;
} }
.card:hover { .card-comanda:hover {
transform: scale(1.05); transform: scale(1.05);
box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.3); box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.3);
} }
@@ -99,4 +99,10 @@ input, textarea {
color: #333; color: #333;
transition: transform 0.2s; transition: transform 0.2s;
} }
.card-comanda:hover {
transform: scale(1);
box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.3);
}
} }

11
gestaoRaul/templates/static/home/css/home.css
View File

@@ -17,7 +17,7 @@
border-radius: 10px; border-radius: 10px;
box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2); box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2);
text-align: center; text-align: center;
line-height: 30px; /* Centraliza o texto verticalmente */ line-height: 30px;
font-size: 20px; font-size: 20px;
font-weight: bold; font-weight: bold;
padding: 10px; padding: 10px;
@@ -25,10 +25,7 @@
transition: transform 0.2s; transition: transform 0.2s;
} }
.card:hover {
transform: scale(1.05);
box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.3);
}
@media screen and (max-width: 730px) { @media screen and (max-width: 730px) {
@@ -38,13 +35,11 @@
width: 99%; width: 99%;
grid-template-columns: repeat(1, 1fr); grid-template-columns: repeat(1, 1fr);
gap: 20px; gap: 20px;
/* max-width: 1200px; */
margin: 5px; margin: 5px;
} }
.card { .card {
width: 95%; width: 95%;
/* height: 80%; */
background-color: #2b376e; background-color: #2b376e;
text-align: center; text-align: center;
line-height: 30px; line-height: 30px;
@@ -54,4 +49,6 @@
color: #333; color: #333;
transition: transform 0.2s; transition: transform 0.2s;
} }
} }