mirror of
https://github.com/welton89/RRBEC.git
synced 2026-04-05 13:35:42 +00:00
style: paleta de cores
This commit is contained in:
@@ -75,8 +75,9 @@
|
||||
<article
|
||||
name="productBox"
|
||||
id="productId-{{ product.id }}"
|
||||
class="card-product"
|
||||
onclick="addProductClick({{product.id}} , {{comanda.id}})"
|
||||
style="background-color: #293552;">
|
||||
>
|
||||
<p hidden id="{{forloop.counter0}}">{{product.id}}</p>
|
||||
<p hidden id="comanda{{forloop.counter0}}">{{comanda.id}}</p>
|
||||
{{product.name}} <br>
|
||||
@@ -89,8 +90,9 @@
|
||||
<article
|
||||
name="productBox"
|
||||
id="productId-{{ product.id }}"
|
||||
class="card-product"
|
||||
onclick="addProductClick({{product.id}} , {{comanda.id}})"
|
||||
style="background-color: #293552;">
|
||||
>
|
||||
{{product.name}} <br>
|
||||
R$ {{product.price}}
|
||||
</article>
|
||||
|
||||
@@ -130,7 +130,7 @@ Detalhes {{comanda.name}}
|
||||
<div id="product-list" class="grid-list-products">
|
||||
{% for product in products %}
|
||||
|
||||
<article onclick="addProductComanda({{product.id}}, {{comanda.id}}, '{{product.cuisine}}')" style="background-color: #293552;" >
|
||||
<article class="card-product" onclick="addProductComanda({{product.id}}, {{comanda.id}}, '{{product.cuisine}}')" >
|
||||
{{product.name}} <br>
|
||||
R$ {{product.price}}
|
||||
</article >
|
||||
|
||||
Binary file not shown.
Binary file not shown.
@@ -13,11 +13,11 @@ RRB&C - DashBoard
|
||||
<body>
|
||||
<div class="grid-container">
|
||||
<h1>DashBoard</h1>
|
||||
<div class="grid-container" style="grid-template-columns: repeat(2, 2fr);">
|
||||
<div class="grid-container" style="grid-template-columns: repeat(2, 2fr); align-items: center; margin: 0px;">
|
||||
<input id="data-start" name="data-start" oninput="mediaCuisine()" type="date">
|
||||
<input id="data-end" name="data-end" oninput="mediaCuisine()" type="date">
|
||||
</div>
|
||||
<h4 id="30-days"></h4>
|
||||
<h4 id="30-days">Últimos 30 dias</h4>
|
||||
</div>
|
||||
|
||||
<div class="grid-container">
|
||||
@@ -61,7 +61,7 @@ RRB&C - DashBoard
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<h4>Faturamento anual</h4>
|
||||
<h4 style="justify-self: center;">Faturamento mês a mês</h4>
|
||||
<!-- <div class="card-faturamento-anual"> -->
|
||||
<canvas class="card-faturamento-anual" id="mensal" ></canvas>
|
||||
<!-- </div> -->
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
|
||||
<article
|
||||
onclick="addProductComanda({{product.id}})"
|
||||
style="background-color: #293552;"
|
||||
class="card-product"
|
||||
hx-get="{% url 'addProduct' product.id comanda_id %} "
|
||||
hx-trigger="click"
|
||||
hx-target="#list-products-comanda">
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
<article
|
||||
name="productBox"
|
||||
id="productId-{{ product.id }}"
|
||||
style="background-color: #293552;"
|
||||
class="card-product"
|
||||
onclick="addProductClick({{product.id}} )"
|
||||
>
|
||||
<p hidden id="{{forloop.counter0}}" >{{product.id}}</p>
|
||||
@@ -21,7 +21,7 @@
|
||||
<article
|
||||
name="productBox"
|
||||
id="productId-{{ product.id }}"
|
||||
style="background-color: #293552;"
|
||||
class="card-product"
|
||||
onclick="addProductClick({{product.id}})"
|
||||
>
|
||||
{{product.name}} <br>
|
||||
|
||||
@@ -14,8 +14,8 @@
|
||||
{% if item.product.cuisine == True %}
|
||||
<img
|
||||
onclick="openModalObs({{item.id}})"
|
||||
src="{% static 'midia/icons/edit.svg' %}"
|
||||
style="width: 35px; height: 35px; cursor: pointer;">
|
||||
src="{% static 'midia/icons/note.svg' %}"
|
||||
style="width: 25px; height: 35px; cursor: pointer;">
|
||||
</img>
|
||||
{% endif %}
|
||||
|
||||
|
||||
@@ -1,7 +1,13 @@
|
||||
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500&display=swap');
|
||||
|
||||
:root {
|
||||
--main-gradient: linear-gradient(145deg, #1E2A3B, #2C3E50);
|
||||
}
|
||||
|
||||
|
||||
|
||||
body {
|
||||
margin: 70px 0px 0px 0px;
|
||||
/* padding: 15px; */
|
||||
}
|
||||
|
||||
h1{
|
||||
@@ -90,6 +96,7 @@ text-align: center;
|
||||
display: inline-block;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
transition: display 0.9s ;
|
||||
}
|
||||
|
||||
.dropdown-content {
|
||||
@@ -99,7 +106,6 @@ text-align: center;
|
||||
background-color: #313238;
|
||||
min-width: 160px;
|
||||
box-shadow: 0px 3px 10px #464646;
|
||||
transition: display 0.9s ease-in-out
|
||||
}
|
||||
|
||||
.dropdown-content a {
|
||||
@@ -107,11 +113,15 @@ text-align: center;
|
||||
padding: 12px 16px;
|
||||
text-decoration: none;
|
||||
display: block;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.dropdown-content a:hover {
|
||||
background-color: #7a7a7a;
|
||||
border-radius: 5px;
|
||||
display: block;
|
||||
|
||||
}
|
||||
|
||||
.img-drop {
|
||||
|
||||
@@ -1,3 +1,5 @@
|
||||
|
||||
|
||||
.grid-container {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 2fr);
|
||||
@@ -14,24 +16,15 @@
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.card {
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
background-color: #c9ffbc;
|
||||
border-radius: 15px;
|
||||
box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2);
|
||||
text-align: center;
|
||||
line-height: 40px;
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
transition: transform 0.2s;
|
||||
cursor: pointer;
|
||||
.card-product {
|
||||
background: var(--main-gradient);
|
||||
box-shadow: 3px 3px 10px rgba(2, 2, 2, 0.678);
|
||||
|
||||
}
|
||||
|
||||
.card:hover {
|
||||
.card-product:hover {
|
||||
transform: scale(1.05);
|
||||
box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.3);
|
||||
box-shadow: 3px 3px 10px rgba(185, 185, 185, 0.678);
|
||||
}
|
||||
|
||||
table td th {
|
||||
|
||||
@@ -16,25 +16,16 @@
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.card {
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
background-color: #c9ffbc;
|
||||
border-radius: 15px;
|
||||
box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2);
|
||||
text-align: center;
|
||||
line-height: 40px;
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
transition: transform 0.2s;
|
||||
cursor: pointer;
|
||||
}
|
||||
.card-product {
|
||||
background: var(--main-gradient);
|
||||
box-shadow: 3px 3px 10px rgba(2, 2, 2, 0.678);
|
||||
|
||||
.card:hover {
|
||||
transform: scale(1.05);
|
||||
box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
}
|
||||
|
||||
.card-product:hover {
|
||||
transform: scale(1.05);
|
||||
box-shadow: 2px 2px 10px rgba(185, 185, 185, 0.678);
|
||||
}
|
||||
|
||||
table td th {
|
||||
text-align: center;
|
||||
|
||||
@@ -1,12 +1,13 @@
|
||||
.grid-container {
|
||||
display: grid;
|
||||
justify-self: center;
|
||||
justify-content: center;
|
||||
justify-items: center;
|
||||
align-items: center;
|
||||
grid-template-columns: repeat(3, 2fr);
|
||||
gap: 20px;
|
||||
gap: 30px;
|
||||
max-width: 1200px;
|
||||
margin: 0 auto;
|
||||
margin: 0px 0px 20px 0px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
@@ -14,9 +15,11 @@
|
||||
width: 420px;
|
||||
height: 420px;
|
||||
justify-items: center;
|
||||
background: linear-gradient(135deg, #97cefa, #457bd1);
|
||||
/* background: linear-gradient(135deg, #97cefa, #457bd1); */
|
||||
background: var(--main-gradient);
|
||||
border-radius: 10px;
|
||||
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
|
||||
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.719);
|
||||
|
||||
text-align: center;
|
||||
line-height: 30px;
|
||||
font-size: 20px;
|
||||
@@ -27,8 +30,8 @@
|
||||
}
|
||||
|
||||
.card:hover {
|
||||
transform: translateY(-5px);
|
||||
box-shadow: 0 8px 30px rgba(0, 0, 0, 0.2);
|
||||
transform: translateY(-10px);
|
||||
box-shadow: 0 4px 8px rgba(199, 199, 199, 0.25);
|
||||
}
|
||||
|
||||
.card-resumo {
|
||||
@@ -38,9 +41,19 @@
|
||||
align-items: center;
|
||||
width: 300px;
|
||||
height: 130px;
|
||||
background: linear-gradient(135deg, #1a237e, #3f51b5);
|
||||
background: var(--main-gradient);
|
||||
border-radius: 10px;
|
||||
box-shadow: 0 4px 20px rgba(156, 156, 156, 0.2);
|
||||
box-shadow: 0 4px 10px rgba(12, 12, 12, 0.973);
|
||||
text-align: left;
|
||||
line-height: 20px;
|
||||
padding: 15px 30px 15px 30px;
|
||||
transition: box-shadow 0.4s;
|
||||
|
||||
}
|
||||
|
||||
.card-resumo:hover {
|
||||
|
||||
box-shadow: 0 4px 15px rgba(175, 175, 175, 0.295);
|
||||
text-align: left;
|
||||
line-height: 20px;
|
||||
padding: 15px 30px 15px 30px;
|
||||
@@ -48,12 +61,13 @@
|
||||
.card-faturamento-anual {
|
||||
justify-self: center;
|
||||
align-items: center;
|
||||
width: 80%;
|
||||
width: 70%;
|
||||
max-width: 1350px;;
|
||||
max-height: 350px;
|
||||
margin: 30px;
|
||||
background: linear-gradient(135deg, #1a237e, #3f51b5);
|
||||
background: var(--main-gradient);
|
||||
border-radius: 10px;
|
||||
box-shadow: 0 4px 20px rgba(156, 156, 156, 0.2);
|
||||
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.493);
|
||||
text-align: left;
|
||||
line-height: 20px;
|
||||
padding: 15px 30px 15px 30px;
|
||||
@@ -77,13 +91,9 @@
|
||||
|
||||
.card {
|
||||
width: 95%;
|
||||
background: linear-gradient(135deg, #d3ebff, #a1c4fd);
|
||||
text-align: center;
|
||||
line-height: 30px;
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
padding: 10px;
|
||||
color: #333;
|
||||
transition: transform 0.2s, box-shadow 0.2s;
|
||||
|
||||
}
|
||||
.card-faturamento-anual {
|
||||
max-width: 120%;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -29,11 +29,20 @@ var chartVendas = new Chart("vendas", {
|
||||
y: {
|
||||
ticks: {
|
||||
display: true,
|
||||
color: 'white',
|
||||
callback: function(value, index, values) {
|
||||
return chartVendas.data.labels[index].substring(0, 6);
|
||||
},
|
||||
}
|
||||
},
|
||||
x: {
|
||||
ticks: {
|
||||
display: true,
|
||||
color: 'white',
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
display: true,
|
||||
@@ -116,7 +125,7 @@ var chartCuisine = new Chart("cuisine", {
|
||||
size: 18,
|
||||
weight: 'normal'
|
||||
},
|
||||
backgroundColor: 'rgba(8, 26, 81, 0.66)',
|
||||
backgroundColor: 'rgba(1, 2, 5, 0.66)',
|
||||
bodyColor: 'rgba(255, 255, 255, 0.7)',
|
||||
bodyFont: {
|
||||
family: "'Poppins', 'sans-serif'",
|
||||
@@ -306,7 +315,7 @@ var resposta = fetch(`/chartCuisine/${dateStart}/${dateEnd}`, {method: 'GET',
|
||||
chartCuisine.data.labels = xValues
|
||||
chartCuisine.update();
|
||||
|
||||
document.getElementById('30-days').innerText = ''
|
||||
document.getElementById('30-days').innerText = 'Período de 30 dias'
|
||||
|
||||
})
|
||||
.catch(error => {
|
||||
|
||||
@@ -309,7 +309,7 @@ details summary[role=button]:not(.outline)::after {
|
||||
--pico-accordion-active-summary-color: var(--pico-primary-hover);
|
||||
--pico-accordion-close-summary-color: var(--pico-color);
|
||||
--pico-accordion-open-summary-color: var(--pico-muted-color);
|
||||
--pico-card-background-color: var(--pico-background-color);
|
||||
--pico-card-background-color: linear-gradient(145deg, #1E2A3B, #2C3E50);
|
||||
--pico-card-border-color: var(--pico-muted-border-color);
|
||||
--pico-card-box-shadow: var(--pico-box-shadow);
|
||||
--pico-card-sectioning-background-color: #fbfcfc;
|
||||
@@ -1974,7 +1974,7 @@ article {
|
||||
transition: transform 0.2s;
|
||||
}
|
||||
article:hover {
|
||||
transform: scale(1.02);
|
||||
/* transform: scale(1.02); */
|
||||
box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
article > header,
|
||||
|
||||
Reference in New Issue
Block a user