leto/shkola
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Лагерь: CSS

Browse Source
This commit is contained in:
Dekart Deploy Bot 2026-05-11 23:06:28 +03:00
parent 6091fb80fe
commit edc9643d97
1 changed files with 54 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

74
wp-content/themes/dekart/assets/css/camp.css
View File

@ -753,30 +753,46 @@ html {
.infograph__card { .infograph__card {
background: #fff; background: #fff;
border-radius: 20px; border-radius: 20px;
padding: 32px 20px; padding: 0;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
gap: 16px;
text-align: center; text-align: center;
box-shadow: 0 2px 16px rgba(0,0,0,0.06); box-shadow: 0 4px 24px rgba(0,0,0,0.08);
transition: transform 0.3s ease, box-shadow 0.3s ease; transition: transform 0.3s ease, box-shadow 0.3s ease;
overflow: hidden;
position: relative;
} }
.infograph__card::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
height: 5px;
background: #1a8bc4;
}
.infograph__card:nth-child(2)::before { background: #2d9d5f; }
.infograph__card:nth-child(3)::before { background: #8e45b8; }
.infograph__card:nth-child(4)::before { background: #c9354e; }
.infograph__card:hover { .infograph__card:hover {
transform: translateY(-4px); transform: translateY(-6px);
box-shadow: 0 8px 32px rgba(0,0,0,0.1); box-shadow: 0 12px 40px rgba(0,0,0,0.14);
} }
.infograph__card-icon { .infograph__card-icon {
width: 64px; width: 72px;
height: 64px; height: 72px;
border-radius: 16px; border-radius: 50%;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
flex-shrink: 0; flex-shrink: 0;
background: rgba(57, 183, 234, 0.1); margin-top: 28px;
background: #e0f4ff;
} }
.infograph__card-icon img { .infograph__card-icon img {
@ -786,38 +802,44 @@ html {
} }
.infograph__card:nth-child(2) .infograph__card-icon { .infograph__card:nth-child(2) .infograph__card-icon {
background: rgba(59, 178, 115, 0.1); background: #e0fce8;
} }
.infograph__card:nth-child(3) .infograph__card-icon { .infograph__card:nth-child(3) .infograph__card-icon {
background: rgba(174, 95, 205, 0.1); background: #f3e0ff;
} }
.infograph__card:nth-child(4) .infograph__card-icon { .infograph__card:nth-child(4) .infograph__card-icon {
background: rgba(233, 69, 99, 0.1); background: #ffe0e6;
} }
.infograph__card-body { .infograph__card-body {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 4px; gap: 4px;
padding: 20px 20px 28px;
} }
.infograph__stat { .infograph__stat {
font-family: Montserrat, sans-serif; font-family: Montserrat, sans-serif;
font-size: 28px; font-size: 32px;
font-weight: 800; font-weight: 900;
line-height: 1.2; line-height: 1.15;
color: #1c2b2d; color: #1c2b2d;
margin: 0; margin: 0;
} }
.infograph__card:nth-child(1) .infograph__stat { color: #1a8bc4; }
.infograph__card:nth-child(2) .infograph__stat { color: #2d9d5f; }
.infograph__card:nth-child(3) .infograph__stat { color: #8e45b8; }
.infograph__card:nth-child(4) .infograph__stat { color: #c9354e; }
.infograph__label { .infograph__label {
font-family: Inter, sans-serif; font-family: Inter, sans-serif;
font-size: 14px; font-size: 14px;
font-weight: 500; font-weight: 600;
line-height: 1.4; line-height: 1.4;
color: #777; color: #444;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.06em; letter-spacing: 0.06em;
margin: 0; margin: 0;
@ -838,11 +860,23 @@ html {
gap: 16px; gap: 16px;
} }
.infograph__card { .infograph__card {
padding: 24px 16px; padding: 0;
} }
.infograph__stat { .infograph__stat {
font-size: 22px; font-size: 22px;
} }
.infograph__card-icon {
width: 56px;
height: 56px;
margin-top: 20px;
}
.infograph__card-icon img {
width: 28px;
height: 28px;
}
.infograph__card-body {
padding: 16px 16px 24px;
}
.infograph__label { .infograph__label {
font-size: 12px; font-size: 12px;
} }
@ -1160,8 +1194,8 @@ html {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 24px; gap: 24px;
border: 1px solid #e8e8e8; border: 1.5px solid #3bb273;
box-shadow: 0 2px 12px rgba(0,0,0,0.04); box-shadow: 0 4px 20px rgba(59, 178, 115, 0.08);
transition: transform 0.3s ease, box-shadow 0.3s ease; transition: transform 0.3s ease, box-shadow 0.3s ease;
} }