Max complete verstka led-hub

led-hub--gp_max
GP 6 months ago
parent bcc7082be6
commit 592b3fa085
  1. 18
      assets/css/gp-style-core.css
  2. 191
      assets/css/gp-style-desktop.css
  3. 97
      assets/css/gp-style-mobile.css
  4. 20
      assets/css/gp-style-tablet.css
  5. BIN
      assets/fonts/Furore.otf
  6. BIN
      assets/img/Logo--footer.png
  7. BIN
      assets/img/Logo--header.png
  8. BIN
      assets/img/hero-img-full.webp
  9. BIN
      assets/img/hero-img.png
  10. 6
      assets/img/i-percent.svg
  11. 4
      assets/img/optimization 1.svg
  12. 5
      assets/img/time.svg
  13. 92
      index.html
  14. 12
      send/send.php

@ -1,5 +1,5 @@
@import url('https://fonts.googleapis.com/css2?family=Onest:wght@100..900&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Onest:wght@100..900&display=swap');
/*
@font-face { @font-face {
font-family: 'DIN Pro'; font-family: 'DIN Pro';
src: url('../fonts/DINPro-Medium.eot'); src: url('../fonts/DINPro-Medium.eot');
@ -21,6 +21,22 @@
font-weight: 900; font-weight: 900;
font-style: normal; font-style: normal;
font-display: swap; font-display: swap;
} */
@font-face {
font-family: 'Furore';
src: url('../fonts/Furore.otf');
}
:root {
--font-family: "Onest", sans-serif;
--second-family: "Furore", sans-serif;
--clr-general: #00071e;
--pink: #ff547f;
--white: #fff;
--blue-gradient: linear-gradient(174deg, #79c4f3 0%, #49aae8 100%);
--pink-gradient: linear-gradient(174deg, #f485a1 0%, #ff547f 100%);
/* var(--pink-gradien) */
} }
html, html,

@ -1,7 +1,3 @@
:root {
--clr-general: #00071e;
}
* { * {
box-sizing: border-box; box-sizing: border-box;
} }
@ -43,49 +39,21 @@ body {
gap: 42px; gap: 42px;
} }
/* Title */
h1 {
font-family: 'DIN Pro', sans-serif;
font-weight: 500;
font-size: 66px;
line-height: 110%;
letter-spacing: -0.04em;
text-transform: uppercase;
background: linear-gradient(
142deg,
rgba(255, 255, 255, 0) 0%,
rgba(255, 255, 255, 0.22) 42%,
rgba(255, 255, 255, 0) 100%
),
var(--clr-general);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
h1 b,
h1 strong {
font-weight: 900;
}
/* Button */ /* Button */
.btn { .btn {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
box-shadow: 0 12px 24px 0 rgba(255, 204, 0, 0.25); box-shadow: 0 8px 16px 0 #f485a1;
background: linear-gradient( background: var(--pink-gradient);
322deg,
rgba(255, 255, 255, 0) 0%,
rgba(255, 255, 255, 0.32) 41.5%,
rgba(255, 255, 255, 0) 100%
),
#fc0;
border: none; border: none;
outline: none; outline: none;
font-weight: 600; font-weight: 600;
font-size: 15px; font-size: 15px;
line-height: 140%; line-height: 140%;
color: var(--clr-general); color: var(--white);
cursor: pointer; cursor: pointer;
transition: all 0.15s ease-in-out; transition: all 0.15s ease-in-out;
} }
@ -115,18 +83,30 @@ h1 strong {
top: 24px; top: 24px;
z-index: 2; z-index: 2;
} }
.header__logo {
max-width: 280px; .logo{
width: 100%;
}
.logo--without-icon{
width: 14vh;
height: auto;
} }
.header__logo img {
max-width: 20vh;;
}
.header__logo p { .header__logo p {
font-weight: 400; font-weight: 400;
font-size: 14px; font-size: 14px;
line-height: 130%; line-height: 130%;
opacity: 0.8; opacity: 0.8;
min-width: 100px;
} }
.header__contacts { .header__contacts {
} }
.header__socials { .header__socials, .footer__socials {
display: none;
} }
.header__socials-link { .header__socials-link {
display: flex; display: flex;
@ -161,7 +141,7 @@ h1 strong {
position: relative; position: relative;
z-index: 1; z-index: 1;
} }
.hero::after { /* .hero::after {
content: ''; content: '';
width: 100%; width: 100%;
height: 100%; height: 100%;
@ -183,7 +163,7 @@ h1 strong {
left: 0; left: 0;
z-index: 1; z-index: 1;
animation: herobefore 6s ease-in-out infinite; animation: herobefore 6s ease-in-out infinite;
} } */
@keyframes herobefore { @keyframes herobefore {
0%, 0%,
100% { 100% {
@ -194,39 +174,103 @@ h1 strong {
transform: translateY(20px) translateX(-2px); transform: translateY(20px) translateX(-2px);
} }
} }
.hero__img {
}
.hero__content { .hero__content {
display: flex; display: grid;
align-items: flex-start; grid-template-areas:
gap: 64px; "a a a b"
justify-content: space-between; "c c c c";
gap: 4%;
position: relative; position: relative;
z-index: 1; z-index: 1;
} }
.hero__content::after {
.hero__leftside {
grid-area: a;
}
.hero__rightside {
grid-area: b;
}
.hero__advantages{
grid-area: c;
}
.hero::after {
content: ''; content: '';
position: absolute; position: absolute;
top: -60px; bottom: 0;
right: -595px; right: 0;
width: 1230px; width: 58vw;
height: 830px; height: 100vh;
pointer-events: none; pointer-events: none;
z-index: -1; z-index: -1;
background: url('../img/hero-img-full.webp') center no-repeat; /* background: url('../img/hero-img-full.webp') center no-repeat; */
background: url('../img/hero-img.png') center no-repeat;
background-size: cover; background-size: cover;
} }
.hero__leftside { .hero__leftside {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: flex-start; align-items: flex-start;
gap: 42px; gap: 2vh;
max-width: 590px; max-width: 50vw;
} }
/* Start - Title */
.hero__title { .hero__title {
background: linear-gradient(142deg,
rgba(255, 255, 255, 0) 0%,
rgba(255, 255, 255, 0.22) 42%,
rgba(255, 255, 255, 0) 100%),
var(--clr-general);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
} }
.hero__title h1 { .hero__title h1 {
font-family: var(--second-family);
text-transform: uppercase;
font-weight: 900;
font-size: 75px;
line-height: 140%;
letter-spacing: 0.02em;
} }
.hero__title p {
line-height: 130%;
font-family: var(--font-family);
font-size: 40px;
line-height: 172%;
text-align: left;
margin: 0;
}
.hero__title p>span {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0px 16px;
letter-spacing: -0.02em;
border-radius: 14px;
background: var(--blue-gradient);
font-weight: 700;
font-size: 46px;
line-height: 135%;
position: relative;
background-clip: initial;
-webkit-background-clip: initial;
-webkit-text-fill-color: initial;
margin-top: 6px;
color: #fff;
text-transform: initial;
}
/* End - Title */
.hero__desc { .hero__desc {
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
@ -271,30 +315,27 @@ h1 strong {
gap: 24px; gap: 24px;
width: 100%; width: 100%;
margin-bottom: 4px; margin-bottom: 4px;
background: linear-gradient(329deg,
rgba(255, 255, 255, 0) 9.59%,
rgba(255, 255, 255, 0.1) 47.6%,
rgba(255, 255, 255, 0) 100%),
var(--clr-general);
border-radius: 14px;
} }
.hero__price-header span { .hero__price-header p {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
gap: 12px; gap: 12px;
border-radius: 14px;
padding: 14px; padding: 14px;
font-weight: 600; font-weight: 600;
font-size: 18px; font-size: 18px;
line-height: 140%; line-height: 140%;
color: #fff; color: #fff;
width: 100%; width: 100%;
border-right: 3px solid #54596c;
border-left: 3px solid #54596c;
background: linear-gradient(
329deg,
rgba(255, 255, 255, 0) 9.59%,
rgba(255, 255, 255, 0.1) 47.6%,
rgba(255, 255, 255, 0) 100%
),
var(--clr-general);
} }
.hero__price-header span::before { .hero__price-header p::before {
content: ''; content: '';
width: 22px; width: 22px;
height: 22px; height: 22px;
@ -308,7 +349,7 @@ h1 strong {
} }
.hero__price-header p b { .hero__price-header p b {
font-weight: 600; font-weight: 600;
color: #ffcc02; color: var(--pink);
} }
.hero__price-content { .hero__price-content {
display: flex; display: flex;
@ -354,12 +395,14 @@ h1 strong {
line-height: 140%; line-height: 140%;
} }
.hero__rightside { .hero__rightside {
width: 24vw;
} }
.hero__form { .hero__form {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 24px; gap: 24px;
max-width: 490px; width: 50vh;
width: 100%;
border: 1px solid rgba(255, 255, 255, 0.7); border: 1px solid rgba(255, 255, 255, 0.7);
border-radius: 26px; border-radius: 26px;
padding: 12px; padding: 12px;
@ -532,7 +575,7 @@ h1 strong {
rgba(255, 255, 255, 0.1) 47.6%, rgba(255, 255, 255, 0.1) 47.6%,
rgba(255, 255, 255, 0) 100% rgba(255, 255, 255, 0) 100%
), ),
var(--clr-general); var(--blue-gradient);
} }
/* Footer */ /* Footer */
@ -558,11 +601,11 @@ h1 strong {
align-items: center; align-items: center;
grid-template-columns: repeat(3, 1fr); grid-template-columns: repeat(3, 1fr);
} }
.footer__logo {
}
.footer__logo p { .footer__logo p {
text-align: left;
font-weight: 500; font-weight: 500;
font-size: 13px; font-size: 14px;
line-height: 140%; line-height: 140%;
max-width: 210px; max-width: 210px;
} }
@ -575,7 +618,7 @@ h1 strong {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: flex-end; justify-content: flex-end;
gap: 46px; /* gap: 46px; */
} }
.footer__tel { .footer__tel {
font-weight: 700; font-weight: 700;

@ -1,33 +1,93 @@
/* GP | Start - Стили для мобильных устройств */
@media screen and (max-width: 576px) { @media screen and (max-width: 576px) {
/* Start - Header */
.header__logo p {
font-size: 14px;
}
/* Start - Hero block */
.hero::after{
width: 90vw;
height: 100vh;
}
.hero__content {
display: grid;
grid-template-areas:
"a"
"c"
"b";
}
.hero__content::after {
right: -320px;
top: 290px;
}
.hero__leftside {
gap: 18px;
}
.hero__rightside { .hero__rightside {
width: 100%; width: 100%;
} }
.hero__advantages {
margin-top: 0;
}
.hero__price { .hero__price {
margin-top: 24px; margin-top: 24px;
} }
.hero__content::after {
right: -320px; .hero__title h1 {
top: 290px; font-size: 3em;
text-align: center;
}
.hero__title p {
font-size: 2em;
line-height: 160%;
text-align: center;
} }
.hero__title p>span {
font-size: 1em;
}
.hero__desc { .hero__desc {
gap: 6px; gap: 6px;
} }
.hero__desc p { .hero__desc p {
font-size: 13px; font-size: 13px;
padding: 8px 12px; padding: 8px 12px;
border-radius: 10px; border-radius: 10px;
} }
.hero__desc img { .hero__desc img {
width: 24px; width: 24px;
height: 24px; height: 24px;
} }
.hero__leftside {
gap: 18px;
}
.hero__advantages {
margin-top: 42px; /* Start - Footer */
.footer__logo{
flex-direction: row;
} }
/* End - Footer */
} }
/* GP | End - Стили для мобильных устройств*/
/* от верстальщика перенести вверх потом */
@media screen and (max-width: 540px) { @media screen and (max-width: 540px) {
.header__container { .header__container {
align-items: flex-start; align-items: flex-start;
@ -44,15 +104,7 @@
height: 1px; height: 1px;
background: #e7e7e7; background: #e7e7e7;
} }
.header__logo {
max-width: 240px;
}
.header__logo img {
width: 50px;
}
.header__logo p {
font-size: 9px;
}
.header__socials { .header__socials {
gap: 6px; gap: 6px;
} }
@ -77,8 +129,12 @@
font-size: 39px; font-size: 39px;
text-align: left; text-align: left;
} }
.hero__leftside { h1 span {
align-items: flex-start; font-size: 32px;
padding-left: 12px;
padding-right: 12px;
border-radius: 10px;
margin-top: 6px;
} }
.hero__price { .hero__price {
margin-top: 12px; margin-top: 12px;
@ -173,6 +229,9 @@
h1 { h1 {
font-size: 36px; font-size: 36px;
} }
h1 span {
font-size: 29px;
}
.header__logo img { .header__logo img {
width: 42px; width: 42px;
} }

@ -4,6 +4,11 @@
h1 { h1 {
font-size: 52px; font-size: 52px;
} }
h1 span {
font-size: 42px;
margin-top: 0;
top: -2px;
}
.hero__content { .hero__content {
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
@ -88,11 +93,11 @@ h1 {
} }
@media screen and (max-width: 740px) { @media screen and (max-width: 740px) {
.header__logo { .header__logo {
max-width: 200px; /* max-width: 200px; */
gap: 12px; gap: 12px;
} }
.header__logo img { .header__logo img {
width: 64px; /* width: 64px; */
height: auto; height: auto;
} }
.header__logo p { .header__logo p {
@ -122,17 +127,21 @@ h1 {
h1 { h1 {
font-size: 49px; font-size: 49px;
} }
h1 span {
font-size: 39px;
top: 0;
}
} }
@media screen and (max-width: 620px) { @media screen and (max-width: 620px) {
*[class*='__container'] { *[class*='__container'] {
padding: 0 24px; padding: 0 24px;
} }
.header__logo { .header__logo {
max-width: 140px; /* max-width: 140px; */
gap: 14px; gap: 14px;
} }
.header__logo img { .header__logo img {
width: 56px; /* width: 56px; */
} }
.hero__advantages { .hero__advantages {
gap: 16px; gap: 16px;
@ -158,6 +167,9 @@ h1 {
h1 { h1 {
font-size: 42px; font-size: 42px;
} }
h1 span {
font-size: 32px;
}
.header__socials-link, .header__socials-link,
.footer__socials-link, .footer__socials-link,
.header__contacts .header__tel { .header__contacts .header__tel {

Binary file not shown.

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 196 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.1 MiB

@ -1,11 +1,11 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_2049_2154)"> <g clip-path="url(#clip0_2049_2154)">
<path d="M22.4042 12.3109C22.3565 12.2142 22.3317 12.1078 22.3317 12C22.3317 11.8922 22.3565 11.7859 22.4042 11.6892L23.2993 9.85802C23.7976 8.83844 23.4028 7.62322 22.4003 7.09133L20.5999 6.13602C20.5045 6.0858 20.4219 6.01433 20.3586 5.92713C20.2952 5.83993 20.2527 5.73933 20.2344 5.6331L19.8823 3.62551C19.6862 2.50773 18.6523 1.75661 17.5288 1.91556L15.5107 2.20103C15.404 2.21645 15.2952 2.20715 15.1927 2.17383C15.0902 2.14052 14.9967 2.08408 14.9195 2.00889L13.4546 0.591773C12.6389 -0.197316 11.3611 -0.197363 10.5455 0.591773L9.08058 2.00903C9.00333 2.08421 8.90984 2.14063 8.80733 2.17394C8.70482 2.20725 8.59603 2.21657 8.48935 2.20117L6.47125 1.9157C5.34743 1.75666 4.31384 2.50787 4.11776 3.62565L3.76564 5.63315C3.74734 5.73938 3.70487 5.83998 3.64152 5.92718C3.57816 6.01439 3.49562 6.08588 3.40025 6.13612L1.59979 7.09142C0.59733 7.62326 0.202457 8.83859 0.700829 9.85816L1.5959 11.6893C1.64355 11.786 1.66833 11.8923 1.66833 12.0001C1.66833 12.1079 1.64355 12.2143 1.5959 12.311L0.700783 14.1421C0.20241 15.1617 0.597283 16.3769 1.59975 16.9088L3.4002 17.8641C3.49558 17.9143 3.57814 17.9858 3.6415 18.073C3.70486 18.1602 3.74734 18.2608 3.76564 18.367L4.11776 20.3746C4.29626 21.3922 5.16879 22.1058 6.17158 22.1057C6.27034 22.1057 6.37056 22.0987 6.4713 22.0845L8.48939 21.799C8.59608 21.7836 8.70488 21.7929 8.8074 21.8262C8.90991 21.8595 9.0034 21.916 9.08062 21.9912L10.5455 23.4083C10.9534 23.8029 11.4766 24.0001 12 24.0001C12.5233 24 13.0468 23.8028 13.4546 23.4083L14.9195 21.9912C15.0775 21.8383 15.293 21.7685 15.5107 21.799L17.5288 22.0845C18.6528 22.2435 19.6862 21.4923 19.8823 20.3745L20.2345 18.367C20.2528 18.2608 20.2952 18.1602 20.3586 18.073C20.4219 17.9858 20.5045 17.9143 20.5999 17.8641L22.4003 16.9088C23.4028 16.3769 23.7976 15.1616 23.2993 14.142L22.4042 12.3109ZM9.23156 5.77106C10.6309 5.77106 11.7693 6.9095 11.7693 8.30881C11.7693 9.70811 10.6309 10.8466 9.23156 10.8466C7.83226 10.8466 6.69381 9.70811 6.69381 8.30881C6.69381 6.9095 7.83226 5.77106 9.23156 5.77106ZM7.92169 17.0571C7.78655 17.1922 7.60941 17.2598 7.43232 17.2598C7.25523 17.2598 7.07804 17.1923 6.94295 17.0571C6.67267 16.7868 6.67267 16.3486 6.94295 16.0783L16.0783 6.94292C16.3485 6.67264 16.7868 6.67264 17.0571 6.94292C17.3274 7.2132 17.3274 7.65144 17.0571 7.92172L7.92169 17.0571ZM14.7684 18.229C13.3691 18.229 12.2307 17.0906 12.2307 15.6913C12.2307 14.292 13.3691 13.1535 14.7684 13.1535C16.1677 13.1535 17.3062 14.292 17.3062 15.6913C17.3062 17.0906 16.1677 18.229 14.7684 18.229Z" fill="#FFCC00"/> <path d="M22.4042 12.3109C22.3565 12.2142 22.3317 12.1078 22.3317 12C22.3317 11.8922 22.3565 11.7859 22.4042 11.6892L23.2993 9.85802C23.7976 8.83844 23.4028 7.62322 22.4003 7.09133L20.5999 6.13602C20.5045 6.0858 20.4219 6.01433 20.3586 5.92713C20.2952 5.83993 20.2527 5.73933 20.2344 5.6331L19.8823 3.62551C19.6862 2.50773 18.6523 1.75661 17.5288 1.91556L15.5107 2.20103C15.404 2.21645 15.2952 2.20715 15.1927 2.17383C15.0902 2.14052 14.9967 2.08408 14.9195 2.00889L13.4546 0.591773C12.6389 -0.197316 11.3611 -0.197363 10.5455 0.591773L9.08058 2.00903C9.00333 2.08421 8.90984 2.14063 8.80733 2.17394C8.70482 2.20725 8.59603 2.21657 8.48935 2.20117L6.47125 1.9157C5.34743 1.75666 4.31384 2.50787 4.11776 3.62565L3.76564 5.63315C3.74734 5.73938 3.70487 5.83998 3.64152 5.92718C3.57816 6.01439 3.49562 6.08588 3.40025 6.13612L1.59979 7.09142C0.59733 7.62326 0.202457 8.83859 0.700829 9.85816L1.5959 11.6893C1.64355 11.786 1.66833 11.8923 1.66833 12.0001C1.66833 12.1079 1.64355 12.2143 1.5959 12.311L0.700783 14.1421C0.20241 15.1617 0.597283 16.3769 1.59975 16.9088L3.4002 17.8641C3.49558 17.9143 3.57814 17.9858 3.6415 18.073C3.70486 18.1602 3.74734 18.2608 3.76564 18.367L4.11776 20.3746C4.29626 21.3922 5.16879 22.1058 6.17158 22.1057C6.27034 22.1057 6.37056 22.0987 6.4713 22.0845L8.48939 21.799C8.59608 21.7836 8.70488 21.7929 8.8074 21.8262C8.90991 21.8595 9.0034 21.916 9.08062 21.9912L10.5455 23.4083C10.9534 23.8029 11.4766 24.0001 12 24.0001C12.5233 24 13.0468 23.8028 13.4546 23.4083L14.9195 21.9912C15.0775 21.8383 15.293 21.7685 15.5107 21.799L17.5288 22.0845C18.6528 22.2435 19.6862 21.4923 19.8823 20.3745L20.2345 18.367C20.2528 18.2608 20.2952 18.1602 20.3586 18.073C20.4219 17.9858 20.5045 17.9143 20.5999 17.8641L22.4003 16.9088C23.4028 16.3769 23.7976 15.1616 23.2993 14.142L22.4042 12.3109ZM9.23156 5.77106C10.6309 5.77106 11.7693 6.9095 11.7693 8.30881C11.7693 9.70811 10.6309 10.8466 9.23156 10.8466C7.83226 10.8466 6.69381 9.70811 6.69381 8.30881C6.69381 6.9095 7.83226 5.77106 9.23156 5.77106ZM7.92169 17.0571C7.78655 17.1922 7.60941 17.2598 7.43232 17.2598C7.25523 17.2598 7.07804 17.1923 6.94295 17.0571C6.67267 16.7868 6.67267 16.3486 6.94295 16.0783L16.0783 6.94292C16.3485 6.67264 16.7868 6.67264 17.0571 6.94292C17.3274 7.2132 17.3274 7.65144 17.0571 7.92172L7.92169 17.0571ZM14.7684 18.229C13.3691 18.229 12.2307 17.0906 12.2307 15.6913C12.2307 14.292 13.3691 13.1535 14.7684 13.1535C16.1677 13.1535 17.3062 14.292 17.3062 15.6913C17.3062 17.0906 16.1677 18.229 14.7684 18.229Z" fill="#ff547f"/>
<path d="M14.7687 14.5378C14.1326 14.5378 13.6152 15.0553 13.6152 15.6913C13.6152 16.3273 14.1326 16.8448 14.7687 16.8448C15.4047 16.8448 15.9222 16.3273 15.9222 15.6913C15.9222 15.0553 15.4047 14.5378 14.7687 14.5378ZM9.23185 7.15527C8.5958 7.15527 8.07835 7.67272 8.07835 8.30877C8.07835 8.94481 8.5958 9.46231 9.23185 9.46231C9.86789 9.46231 10.3854 8.94486 10.3854 8.30877C10.3853 7.67277 9.86789 7.15527 9.23185 7.15527Z" fill="#FFCC00"/> <path d="M14.7687 14.5378C14.1326 14.5378 13.6152 15.0553 13.6152 15.6913C13.6152 16.3273 14.1326 16.8448 14.7687 16.8448C15.4047 16.8448 15.9222 16.3273 15.9222 15.6913C15.9222 15.0553 15.4047 14.5378 14.7687 14.5378ZM9.23185 7.15527C8.5958 7.15527 8.07835 7.67272 8.07835 8.30877C8.07835 8.94481 8.5958 9.46231 9.23185 9.46231C9.86789 9.46231 10.3854 8.94486 10.3854 8.30877C10.3853 7.67277 9.86789 7.15527 9.23185 7.15527Z" fill="#ff547f"/>
</g> </g>
<defs> <defs>
<clipPath id="clip0_2049_2154"> <clipPath id="clip0_2049_2154">
<rect width="24" height="24" fill="white"/> <rect width="24" height="24" fill="#ff547f"/>
</clipPath> </clipPath>
</defs> </defs>
</svg> </svg>

Before

Width:  |  Height:  |  Size: 3.1 KiB

After

Width:  |  Height:  |  Size: 3.1 KiB

@ -0,0 +1,4 @@
<svg width="37" height="37" viewBox="0 0 37 37" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M16.2887 1.30078C15.8912 1.50312 15.7106 1.85 15.6527 2.54375C15.5299 3.96015 14.8145 5.02246 13.557 5.63671C12.7477 6.03418 11.9961 6.1498 11.2084 5.98359C10.5219 5.84628 9.91486 5.55722 9.47404 5.15976C8.88146 4.63222 8.49122 4.5166 7.99982 4.72617C7.67462 4.8707 5.00802 7.57343 4.94298 7.82636C4.87072 8.12988 4.95743 8.59961 5.12364 8.80918C5.94025 9.81367 6.14982 10.2328 6.28712 11.1144C6.51837 12.5887 5.68009 14.2363 4.3504 14.9445C3.87345 15.1975 3.15802 15.3926 2.68107 15.3926C2.22579 15.3926 1.7922 15.6238 1.59708 15.9707C1.44532 16.2453 1.4381 16.2959 1.45978 18.3121C1.48146 20.2633 1.48868 20.3789 1.63322 20.574C1.85724 20.8775 2.19689 21.0076 2.95568 21.0943C5.98361 21.4268 7.40001 25.04 5.39103 27.3092C5.20314 27.5187 5.01525 27.7717 4.97911 27.8728C4.89239 28.1041 4.89962 28.4871 4.99357 28.74C5.07306 28.9568 7.29884 31.2477 7.76134 31.5873C7.98536 31.7535 8.11544 31.7969 8.41896 31.7969C8.81642 31.7969 8.84532 31.7824 9.63302 31.1609C9.84982 30.9947 10.2328 30.7635 10.4858 30.6551C10.9121 30.4744 11.0205 30.46 11.8877 30.46C12.7477 30.4672 12.8705 30.4816 13.2897 30.6623C13.5498 30.7707 13.7666 30.8574 13.7811 30.8574C13.7955 30.8574 13.8027 29.8674 13.8027 28.6533V26.4492L13.3186 26.1312C11.9022 25.199 10.782 23.9344 10.0233 22.4385C9.69806 21.7881 9.36564 20.7764 9.19943 19.967C9.03322 19.107 9.03322 17.3943 9.19943 16.5344C9.96544 12.6682 12.8777 9.75586 16.7512 8.98261C17.6834 8.79472 19.3889 8.8164 20.3572 9.01875C24.1295 9.82812 26.919 12.6537 27.7283 16.4766C27.8223 16.9174 27.8584 17.416 27.8584 18.2471C27.8584 20.2777 27.3815 21.8459 26.2397 23.5586C25.741 24.3174 24.5703 25.5025 23.8477 25.9795C23.5514 26.1818 23.284 26.3697 23.2551 26.4131C23.1828 26.5143 23.1828 30.8574 23.2551 30.8574C23.2912 30.8574 23.443 30.7996 23.602 30.7201C24.0717 30.4961 24.6426 30.4021 25.3725 30.4383C26.2035 30.4816 26.7022 30.6623 27.3236 31.132C28.1981 31.8041 28.1836 31.7969 28.5811 31.7969C28.8846 31.7969 29.0147 31.7535 29.2387 31.5873C29.7012 31.2477 31.927 28.9568 32.0065 28.74C32.1004 28.4871 32.1076 28.1041 32.0209 27.8728C31.9848 27.7717 31.7969 27.5187 31.609 27.3092C29.5928 25.04 31.0092 21.434 34.066 21.0871C34.9043 20.9932 35.085 20.9209 35.3234 20.6102L35.5186 20.3572L35.5402 18.2832C35.5619 16.2309 35.5619 16.2164 35.3957 15.9779C35.1139 15.566 34.9043 15.4504 34.2756 15.3926C33.1627 15.2769 32.4979 14.9879 31.8113 14.3086C30.3877 12.8922 30.301 10.623 31.609 9.13437C31.7897 8.9248 31.9703 8.67187 32.0137 8.56347C32.1149 8.29609 32.1004 7.90586 31.9848 7.67461C31.8258 7.37832 29.1881 4.78398 28.9568 4.69726C28.4799 4.52382 28.0969 4.64668 27.526 5.15976C27.0852 5.55722 26.4781 5.84628 25.7916 5.98359C25.0111 6.1498 24.2668 6.03418 23.4502 5.64394C22.1856 5.02968 21.4557 3.93847 21.34 2.50761C21.2895 1.89336 21.1594 1.61875 20.7908 1.34414C20.5957 1.19961 20.4873 1.19238 18.5867 1.1707C16.6934 1.15625 16.5705 1.16347 16.2887 1.30078Z" fill="white"/>
<path d="M14.4748 12.3213C13.4848 12.9861 12.6176 13.9979 12.0684 15.1396C11.5191 16.2598 11.3891 16.8596 11.3818 18.2471C11.3818 19.2371 11.4035 19.49 11.548 20.0176C11.7359 20.7041 12.2201 21.7809 12.5814 22.3012C13.2391 23.2623 14.5904 24.3824 15.5588 24.7871L15.9707 24.9605V30.4021V35.8438H18.5H21.0293V30.4021V24.9605L21.4412 24.7871C22.4096 24.3824 23.7609 23.2623 24.4186 22.3012C24.7799 21.7809 25.2641 20.7041 25.452 20.0176C25.5965 19.49 25.6182 19.2371 25.6182 18.2471C25.6109 17.2787 25.582 16.9896 25.4447 16.4766C25.2568 15.7684 24.8521 14.865 24.4475 14.258C24.0572 13.6654 23.2479 12.8271 22.6553 12.4152L22.1494 12.0611L22.1277 15.5154L22.1061 18.9697L20.3066 20.0031L18.5 21.0365L16.7006 20.0031L14.8939 18.9697L14.8723 15.5154L14.8506 12.0684L14.4748 12.3213Z" fill="white"/>
</svg>

After

Width:  |  Height:  |  Size: 3.7 KiB

@ -0,0 +1,5 @@
<svg width="30" height="38" viewBox="0 0 30 38" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M11.3265 0.61214C11.235 0.653751 11.0685 0.786907 10.952 0.91174C10.744 1.12812 10.744 1.15308 10.744 2.5429V3.94935L11.0186 4.21566L11.2849 4.4903H15.0299H18.7749L19.0412 4.21566L19.3158 3.94935V2.53457V1.1198L19.0412 0.853485L18.7749 0.578851L15.1298 0.562207C13.1324 0.553885 11.4181 0.578851 11.3265 0.61214Z" fill="white"/>
<path d="M13.0326 6.42107V7.31987L12.0921 7.50295C9.92836 7.92739 7.75626 8.90109 5.95866 10.2659L5.50094 10.6071L4.82684 9.93304C4.26093 9.36713 4.10281 9.25894 3.81985 9.21733C3.17904 9.13411 2.65474 9.65841 2.73796 10.2992C2.77957 10.5822 2.88776 10.7403 3.42871 11.2812C4.01126 11.8721 4.0612 11.947 3.95301 12.0802C3.88643 12.1634 3.64509 12.4547 3.42039 12.7293C2.40507 13.936 1.33151 15.8918 0.81553 17.473C-1.28999 23.8478 1.12345 30.8634 6.69102 34.6001C9.57883 36.5392 13.1907 37.438 16.5945 37.0635C18.467 36.8638 19.9233 36.4227 21.7293 35.5322C28.3621 32.2449 31.5745 24.5385 29.2442 17.473C28.7283 15.8918 27.6547 13.936 26.6394 12.7293C26.4147 12.4547 26.1733 12.1634 26.1068 12.0802C25.9986 11.947 26.0485 11.8721 26.6311 11.2812C27.172 10.7403 27.2802 10.5822 27.3218 10.2992C27.405 9.65841 26.8807 9.13411 26.2399 9.21733C25.957 9.25894 25.7988 9.36713 25.2329 9.93304L24.5588 10.6071L23.893 10.1078C22.212 8.85115 20.0815 7.91907 18.0009 7.51128L17.0272 7.31987V6.42107V5.53059H15.0299H13.0326V6.42107ZM17.4517 10.1078C22.4533 11.1647 26.14 14.9097 27.147 19.9696C27.3551 21.0099 27.3551 23.3401 27.147 24.3804C26.14 29.4487 22.4783 33.1687 17.41 34.2589C16.2782 34.5002 13.948 34.5252 12.8245 34.3005C7.74794 33.2769 4.03623 29.6234 2.94602 24.5552C2.68803 23.3401 2.68803 21.0016 2.94602 19.7949C4.09449 14.4687 8.15573 10.6904 13.5319 9.94136C14.3974 9.82485 16.5362 9.90808 17.4517 10.1078Z" fill="white"/>
<path d="M13.5734 10.9484C12.2335 11.1231 10.6439 11.6558 9.43721 12.3465C4.3024 15.2842 2.29674 21.6008 4.79341 26.977C5.84201 29.2323 7.73115 31.1714 10.0031 32.3115C10.7022 32.661 12.0171 33.1104 12.9076 33.2935C13.9146 33.5016 16.095 33.5099 17.1103 33.3019C22.2201 32.2865 25.9319 28.1088 26.3147 22.9407L26.3729 22.175H20.6972H15.0297V16.5159V10.8568L14.597 10.8651C14.3556 10.8735 13.8979 10.9151 13.5734 10.9484Z" fill="white"/>
</svg>

After

Width:  |  Height:  |  Size: 2.3 KiB

@ -15,6 +15,29 @@
<link rel="stylesheet" media="screen and (max-width: 992px)" href="assets/css/gp-style-tablet.css?v=1.0"> <link rel="stylesheet" media="screen and (max-width: 992px)" href="assets/css/gp-style-tablet.css?v=1.0">
<link rel="stylesheet" media="screen and (max-width: 576px)" href="assets/css/gp-style-mobile.css?v=1.0"> <link rel="stylesheet" media="screen and (max-width: 576px)" href="assets/css/gp-style-mobile.css?v=1.0">
<!-- Yandex.Metrika counter -->
<script type="text/javascript">
(function (m, e, t, r, i, k, a) {
m[i] = m[i] || function () { (m[i].a = m[i].a || []).push(arguments) };
m[i].l = 1 * new Date();
for (var j = 0; j < document.scripts.length; j++) { if (document.scripts[j].src === r) { return; } }
k = e.createElement(t), a = e.getElementsByTagName(t)[0], k.async = 1, k.src = r, a.parentNode.insertBefore(k, a)
})
(window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym");
ym(98435289, "init", {
clickmap: true,
trackLinks: true,
accurateTrackBounce: true,
webvisor: true
});
</script>
<noscript>
<div><img src="https://mc.yandex.ru/watch/98435289" style="position:absolute; left:-9999px;" alt="" /></div>
</noscript>
<!-- /Yandex.Metrika counter -->
</head> </head>
<body> <body>
@ -25,20 +48,20 @@
<header class="header"> <header class="header">
<div class="header__container container flex flex-ac flex-jcsb"> <div class="header__container container flex flex-ac flex-jcsb">
<div class="header__logo flex flex-ac gap-24"> <div class="header__logo flex flex-ac gap-24">
<img src="assets/img/logo.webp" width="74" height="62" alt="Продажа строительных материалов в Томске"> <img src="assets/img/Logo--header.png" alt="Продажа строительных материалов в Томске">
<p>Продажа строительных материалов в&nbsp;Томске</p> <p>Led экраны <br>в Москве</p>
</div> </div>
<div class="header__contacts flex flex-ac gap-42"> <div class="header__contacts flex flex-ac gap-42">
<div class="header__socials flex flex-ac gap-10"> <div class="header__socials flex flex-ac gap-10">
<a href="https://t.me/+79234352557" target="_blank" class="header__socials-link"> <!-- <a href="https://t.me/+79234352557" target="_blank" class="header__socials-link">
<img src="assets/img/tg.svg" width="27" height="27" alt="Мы в Telegram" title="Мы в Telegram"> <img src="assets/img/tg.svg" width="27" height="27" alt="Мы в Telegram" title="Мы в Telegram">
</a> </a>
<a href="https://wa.me/+79234352557" target="_blank" class="header__socials-link"> <a href="https://wa.me/+79234352557" target="_blank" class="header__socials-link">
<img src="assets/img/wh.svg" width="27" height="27" alt="Мы в Whatsapp" title="Мы в Whatsapp"> <img src="assets/img/wh.svg" width="27" height="27" alt="Мы в Whatsapp" title="Мы в Whatsapp">
</a> </a> -->
</div> </div>
<a href="tel:+79234352557" class="header__tel" title="Позвоните нам"> <a href="tel:89227097101" class="header__tel" title="Позвоните нам">
<p>+7 (923) 435 25 57</p> <p>+7 922 709-71-01</p>
</a> </a>
<button class="btn btn-small modal__btn" data-modal="request"> <button class="btn btn-small modal__btn" data-modal="request">
<p>Заказать звонок</p> <p>Заказать звонок</p>
@ -51,66 +74,56 @@
<div class="section__container container"> <div class="section__container container">
<div class="hero__content"> <div class="hero__content">
<div class="hero__leftside"> <div class="hero__leftside">
<div class="hero__title">
<h1><b>Газобетонные блоки в&nbsp;Томске</b> напрямую от производителя</h1>
</div>
<div class="hero__desc"> <div class="hero__desc">
<p> <p>
<img src="assets/img/i-volume.svg" width="28" height="28" alt="Любой объем"> Любая конфигурация
Любой объем
</p> </p>
<p> <p>
<img src="assets/img/i-delivery.svg" width="28" height="28" alt="Доставим за 2 дня"> Доставка по всей РФ
Доставим за 2 дня
</p> </p>
</div> </div>
<div class="hero__title">
<h1>Led экраны <br>в Москве!</h1>
<p>Производство и установка! <span>от 15 000 ₽ за м2</span></p>
</div>
</div> </div>
<div class="hero__rightside"> <div class="hero__rightside">
<div class="hero__form"> <div class="hero__form">
<div class="hero__price-header"> <div class="hero__price-header">
<span> <p>
<p><b>Только до 30.09</b> розница по&nbsp;оптовым ценам</p> <span><b>Скидка 10%</b></span> при заказе через сайт
</span> </p>
</div> </div>
<div class="hero__form-title"> <div class="hero__form-title">
<p><b>Оставьте заявку</b>, чтобы узнать цену и&nbsp;зафиксировать скидку</p> <p><b>Оставьте заявку</b>, чтобы узнать цену и&nbsp;зафиксировать скидку</p>
</div> </div>
<div class="hero__form-action"> <div class="hero__form-action">
<form class="generalform" id="generalform" action=""> <form class="generalform" id="generalform" action="">
<select name="quantity" id="quantity" required>
<option value disabled selected>Укажите количество</option>
<option value="1-5 м3">1-5 м3</option>
<option value="5-10 м3">5-10 м3</option>
<option value="10-50 м3">10-50 м3</option>
<option value="50-100 м3">50-100 м3</option>
<option value="Более 100 м3">Более 100 м3</option>
</select>
<input type="tel" id="tel" name="tel" value="" placeholder="+7 (___) ___-____" required> <input type="tel" id="tel" name="tel" value="" placeholder="+7 (___) ___-____" required>
<button class="btn btn-big">Забронировать стоимость</button> <button class="btn btn-big">Забронировать стоимость</button>
</form> </form>
</div> </div>
</div> </div>
</div> </div>
</div>
<div class="hero__advantages"> <div class="hero__advantages">
<div class="hero__advantages-item"> <div class="hero__advantages-item">
<div class="hero__advantages-icon"> <div class="hero__advantages-icon">
<img src="assets/img/advantages_icon1.svg" width="40" height="40" alt="Гарантия 50 лет"> <img src="assets/img/optimization 1.svg" width="40" height="40" alt="Сервисное обслуживание и ремонт">
</div> </div>
<p>Гарантия 50 лет</p> <p>Сервисное обслуживание и ремонт</p>
</div> </div>
<div class="hero__advantages-item"> <div class="hero__advantages-item">
<div class="hero__advantages-icon"> <div class="hero__advantages-icon">
<img src="assets/img/advantages_icon2.svg" width="40" height="40" alt="Выгрузка кран/манипулятор"> <img src="assets/img/time.svg" width="40" height="40" alt="Проводим быстрый монтаж!">
</div> </div>
<p>Выгрузка с помощью крана</p> <p>Проводим быстрый монтаж!</p>
</div> </div>
<div class="hero__advantages-item"> <div class="hero__advantages-item">
<div class="hero__advantages-icon"> <div class="hero__advantages-icon">
<img src="assets/img/advantages_icon3.svg" width="40" height="40" <img src="assets/img/advantages_icon3.svg" width="40" height="40"
alt="Доставка от 1го дня по Томску и области до вашего объекта"> alt="Гарантия на экраны до 10 лет!">
</div> </div>
<p>Соответствует ГОСТ</p> <p>Гарантия на экраны до 10 лет!</p>
</div> </div>
<div class="hero__advantages-item"> <div class="hero__advantages-item">
<div class="hero__advantages-icon"> <div class="hero__advantages-icon">
@ -121,32 +134,35 @@
</div> </div>
</div> </div>
</div> </div>
</div>
</section> </section>
</main> </main>
<footer class="footer"> <footer class="footer">
<div class="footer__container container"> <div class="footer__container container">
<div class="footer__top"> <div class="footer__top">
<div class="footer__logo flex flex-ac gap-24"> <div class="footer__logo flex flex-ac gap-24">
<img src="assets/img/footer-logo.webp" width="74" height="62" alt="Продажа строительных материалов в Томске"> <img class="logo--without-icon" src="assets/img/Logo--footer.png" height="62" alt="Продажа строительных материалов в Томске">
<p>Продажа строительных материалов в&nbsp;Томске</p> <p>Led экраны <br>в Москве</p>
</div> </div>
<div class="footer__address"> <div class="footer__address">
<p>г. Томск ул. Карла Маркса 63</p> <p>г. Москва Переведеновский пер., 13, стр. 4</p>
</div> </div>
<div class="footer__contacts"> <div class="footer__contacts">
<a href="tel:+79234352557" class="footer__tel" title="Позвоните нам">+7 (923) 435 25 57</a> <a href="tel:89227097101" class="footer__tel" title="Позвоните нам">
<p>+7 922 709-71-01</p>
</a>
<div class="footer__socials flex flex-ac gap-10"> <div class="footer__socials flex flex-ac gap-10">
<a href="https://t.me/+79234352557" target="_blank" class="footer__socials-link"> <!-- <a href="https://t.me/+79234352557" target="_blank" class="footer__socials-link">
<img src="assets/img/tg-white.svg" width="27" height="27" alt="Мы в Telegram" title="Мы в Telegram"> <img src="assets/img/tg-white.svg" width="27" height="27" alt="Мы в Telegram" title="Мы в Telegram">
</a> </a>
<a href="https://wa.me/+79234352557" target="_blank" class="footer__socials-link"> <a href="https://wa.me/+79234352557" target="_blank" class="footer__socials-link">
<img src="assets/img/wh-white.svg" width="27" height="27" alt="Мы в Whatsapp" title="Мы в Whatsapp"> <img src="assets/img/wh-white.svg" width="27" height="27" alt="Мы в Whatsapp" title="Мы в Whatsapp">
</a> </a> -->
</div> </div>
</div> </div>
</div> </div>
<div class="footer__bottom"> <div class="footer__bottom">
<p>© VEKTOR.RU Все права защищены</p> <p>© LED-HUB.RU Все права защищены</p>
<a href="#" target="_blank">Политика конфиденциальности</a> <a href="#" target="_blank">Политика конфиденциальности</a>
<a href="#" class="modal__btn" data-modal="bank">Реквизиты компании</a> <a href="#" class="modal__btn" data-modal="bank">Реквизиты компании</a>
</div> </div>

@ -23,9 +23,9 @@ require 'phpmailer/Exception.php';
$mail->Port = 587; $mail->Port = 587;
// $mail->setFrom('noreply@vectortomsk.ru', 'Вектор'); // $mail->setFrom('noreply@vectortomsk.ru', 'Вектор');
$mail->setFrom('noreply@ledoffsky.agency', 'Вектор'); $mail->setFrom('noreply@ledoffsky.agency', 'led-hub.ru');
$mailAddress = 'kosbelan@yandex.ru'; $mailAddress = 'maxvarvarin3@gmail.com';
$mail->addAddress($mailAddress); $mail->addAddress($mailAddress);
$message = ''; $message = '';
@ -37,12 +37,6 @@ require 'phpmailer/Exception.php';
if (strpos($key, 'tel') !== false) { if (strpos($key, 'tel') !== false) {
$key = 'Номер телефона:'; $key = 'Номер телефона:';
} }
if (strpos($key, 'types') !== false) {
$key = 'Тип блока:';
}
if (strpos($key, 'quantity') !== false) {
$key = 'Количество:';
}
if( empty($value) ) { if( empty($value) ) {
$key = ''; $key = '';
$value = ''; $value = '';
@ -57,7 +51,7 @@ require 'phpmailer/Exception.php';
'. $message .' '. $message .'
</tbody> </tbody>
</table> </table>
<p>Отправлено с сайта: <a href="https://vectortomsk.ru/">Вектор</a></p> <p>Отправлено с сайта: <a href="'. $_SERVER['SCRIPT_URI'] . '">'. $_SERVER['SCRIPT_URI'] . '</a></p>
'; ';
$mail->isHTML(true); $mail->isHTML(true);

Loading…
Cancel
Save