adcovn/olimparena
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: added new blocks/form changed

Browse Source
This commit is contained in:
Ignat Karelov
2026-05-22 13:59:25 +03:00
parent 09a407d456
commit e75a56cd9e
6 changed files with 690 additions and 144 deletions
Download Patch File Download Diff File Expand all files Collapse all files

284
assets/scss/_base.scss
View File

@@ -735,17 +735,10 @@ img {
}
}
.reviews {
.facts {
background: $color-bg;
background-image: url(../images/bg-pattern.svg);
background-position: center;
&__grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 32px;
margin-bottom: 64px;
}
}
.review-card {
@@ -786,14 +779,18 @@ img {
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 32px;
article {
&__item {
@include card;
border: 0;
background: $color-accent;
min-height: 144px;
padding: 32px;
min-height: 248px;
padding: 34px 24px;
text-align: center;
transition: transform 0.3s ease;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
&:hover {
transform: translateY(-5px);
@@ -802,17 +799,20 @@ img {
strong {
display: block;
margin-bottom: 8px;
margin-bottom: 14px;
color: $color-text;
font-size: 48px;
font-size: clamp(80px, 9vw, 120px);
font-weight: 700;
line-height: 1;
line-height: 0.9;
letter-spacing: 0.01em;
}
span {
color: $color-text;
font-size: 16px;
line-height: 1.3;
font-size: 19px;
font-weight: 500;
line-height: 1.25;
max-width: 320px;
}
}
@@ -991,11 +991,100 @@ img {
line-height: 1.1;
}
a {
color: rgba(255, 255, 255, 0.9);
font-size: 16px;
line-height: 1.4;
text-decoration: underline;
text-underline-offset: 2px;
}
span {
color: $color-text-soft;
font-size: 16px;
line-height: 1.45;
}
small {
display: block;
margin-top: 6px;
color: rgba(255, 255, 255, 0.6);
font-size: 13px;
line-height: 1.35;
}
}
&__links {
margin-top: 24px;
display: flex;
flex-wrap: wrap;
gap: 10px;
}
&__messenger {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 44px;
width: 44px;
height: 44px;
padding: 0;
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 999px;
background: rgba(255, 255, 255, 0.04);
color: rgba(255, 255, 255, 0.92);
text-decoration: none;
transition: transform 0.2s ease, border-color 0.2s ease, background-color 0.2s ease;
&:hover {
transform: translateY(-1px);
border-color: rgba(207, 23, 23, 0.7);
background: rgba(207, 23, 23, 0.18);
}
&--secondary {
background: rgba(255, 255, 255, 0.02);
}
}
&__action-icon {
width: 20px;
height: 20px;
display: inline-flex;
align-items: center;
justify-content: center;
svg {
width: 20px;
height: 20px;
display: block;
color: currentColor;
opacity: 0.9;
}
}
&__links--social {
margin-top: 14px;
a {
display: inline-flex;
align-items: center;
justify-content: center;
width: 44px;
height: 44px;
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.2);
color: rgba(255, 255, 255, 0.85);
background: rgba(255, 255, 255, 0.03);
transition: border-color 0.2s ease, color 0.2s ease, background-color 0.2s ease;
text-decoration: none;
}
a:hover {
border-color: rgba(207, 23, 23, 0.8);
color: $color-text;
background: rgba(207, 23, 23, 0.2);
}
}
}
@@ -1014,6 +1103,73 @@ img {
}
}
.map-card {
&__embed {
width: 100%;
margin-top: 18px;
margin-bottom: 16px;
overflow: hidden;
border-radius: 14px;
border: 1px solid rgba(255, 255, 255, 0.15);
iframe {
width: 100%;
min-height: 260px;
border: 0;
display: block;
}
}
&__actions {
display: flex;
flex-wrap: wrap;
gap: 10px;
a {
display: inline-flex;
align-items: center;
justify-content: center;
width: 44px;
height: 44px;
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 12px;
background: rgba(255, 255, 255, 0.03);
color: rgba(255, 255, 255, 0.8);
text-decoration: none;
transition: border-color 0.2s ease, background-color 0.2s ease, transform 0.2s ease;
}
a:hover {
transform: translateY(-1px);
border-color: rgba(207, 23, 23, 0.75);
background: rgba(207, 23, 23, 0.18);
}
}
&__action-icon {
width: 20px;
height: 20px;
display: inline-flex;
align-items: center;
justify-content: center;
color: #ffd5d5;
svg {
width: 20px;
height: 20px;
display: block;
}
}
&__route {
min-width: 44px;
width: 44px;
height: 44px;
padding: 0;
box-shadow: none;
}
}
.booking-modal {
position: fixed;
inset: 0;
@@ -1136,8 +1292,7 @@ img {
}
&__nav,
&__contacts,
&__social {
&__contacts {
h4 {
margin-bottom: 16px;
font-size: 16px;
@@ -1167,30 +1322,32 @@ img {
&__socials {
display: flex;
flex-wrap: wrap;
gap: 12px;
a {
display: inline-flex;
align-items: center;
justify-content: center;
width: 58px;
height: 58px;
border: 1px solid rgba(207, 23, 23, 0.5);
border-radius: 10px;
width: 46px;
height: 46px;
border: 1px solid rgba(255, 255, 255, 0.22);
border-radius: 12px;
background: rgba(255, 255, 255, 0.03);
color: rgba(255, 255, 255, 0.92);
transition: transform 0.25s ease, border-color 0.25s ease, background-color 0.25s ease;
transition: transform 0.2s ease, border-color 0.2s ease, background-color 0.2s ease;
margin-top: 0 !important;
svg {
width: 24px;
height: 24px;
width: 22px;
height: 22px;
display: block;
}
&:hover {
transform: translateY(-2px);
border-color: rgba(207, 23, 23, 0.85);
background: rgba(207, 23, 23, 0.15);
border-color: rgba(207, 23, 23, 0.75);
background: rgba(207, 23, 23, 0.18);
}
}
}
@@ -1213,7 +1370,51 @@ img {
&__legal {
display: flex;
gap: 34px;
flex-wrap: wrap;
gap: 10px 24px;
}
&__messengers {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin-top: 12px;
a {
display: inline-flex !important;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
padding: 0;
border: 1px solid rgba(255, 255, 255, 0.22);
border-radius: 12px;
color: rgba(255, 255, 255, 0.85) !important;
background: rgba(255, 255, 255, 0.03);
margin-top: 0 !important;
text-decoration: none !important;
transition: border-color 0.2s ease, background-color 0.2s ease;
}
a:hover {
border-color: rgba(207, 23, 23, 0.72);
background: rgba(207, 23, 23, 0.16);
}
}
&__messenger-icon {
width: 16px;
height: 16px;
display: inline-flex;
align-items: center;
justify-content: center;
svg {
width: 16px;
height: 16px;
display: block;
color: currentColor;
}
}
}
@@ -1304,12 +1505,11 @@ img {
.footer {
&__brand p {
font-size: 28px;
font-size: 16px;
}
&__nav,
&__contacts,
&__social {
&__contacts {
h4 {
font-size: 16px;
}
@@ -1422,22 +1622,21 @@ img {
}
&__brand p {
font-size: 22px;
font-size: 16px;
margin-top: 18px;
}
&__nav,
&__contacts,
&__social {
&__contacts {
h4 {
font-size: 30px;
font-size: 18px;
margin-bottom: 16px;
}
a,
span {
font-size: 22px;
line-height: 1.32;
font-size: 15px;
line-height: 1.4;
}
}
@@ -1574,8 +1773,7 @@ img {
}
&__nav,
&__contacts,
&__social {
&__contacts {
h4 {
font-size: 16px;
}
@@ -1595,7 +1793,7 @@ img {
}
.stats strong {
font-size: 40px;
font-size: clamp(66px, 17vw, 96px);
}
.booking-modal {
@@ -1672,7 +1870,7 @@ img {
.info-card,
.feature-card,
.review-card,
.stats article,
.stats__item,
.contacts-card,
.hours-card,
.object-card__content {
@@ -1718,8 +1916,8 @@ img {
}
&__socials a {
width: 50px;
height: 50px;
width: 44px;
height: 44px;
}
}
}