style: size navbar desktop

gestaoRaul/home/templates/home.html

@@ -35,6 +35,7 @@ RRB&C - DashBoard
       </div>
       <img src="{% static 'midia/icons/cart.svg' %}" >
     </div>
+
     <div class="card-resumo">
       <div>
         <p>Ticket médio</p>
@@ -42,10 +43,12 @@ RRB&C - DashBoard
       </div>
       <img src="{% static 'midia/icons/ticket.svg' %}" >
     </div>
+
     <div class="card">
       <h4> Mais vendidos </h4>
       <canvas id="vendas" style="width:100%;height: 85%;max-width:100%;"></canvas>
     </div>
+    
     <div class="card">
       <h4>Tempo médio na cozinha</h4>
       <div style="width:95%;max-width:100%;padding: 10px 30px 10px 30px;"> 

gestaoRaul/templates/base.html

@@ -11,10 +11,7 @@
     <link rel="shortcut icon" href="{% static 'midia/favicon/favicon.ico' %}" />
     {% load pwa %}
     {% progressive_web_app_meta %}
-     <link
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.min.css">
-  rel="stylesheet"
-  href="https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.min.css"
->
     <link rel="stylesheet" href="{% static 'base.css' %}">
     {% block 'head' %}
     
@@ -22,12 +19,13 @@
     <title>  {% block 'title' %}{% endblock  %} </title>
 </head>
 
-<div>
+
-    <header class="p-header">
+    <header>
+        <div class="p-header">
         <nav class="nav-bar">
             <div class="logo">
                 <h1>
-                     <img src="{% static 'midia/logo.png'  %}" width="60">
+                    <img src="{% static 'midia/logo.png'  %}" width="60">
                 </h1>
                 <button id="icon-notify" style="border: none; margin-left: 10px; border-radius: 20px; height: 40px;width: 40px; padding: 2px; align-self: center;" onclick="cookieNotificacao()" >🔊</button>
             </div>
@@ -71,54 +69,54 @@
         </nav>
 
 
-        <div class="header-mobile">
+    </div>
+    <div class="header-mobile">
 
-            <button class="nav-toggle"><i for="menu-toggle" class="fas fa-bars"></i></button>
+        <button class="nav-toggle"><i for="menu-toggle" class="fas fa-bars"></i></button>
-
-            <nav id="nav-links" class="nav-links">
-                <div style="
-                    display: flex;
-                    justify-content: space-between;
-                    align-items: center;
-                    width: 100%;
-                    position: absolute;
-                    top:20px;
-                    ">
-                    <div class="logo">
-                        <button 
-                            id="icon-notify" 
-                            style="border: none; margin-left: 10px; border-radius: 20px; height: 40px;width: 40px; padding: 2px; align-self: center;" 
-                            onclick="cookieNotificacao()" >🔊
-                        </button>
-                    </div>
-
-                    <div id="user-info">{{user.first_name}} {{user.last_name}}</div>
-                    <a href="{% url 'logout' %}" style="width: 50px;padding: 3px;"><img src="{% static 'midia/icons/logout.svg'  %}" style="width: 40px;"></a>
 
+        <nav id="nav-links" class="nav-links">
+            <div style="
+                display: flex;
+                justify-content: space-between;
+                align-items: center;
+                width: 100%;
+                position: absolute;
+                top:20px;
+                ">
+                <div class="logo">
+                    <button 
+                        id="icon-notify" 
+                        style="border: none; margin-left: 10px; border-radius: 20px; height: 40px;width: 40px; padding: 2px; align-self: center;" 
+                        onclick="cookieNotificacao()" >🔊
+                    </button>
                 </div>
 
-                <div class="nav-component">
+                <div id="user-info">{{user.first_name}} {{user.last_name}}</div>
-                    {% if user|groupUser:"Gerente" %}
+                <a href="{% url 'logout' %}" style="width: 50px;padding: 3px;"><img src="{% static 'midia/icons/logout.svg'  %}" style="width: 40px;"></a>
-                    <a href="{% url 'home' %}" class="nav-link">DashBoard</a>
-                    <a href="{% url 'products' %}" class="nav-link"> Produtos</a>
-                    {% endif %}
-                    <a href="{% url 'comandas' %}" class="nav-link">Comandas</a>
-                    <a href="{% url 'pedidos' %}" class="nav-link">Cozinha</a>
-                    <a href="{% url 'mapMesas' %}" class="nav-link">Mapa</a>
-                    <a href="{% url 'clients' %}" class="nav-link"> Clientes</a>
-                    {% if user|groupUser:"Admin" %}
-                    <a href="{% url 'admin:index' %}" class="nav-link">Admin</a> 
-                    {% endif %}
 
-                </div>
+            </div>
-            </nav>
+
-        </div>
+            <div class="nav-component">
-       
+                {% if user|groupUser:"Gerente" %}
+                <a href="{% url 'home' %}" class="nav-link">DashBoard</a>
+                <a href="{% url 'products' %}" class="nav-link"> Produtos</a>
+                {% endif %}
+                <a href="{% url 'comandas' %}" class="nav-link">Comandas</a>
+                <a href="{% url 'pedidos' %}" class="nav-link">Cozinha</a>
+                <a href="{% url 'mapMesas' %}" class="nav-link">Mapa</a>
+                <a href="{% url 'clients' %}" class="nav-link"> Clientes</a>
+                {% if user|groupUser:"Admin" %}
+                <a href="{% url 'admin:index' %}" class="nav-link">Admin</a> 
+                {% endif %}
+
+            </div>
+        </nav>
+    </div>
     </header>
     
-</div>
+
 <br>
-<body>
+
     {% block 'body' %}
     {% endblock  %}
     <script src="{% static 'htmx_base.js' %}"></script>
@@ -127,7 +125,7 @@
     <div id="toast" class="toast">
         <p id="toast-message"></p>
       </div>
-</body>
+
 
 
 

gestaoRaul/templates/static/base.css

@@ -58,7 +58,7 @@
 
 
 body {
-    margin: 70px 0px 0px 0px;
+    margin-top: 70px;
 }
 
 h1{
@@ -172,6 +172,9 @@ input, textarea, select {
     position: fixed;
     top: 0;
     min-width: 100%;
+    height: 60px;
+    align-items: center;
+    align-content: center;
     z-index: 100;
 }
 
@@ -179,6 +182,7 @@ input, textarea, select {
     display: flex;
     justify-content: space-between;
     padding: 0.1rem 1rem;
+    align-self: center;
     
 }
 
@@ -186,6 +190,7 @@ input, textarea, select {
     display: flex;
     margin-top: 5px;
     align-items: center;
+    height: 60px;
 }
 
 
@@ -217,9 +222,18 @@ input, textarea, select {
     grid-template-columns: repeat(2, 0.5fr);
     border: none;
     border-radius: 5px;
-    margin-top: 10px;
+    margin-top: 0px;
+    height: 60px;
+    width: 180px;
     gap: 10px;}
 
+#user-info {
+width: 120px;
+overflow: hidden;
+text-overflow: ellipsis;
+white-space: nowrap;
+}
+
 .logout-button button a {
     text-decoration: none;
     color: #fff;
@@ -413,6 +427,9 @@ input, textarea, select {
   .nav-bar {
     display:none;
   }
+ header .p-header {
+    display: none;
+  }
 
   body {
     margin: 8px 0px 0px 0px;

gestaoRaul/templates/static/home/css/home.css

@@ -7,7 +7,7 @@
   grid-template-columns: repeat(3, 2fr);
   gap: 30px;
   max-width: 1200px;
-  margin: 0px 0px 20px 0px; 
+  margin: 0px 0px 30px 0px; 
   padding: 10px;
 }