diff --git a/assets/css/gp-style-core.css b/assets/css/gp-style-core.css index cdf8e32..e5cb5ee 100644 --- a/assets/css/gp-style-core.css +++ b/assets/css/gp-style-core.css @@ -77,10 +77,20 @@ body{ .title-2{ font-weight: 700; color: var(--text-white); + + text-decoration: none; } .title-3{ font-weight: 700; color: var(--text-white); + + text-decoration: none; +} +.title-4{ + font-weight: 700; + color: var(--text-white); + + text-decoration: none; } .text-1{ font-weight: 400; @@ -148,10 +158,27 @@ body{ .btn-big--border--blood{ border-color: var(--blood); } +.btn-big--border--white{ + border-color: var(--text-white); +} .btn-big--blood{ background-color: var(--blood); } +.btn-big--social{ + padding-right: 66px; + + background-position: top 20px right 34px; + background-size: 24px; + background-repeat: no-repeat; +} +.btn-big--tg{ + background-image: url(/assets/img/social/telegram.svg); +} +.btn-big--ws{ + background-image: url(/assets/img/social/whatsapp.svg); +} + .btn--100-per{ width: 100%; } diff --git a/assets/css/gp-style-desktop.css b/assets/css/gp-style-desktop.css index 35e3247..7f15edc 100644 --- a/assets/css/gp-style-desktop.css +++ b/assets/css/gp-style-desktop.css @@ -14,6 +14,9 @@ .title-3{ font-size: 40px; } +.title-4{ + font-size: 24px; +} .text-1{ font-size: 24px; } @@ -117,6 +120,8 @@ /* footer */ .footer{ + margin-top: 200px; + padding: 56px 0; } .footer__wrapper{ @@ -353,4 +358,82 @@ width: 100% !important; } } + +/* projects */ +.projects{ + margin: 34px -20px -20px -20px; +} +/* projects */ + +/* services */ +.services{ + margin: 34px -20px -20px -20px; + + display: flex; + flex-wrap: wrap; +} +.services__item{ + margin: 20px; + + height: 257px; + + padding: 24px; + + display: flex; + flex-direction: column; + justify-content: space-between; + + background-color: var(--background-grey); + border-radius: 4px; +} +.services__item:nth-child(1), +.services__item:nth-child(2), +.services__item:nth-child(3){ + width: calc(33.3% - 40px); +} +.services__item:nth-child(n+4){ + width: calc(50% - 40px); +} +.services__img{ + width: 88px; + aspect-ratio: 1; +} +.services__content{ + height: 89px; + + /* display: flex; */ +} +.services__content .title-4{ + margin-bottom: 16px; +} +/* services */ + + +/* call */ +.call{ + padding: 88px 64px; + + display: flex; + flex-direction: column; + align-items: center; + + background-color: var(--background-grey); +} +.call__content{ + margin-top: 56px; + + width: 910px; + height: 152px; + + display: flex; + justify-content: space-between; +} +.call__item{ + height: 100%; + + display: flex; + flex-direction: column; + justify-content: space-between; +} +/* call */ @media only screen and (min-width: 992px) and (max-width: 1032px) {} \ No newline at end of file diff --git a/assets/img/icon/services-1.svg b/assets/img/icon/services-1.svg new file mode 100644 index 0000000..3f6be23 --- /dev/null +++ b/assets/img/icon/services-1.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/assets/img/icon/services-2.svg b/assets/img/icon/services-2.svg new file mode 100644 index 0000000..61d7356 --- /dev/null +++ b/assets/img/icon/services-2.svg @@ -0,0 +1,4 @@ + + + + diff --git a/assets/img/icon/services-3.svg b/assets/img/icon/services-3.svg new file mode 100644 index 0000000..f09459c --- /dev/null +++ b/assets/img/icon/services-3.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/assets/img/icon/services-4.svg b/assets/img/icon/services-4.svg new file mode 100644 index 0000000..ed53a8c --- /dev/null +++ b/assets/img/icon/services-4.svg @@ -0,0 +1,8 @@ + + + + + + + + diff --git a/assets/img/icon/services-5.svg b/assets/img/icon/services-5.svg new file mode 100644 index 0000000..5c41942 --- /dev/null +++ b/assets/img/icon/services-5.svg @@ -0,0 +1,3 @@ + + + diff --git a/assets/js/main.js b/assets/js/main.js index ca6af62..d524663 100644 --- a/assets/js/main.js +++ b/assets/js/main.js @@ -1,14 +1,8 @@ 'use strict'; -window.addEventListener('resize', (e) => { - if (window.innerWidth) { - - } -}); - - -const swiper = new Swiper('.gym-swiper', { +const gymSwiper = new Swiper('.gym-swiper', { direction: 'horizontal', + slidesPerView: 1.20, breakpoints: { 320:{ slidesPerView: 1.20, @@ -17,8 +11,7 @@ const swiper = new Swiper('.gym-swiper', { 996: { slidesPerView: 3 }, - 1920: { - slidesPerView: 3 - }, } -}); \ No newline at end of file +}); + +// gymSwiper.destroy(); diff --git a/index.html b/index.html index 1ebc8fa..6a6e81b 100644 --- a/index.html +++ b/index.html @@ -298,6 +298,90 @@ + +
+

+ Разработанные проекты +

+ +
+ +
+
+ +