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

style: page home

Browse Source
This commit is contained in:
Welton Moura
2025-01-20 10:57:39 -03:00
parent dfc5072142
commit 203c7345fb
5 changed files with 128 additions and 148 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -1,83 +1,89 @@
.grid-container {
display: grid;
justify-content: center;
justify-items: center;
align-items: center;
grid-template-columns: repeat(3, 2fr);
gap: 20px;
max-width: 1200px;
margin: 0 auto;
padding: 10px;
}
display: grid;
justify-content: center;
justify-items: center;
align-items: center;
grid-template-columns: repeat(3, 2fr);
gap: 20px;
max-width: 1200px;
margin: 0 auto;
padding: 10px;
}
.card {
width: 420px;
height: 420px;
width: 420px;
height: 420px;
justify-items: center;
background: linear-gradient(135deg, #97cefa, #457bd1);
border-radius: 10px;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
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:hover {
transform: translateY(-5px);
box-shadow: 0 8px 30px rgba(0, 0, 0, 0.2);
}
.card-resumo {
display: grid;
grid-template-columns: 2fr 0.6fr ;
justify-content: space-between;
align-items: center;
width: 300px;
height: 130px;
background: linear-gradient(135deg, #1a237e, #3f51b5);
border-radius: 10px;
box-shadow: 0 4px 20px rgba(156, 156, 156, 0.2);
text-align: left;
line-height: 20px;
padding: 15px 30px 15px 30px;
}
.card-faturamento-anual {
justify-self: center;
align-items: center;
width: 80%;
max-height: 350px;
margin: 30px;
background: linear-gradient(135deg, #1a237e, #3f51b5);
border-radius: 10px;
box-shadow: 0 4px 20px rgba(156, 156, 156, 0.2);
text-align: left;
line-height: 20px;
padding: 15px 30px 15px 30px;
}
.card-resumo h2 {
font-size: 35px;
margin: 0px;
color: #fff;
}
@media screen and (max-width: 730px) {
.grid-container {
justify-items: center;
background-color: #2b376e;
border-radius: 10px;
box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2);
display: grid;
width: 99%;
grid-template-columns: repeat(1, 1fr);
gap: 20px;
margin: 5px;
}
.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;
transition: transform 0.2s, box-shadow 0.2s;
}
.card-resumo {
display: grid;
grid-template-columns: 2fr 0.6fr ;
justify-content: space-between;
align-items: center;
width: 300px;
height: 130px;
background-color: #1a237e;
border-radius: 10px;
box-shadow: 5px 5px 10px rgba(156, 156, 156, 0.2);
text-align: left;
line-height: 20px;
/* scale: 0.9; */
/* font-size: 20px; */
/* font-weight: bold; */
padding: 15px 30px 15px 30px;
/* color: #333; */
/* transition: transform 0.2s; */
}
.card-resumo h2 {
/* color: #fff; */
font-size: 35px;
margin: 0px;
}
@media screen and (max-width: 730px) {
.grid-container {
justify-items: center;
display: grid;
width: 99%;
grid-template-columns: repeat(1, 1fr);
gap: 20px;
margin: 5px;
}
.card {
width: 95%;
background-color: #2b376e;
text-align: center;
line-height: 30px;
font-size: 20px;
font-weight: bold;
padding: 10px;
color: #333;
transition: transform 0.2s;
}
}
}