style: paleta de cores

This commit is contained in:
2025-01-20 15:32:05 -03:00
parent 203c7345fb
commit 4df3c6e8a8
14 changed files with 85 additions and 70 deletions

View File

@@ -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 {

View File

@@ -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 {

View File

@@ -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:hover {
transform: scale(1.05);
box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.3);
}
.card-product {
background: var(--main-gradient);
box-shadow: 3px 3px 10px rgba(2, 2, 2, 0.678);
}
.card-product:hover {
transform: scale(1.05);
box-shadow: 2px 2px 10px rgba(185, 185, 185, 0.678);
}
table td th {
text-align: center;

View File

@@ -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%;
}
}

View File

@@ -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 => {

View File

@@ -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,