diff --git a/gestaoRaul/comandas/templates/comandas.html b/gestaoRaul/comandas/templates/comandas.html index 201c60b..b59c71a 100644 --- a/gestaoRaul/comandas/templates/comandas.html +++ b/gestaoRaul/comandas/templates/comandas.html @@ -17,21 +17,23 @@ Comandas
{% for comanda in comandas %} - - -
-
{{comanda.name}} | {{comanda.mesa}}

-

Aberta ás: {{comanda.dt_open|date:"H:i"}}

- - -
- +
+ +
+ {{comanda.name}} | {{comanda.mesa}} +
+
+

+ Aberta ás: {{comanda.dt_open|date:"H:i"}} +

+ +
{% endfor %} diff --git a/gestaoRaul/db.sqlite3 b/gestaoRaul/db.sqlite3 index 3c667da..d9faaf3 100644 Binary files a/gestaoRaul/db.sqlite3 and b/gestaoRaul/db.sqlite3 differ diff --git a/gestaoRaul/templates/base.html b/gestaoRaul/templates/base.html index d0e12e4..4eff707 100644 --- a/gestaoRaul/templates/base.html +++ b/gestaoRaul/templates/base.html @@ -16,23 +16,50 @@ {% block 'title' %}{% endblock %}
- - - - --> +
@@ -40,5 +67,6 @@ {% block 'body' %} {% endblock %} + \ No newline at end of file diff --git a/gestaoRaul/templates/static/base.css b/gestaoRaul/templates/static/base.css index 786ba75..94b708a 100644 --- a/gestaoRaul/templates/static/base.css +++ b/gestaoRaul/templates/static/base.css @@ -1,36 +1,116 @@ +@import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500&display=swap'); body { - margin: 15px; + margin: 0px 0px 0px 0px; padding: 15px; font-family: Arial, sans-serif; } -/* .sidebar { - height: 100vh; - width: 200px; - background-color: #f1f1f1; - padding: 20px; - position: fixed; - top: 0; - left: 0; -} - -.content { - margin-left: 220px; - padding: 20px; -} - -ul { - list-style-type: none; +/* * { padding: 0; -} - -li a { - display: block; - padding: 15px; - text-decoration: none; - color: #333; -} - -li a:hover { - background-color: #ccc; + margin: 0; + font-family: 'Inter', sans-serif; } */ + +.p-header { + background-color: #24252a; + box-shadow: 0px 3px 10px #464646; +} + +.nav-bar { + display: flex; + justify-content: space-between; + padding: 0.1rem 2rem; +} + +.logo { + display: flex; + align-items: center; +} + +.logo h1 { + color: #fff; +} + +.nav-list { + display: flex; + align-items: center; +} + +.nav-list ul { + display: flex; + justify-content: center; + list-style: none; +} + +.nav-item { + margin: 0 15px; +} + +.nav-link { + text-decoration: none; + font-size: 1.15rem; + color: #fff; + font-weight: 400; +} + +.login-button button { + border: none; + padding: 10px 15px; + border-radius: 5px; + background-color: #0187a7; +} + +.login-button button a { + text-decoration: none; + color: #fff; + font-weight: 500; + font-size: 1.1rem; +} + +.mobile-menu-icon { + display: none; +} + +.mobile-menu { + display: none; +} + +@media screen and (max-width: 730px) { + .nav-bar { + padding: 0.1rem 2rem; + } + .nav-item { + display: none; + } + .login-button { + display: none; + } + .mobile-menu-icon { + display: block; + } + .mobile-menu-icon button { + background-color: transparent; + border: none; + cursor: pointer; + } + .mobile-menu ul { + display: flex; + flex-direction: column; + text-align: center; + padding-bottom: 1rem; + } + .mobile-menu .nav-item { + display: block; + padding-top: 1.2rem; + } + .mobile-menu .login-button { + display: block; + padding: 1rem 2rem; + } + .mobile-menu .login-button button { + width: 100%; + } + .open { + display: block; + } +} diff --git a/gestaoRaul/templates/static/base.js b/gestaoRaul/templates/static/base.js new file mode 100644 index 0000000..1460f2b --- /dev/null +++ b/gestaoRaul/templates/static/base.js @@ -0,0 +1,10 @@ +function menuShow() { + let menuMobile = document.querySelector('.mobile-menu'); + if (menuMobile.classList.contains('open')) { + menuMobile.classList.remove('open'); + document.querySelector('.icon').src = "https://raw.githubusercontent.com/Larissakich/menu_responsivo/6e3b09504434628c1b01f65b7d8ccf6ace3225cb/menu%20responsivo/assets/img/menu_white_36dp.svg"; + } else { + menuMobile.classList.add('open'); + document.querySelector('.icon').src = "https://raw.githubusercontent.com/Larissakich/menu_responsivo/6e3b09504434628c1b01f65b7d8ccf6ace3225cb/menu%20responsivo/assets/img/close_white_36dp.svg"; + } +} \ No newline at end of file diff --git a/gestaoRaul/templates/static/comandas/css/comandas.css b/gestaoRaul/templates/static/comandas/css/comandas.css index 857d154..0fb38a3 100644 --- a/gestaoRaul/templates/static/comandas/css/comandas.css +++ b/gestaoRaul/templates/static/comandas/css/comandas.css @@ -1,24 +1,27 @@ .grid-container { - display: grid; - grid-template-columns: repeat(3, 2fr); - gap: 20px; - max-width: 90%; /* Define a largura máxima do grid */ - margin: 0 auto; /* Centraliza o grid na página */ - } + display: grid; + grid-template-columns: repeat(5, 2fr); + gap: 10px; + max-width: 95%; + margin-top: 40px; + /* margin: 0 auto; */ +} -.card { - width: 120px; - height: 120px; - background-color: #f2f2f2; - border-radius: 15px; - box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2); - text-align: center; - line-height: 50px; /* Centraliza o texto verticalmente */ - font-size: 20px; - font-weight: bold; - color: #333; - transition: transform 0.2s; - } + +.card-comanda { + width: 80%; + /* min-width: 220px; + min-height: 250px; */ + background-color: #292929; + border-radius: 10px 10px 5px 5px; + box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2); + text-align: center; + line-height: 30px; + font-size: 15px; + font-weight: bold; + color: #333; + transition: transform 0.2s; +} .card:hover { transform: scale(1.05); @@ -79,9 +82,18 @@ input, textarea { } -@media (min-width: 768px) { - .grid-containerid { - grid-template-columns: repeat(3, 1fr); - /* grid-template-columns: repeat(auto-fit, minmax(2%, 3fr)); */ - } +@media (max-width: 768px) { + .grid-container { + display: flex; + flex-wrap: wrap; + justify-content: space-between; } + + .card-comanda { + width: 31%; + font-size: 15px; + font-weight: bold; + color: #333; + transition: transform 0.2s; + } +}