save
This commit is contained in:
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -91,12 +91,23 @@ strong {
|
||||
}
|
||||
|
||||
.box-2 {
|
||||
margin-bottom: 80px;
|
||||
|
||||
&--wrapper {
|
||||
.box-title {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.box-3 {
|
||||
margin-bottom: 135px;
|
||||
|
||||
&--wrapper {
|
||||
.box-title {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.swiper {
|
||||
.swiper-slide {
|
||||
&:hover {
|
||||
@@ -201,19 +212,397 @@ strong {
|
||||
}
|
||||
}
|
||||
|
||||
.box-3 {
|
||||
}
|
||||
|
||||
.box-4 {
|
||||
margin-bottom: 100px;
|
||||
|
||||
&--wrapper {
|
||||
.box-title {
|
||||
margin-bottom: 28px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
|
||||
@media (min-width: 1600px) {
|
||||
max-width: 1270px;
|
||||
}
|
||||
}
|
||||
|
||||
.data-box {
|
||||
background: #1e2832;
|
||||
border-radius: 30px;
|
||||
overflow: hidden;
|
||||
min-height: 212px;
|
||||
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
|
||||
.data-text {
|
||||
padding: 30px 70px;
|
||||
// max-width: 750px;
|
||||
width: 100%;
|
||||
|
||||
p {
|
||||
max-width: 750px;
|
||||
margin: 0 auto;
|
||||
|
||||
color: $cWhite;
|
||||
font-family: $font3;
|
||||
font-weight: 300;
|
||||
font-size: 18px;
|
||||
line-height: 1.65;
|
||||
text-align: justify;
|
||||
letter-spacing: -0.02em;
|
||||
|
||||
strong {
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
}
|
||||
.data-img {
|
||||
position: relative;
|
||||
margin-left: auto;
|
||||
|
||||
> img {
|
||||
max-height: 212px;
|
||||
}
|
||||
.shape {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
|
||||
img {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.container {
|
||||
@media (min-width: 1600px) {
|
||||
max-width: 1550px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.box-5 {
|
||||
margin-bottom: 120px;
|
||||
|
||||
&--wrapper {
|
||||
.tiles {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
column-gap: 20px;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
list-style: none;
|
||||
|
||||
.tile {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
row-gap: 40px;
|
||||
|
||||
.tile-img {
|
||||
height: 60px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
max-width: fit-content;
|
||||
}
|
||||
}
|
||||
|
||||
.tile-data {
|
||||
p {
|
||||
color: #000000;
|
||||
font-family: $font3;
|
||||
font-weight: 400;
|
||||
font-size: 20px;
|
||||
line-height: 1.25;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.box-6 {
|
||||
margin-bottom: 100px;
|
||||
|
||||
&--wrapper {
|
||||
.box-title {
|
||||
margin-bottom: 28px;
|
||||
}
|
||||
|
||||
.slider-box-6 {
|
||||
overflow: initial;
|
||||
|
||||
.swiper-slide {
|
||||
.slide-wrapper {
|
||||
background: $cWhite;
|
||||
border: 1px solid #d2cec4;
|
||||
box-shadow: 0px 4px 19.8px 1px rgba(0, 0, 0, 0.25);
|
||||
border-radius: 20px;
|
||||
overflow: hidden;
|
||||
|
||||
.slide-img {
|
||||
position: relative;
|
||||
height: 189px;
|
||||
|
||||
> img {
|
||||
height: 189px;
|
||||
width: 100%;
|
||||
object-fit: cover;
|
||||
object-position: center bottom;
|
||||
}
|
||||
|
||||
.flags {
|
||||
position: absolute;
|
||||
left: 22px;
|
||||
top: 14px;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
list-style: none;
|
||||
|
||||
li {
|
||||
position: relative;
|
||||
min-width: 128px;
|
||||
height: 22px;
|
||||
border-radius: 8px;
|
||||
line-height: 0;
|
||||
padding: 4px 10px;
|
||||
text-align: center;
|
||||
|
||||
&.bestseller {
|
||||
background: linear-gradient(
|
||||
60.72deg,
|
||||
#fcb928 -55.31%,
|
||||
#fff246 109.05%,
|
||||
#fff246 188.88%
|
||||
);
|
||||
|
||||
span {
|
||||
color: #1e2832;
|
||||
}
|
||||
}
|
||||
&.polecane {
|
||||
background: linear-gradient(
|
||||
59.79deg,
|
||||
#1e2832 10.62%,
|
||||
#5b7a98 106.08%
|
||||
);
|
||||
|
||||
span {
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
&.promocja {
|
||||
min-width: 138px;
|
||||
background: linear-gradient(
|
||||
255.41deg,
|
||||
#b92323 27.39%,
|
||||
#920a0a 63.12%
|
||||
);
|
||||
|
||||
&::after {
|
||||
content: '%';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 5px;
|
||||
font-family: $font3;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
font-size: 32px;
|
||||
line-height: 0;
|
||||
color: #ffffff;
|
||||
text-shadow:
|
||||
1px 1px #920a0a,
|
||||
-1px -1px #920a0a,
|
||||
-1px 1px #920a0a,
|
||||
1px -1px #920a0a;
|
||||
}
|
||||
span {
|
||||
color: #ffffff;
|
||||
padding-right: 25px;
|
||||
}
|
||||
}
|
||||
&.nowosc {
|
||||
background: linear-gradient(
|
||||
59.79deg,
|
||||
#29864d 10.62%,
|
||||
#274b39 106.08%
|
||||
);
|
||||
|
||||
span {
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
span {
|
||||
font-family: $font3;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
line-height: 1.2;
|
||||
text-align: center;
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.slide-data {
|
||||
padding: 15px 15px 20px 25px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.slide-title {
|
||||
color: #000000;
|
||||
font-family: $font3;
|
||||
font-weight: 500;
|
||||
font-size: 20px;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
.slide-color {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
width: 100%;
|
||||
margin-bottom: 13px;
|
||||
max-width: 167px;
|
||||
|
||||
&.color-pvc {
|
||||
span {
|
||||
background-color: #d5d5d5;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
&.color-drewno {
|
||||
span {
|
||||
background: linear-gradient(
|
||||
90deg,
|
||||
#927b63 0%,
|
||||
#a89177 100%
|
||||
);
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
&.color-drewno-alu {
|
||||
span {
|
||||
&:nth-child(1) {
|
||||
background: linear-gradient(
|
||||
90deg,
|
||||
#927b63 0%,
|
||||
#a89177 100%
|
||||
);
|
||||
width: 80%;
|
||||
}
|
||||
&:nth-child(2) {
|
||||
background: linear-gradient(
|
||||
90deg,
|
||||
#336997 0%,
|
||||
#3f576f 100%
|
||||
);
|
||||
width: 20%;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.color-alu {
|
||||
span {
|
||||
background: linear-gradient(
|
||||
90deg,
|
||||
#336997 0%,
|
||||
#3f576f 100%
|
||||
);
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
&.color-pvc-alu {
|
||||
span {
|
||||
&:nth-child(1) {
|
||||
background: #d5d5d5;
|
||||
width: 70%;
|
||||
}
|
||||
&:nth-child(2) {
|
||||
background: linear-gradient(
|
||||
90deg,
|
||||
#336997 0%,
|
||||
#3f576f 100%
|
||||
);
|
||||
width: 30%;
|
||||
}
|
||||
}
|
||||
}
|
||||
span {
|
||||
height: 10px;
|
||||
}
|
||||
}
|
||||
.slide-type {
|
||||
margin-bottom: 8px;
|
||||
|
||||
p {
|
||||
color: #000000;
|
||||
font-family: $font3;
|
||||
font-weight: 300;
|
||||
font-size: 16px;
|
||||
line-height: 1;
|
||||
}
|
||||
}
|
||||
.slide-link {
|
||||
display: inline-flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 5px 15px;
|
||||
border: 1px solid #f1efed;
|
||||
border-radius: 10px;
|
||||
width: 100%;
|
||||
max-width: 200px;
|
||||
transition: all 250ms ease-in-out;
|
||||
|
||||
&:hover {
|
||||
background: #1e2832;
|
||||
border-color: #1e2832;
|
||||
|
||||
span {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
svg {
|
||||
path {
|
||||
fill: #fbf27a;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
span {
|
||||
color: #1e2832;
|
||||
font-family: $font3;
|
||||
font-weight: 500;
|
||||
font-size: 16px;
|
||||
line-height: 1;
|
||||
transition: all 250ms ease-in-out;
|
||||
}
|
||||
svg {
|
||||
path {
|
||||
transition: all 250ms ease-in-out;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.box-7 {
|
||||
margin-bottom: 100px;
|
||||
|
||||
&--wrapper {
|
||||
max-width: 1240px;
|
||||
margin: 0 auto;
|
||||
@@ -252,8 +641,152 @@ strong {
|
||||
}
|
||||
|
||||
.box-8 {
|
||||
margin-bottom: 100px;
|
||||
|
||||
&--wrapper {
|
||||
.data-box {
|
||||
background: #1e2832;
|
||||
border-radius: 30px;
|
||||
overflow: hidden;
|
||||
min-height: 212px;
|
||||
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
|
||||
.data-text {
|
||||
padding: 30px 70px;
|
||||
flex: 1;
|
||||
|
||||
.data-text--wrapper {
|
||||
width: fit-content;
|
||||
margin: 0 auto;
|
||||
|
||||
h3 {
|
||||
color: $cWhite;
|
||||
font-family: $font3;
|
||||
font-weight: 400;
|
||||
font-size: 30px;
|
||||
line-height: 1.2;
|
||||
}
|
||||
p {
|
||||
color: $cWhite;
|
||||
font-family: $font3;
|
||||
font-weight: 300;
|
||||
font-size: 18px;
|
||||
line-height: 1.65;
|
||||
text-align: justify;
|
||||
letter-spacing: -0.02em;
|
||||
|
||||
strong {
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.data-img {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
max-width: 810px;
|
||||
|
||||
> img {
|
||||
max-height: 212px;
|
||||
width: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
.shape {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
|
||||
img {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.container {
|
||||
@media (min-width: 1600px) {
|
||||
max-width: 1550px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.box-9 {
|
||||
margin-bottom: 140px;
|
||||
|
||||
&--wrapper {
|
||||
.box-title {
|
||||
margin-bottom: 28px;
|
||||
}
|
||||
|
||||
.tiles {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
list-style: none;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 30px;
|
||||
|
||||
.tile {
|
||||
.tile-wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
row-gap: 48px;
|
||||
padding: 35px;
|
||||
height: 100%;
|
||||
|
||||
background: #ffffff;
|
||||
box-shadow: 8px 8px 20px rgba(0, 0, 0, 0.1);
|
||||
border-radius: 50px 0px;
|
||||
|
||||
.stars {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
list-style: none;
|
||||
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
|
||||
li {
|
||||
img {
|
||||
width: 26px;
|
||||
min-width: 26px;
|
||||
height: 26px;
|
||||
object-fit: contain;
|
||||
}
|
||||
}
|
||||
}
|
||||
.tile-data {
|
||||
flex: 1;
|
||||
|
||||
p {
|
||||
color: $cBlack;
|
||||
font-family: $font3;
|
||||
font-weight: 300;
|
||||
font-size: 18px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
}
|
||||
.tile-author {
|
||||
p {
|
||||
color: $cBlack;
|
||||
font-family: $font3;
|
||||
font-weight: 300;
|
||||
font-size: 14px;
|
||||
line-height: 1.5;
|
||||
letter-spacing: 0.19em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
<?php
|
||||
$box1_arrow = ' <svg width="10" height="17" viewBox="0 0 10 17" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9.38477 8.03125L9.06738 8.34863L9.07129 8.35254L1.35352 16.0703L0 14.7168L6.68164 8.03516L0 1.35352L1.35352 0L9.38477 8.03125Z" fill="#1E2832"/></svg>';
|
||||
$box1_arrow = '<svg width="10" height="17" viewBox="0 0 10 17" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9.38477 8.03125L9.06738 8.34863L9.07129 8.35254L1.35352 16.0703L0 14.7168L6.68164 8.03516L0 1.35352L1.35352 0L9.38477 8.03125Z" fill="#1E2832"/></svg>';
|
||||
$box6_arrow = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M3.99984 12.9981L3.99984 10.9981L15.9998 10.9981L10.4998 5.49813L11.9198 4.07813L19.8398 11.9981L11.9198 19.9181L10.4998 18.4981L15.9998 12.9981L3.99984 12.9981Z" fill="#1E2832"/></svg>';
|
||||
?>
|
||||
|
||||
<main id="AppHome">
|
||||
@@ -20,7 +21,7 @@
|
||||
</li>
|
||||
<li class="tile">
|
||||
<div class="tile-img">
|
||||
<img src="/upload/filemanager/Pages/home-page/Okna.svg" alt="Okna">
|
||||
<img src="/upload/filemanager/Pages/home-page/Drzwi-wejsciowe.svg" alt="Drzwi wejściowe">
|
||||
</div>
|
||||
<div class="tile-text">
|
||||
<h3>Drzwi wejściowe</h3>
|
||||
@@ -29,7 +30,7 @@
|
||||
</li>
|
||||
<li class="tile">
|
||||
<div class="tile-img">
|
||||
<img src="/upload/filemanager/Pages/home-page/Okna.svg" alt="Okna">
|
||||
<img src="/upload/filemanager/Pages/home-page/Systemy-przesuwne.svg" alt="Systemy przesuwne">
|
||||
</div>
|
||||
<div class="tile-text">
|
||||
<h3>Systemy przesuwne</h3>
|
||||
@@ -38,7 +39,7 @@
|
||||
</li>
|
||||
<li class="tile">
|
||||
<div class="tile-img">
|
||||
<img src="/upload/filemanager/Pages/home-page/Okna.svg" alt="Okna">
|
||||
<img src="/upload/filemanager/Pages/home-page/Fasady.svg" alt="Fasady">
|
||||
</div>
|
||||
<div class="tile-text">
|
||||
<h3>Fasady</h3>
|
||||
@@ -48,7 +49,7 @@
|
||||
</li>
|
||||
<li class="tile">
|
||||
<div class="tile-img">
|
||||
<img src="/upload/filemanager/Pages/home-page/Okna.svg" alt="Okna">
|
||||
<img src="/upload/filemanager/Pages/home-page/Rolety-i-bramy.svg" alt="Rolety i bramy">
|
||||
</div>
|
||||
<div class="tile-text">
|
||||
<h3>Rolety i bramy</h3>
|
||||
@@ -64,8 +65,16 @@
|
||||
<div class="container">
|
||||
<div class="box-2--wrapper">
|
||||
<h2 class="box-title">Spektrum <strong>możliwości</strong></h2>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="swiper slider-box-2">
|
||||
<div class="box-3">
|
||||
<div class="container">
|
||||
<div class="box-3--wrapper">
|
||||
<h2 class="box-title">Spektrum <strong>materiału</strong></h2>
|
||||
|
||||
<div class="swiper slider-box-3">
|
||||
<div class="swiper-wrapper">
|
||||
<div class="swiper-slide">
|
||||
<div class="slide-data">
|
||||
@@ -130,22 +139,22 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="box-3">
|
||||
<div class="container">
|
||||
<div class="box-3--wrapper">
|
||||
<h2 class="box-title">Spektrum <strong>materiału</strong></h2>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="box-4">
|
||||
<div class="container">
|
||||
<div class="box-4--wrapper">
|
||||
<h2 class="box-title">Spektrum <strong>usług</strong></h2>
|
||||
|
||||
|
||||
<div class="data-box">
|
||||
<div class="data-text">
|
||||
<p>Za jakością <strong>VIDOK okna i drzwi</strong> stoi nie tylko produkt, ale również zespół, wiedza i standard obsługi. Zapewniamy <strong>profesjonalne wsparcie</strong> na każdym etapie realizacji, od projektu i doboru rozwiązań po logistykę, montaż, oraz opiekę serwisu.</p>
|
||||
</div>
|
||||
<div class="data-img">
|
||||
<div class="shape">
|
||||
<img src="/upload/filemanager/Pages/home-page/shape-1.svg" alt="">
|
||||
</div>
|
||||
<img src="/upload/filemanager/Pages/home-page/img-1.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -154,7 +163,56 @@
|
||||
<div class="container">
|
||||
<div class="box-5--wrapper">
|
||||
|
||||
|
||||
<ol class="tiles">
|
||||
<li class="tile">
|
||||
<div class="tile-img">
|
||||
<img src="/upload/filemanager/Pages/home-page/icon-1.svg" alt="">
|
||||
</div>
|
||||
<div class="tile-data">
|
||||
<p>Profesjonalne doradztwo</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="tile">
|
||||
<div class="tile-img">
|
||||
<img src="/upload/filemanager/Pages/home-page/icon-2.svg" alt="">
|
||||
</div>
|
||||
<div class="tile-data">
|
||||
<p>Nowoczesne technologie</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="tile">
|
||||
<div class="tile-img">
|
||||
<img src="/upload/filemanager/Pages/home-page/icon-3.svg" alt="">
|
||||
</div>
|
||||
<div class="tile-data">
|
||||
<p>Precyzyjny montaż</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="tile">
|
||||
<div class="tile-img">
|
||||
<img src="/upload/filemanager/Pages/home-page/icon-4.svg" alt="">
|
||||
</div>
|
||||
<div class="tile-data">
|
||||
<p>Gwarancja i serwis</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="tile">
|
||||
<div class="tile-img">
|
||||
<img src="/upload/filemanager/Pages/home-page/icon-5.svg" alt="">
|
||||
</div>
|
||||
<div class="tile-data">
|
||||
<p>Indywidualne podejście</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="tile">
|
||||
<div class="tile-img">
|
||||
<img src="/upload/filemanager/Pages/home-page/icon-6.svg" alt="">
|
||||
</div>
|
||||
<div class="tile-data">
|
||||
<p>Logistyka</p>
|
||||
</div>
|
||||
</li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -164,7 +222,114 @@
|
||||
<div class="box-6--wrapper">
|
||||
<h2 class="box-title">Nasze <strong>kolekcje</strong></h2>
|
||||
|
||||
|
||||
<div class="swiper slider-box-6">
|
||||
<div class="swiper-wrapper">
|
||||
<div class="swiper-slide">
|
||||
<div class="slide-wrapper">
|
||||
<div class="slide-img">
|
||||
<img src="/upload/filemanager/Pages/home-page/img-3.jpg" alt="">
|
||||
<ol class="flags">
|
||||
<li class="bestseller">
|
||||
<span>BESTSELLER</span>
|
||||
</li>
|
||||
</ol>
|
||||
</div>
|
||||
<div class="slide-data">
|
||||
<h3 class="slide-title">VP 82 Gold Energy Okna klasy premium</h3>
|
||||
<div class="slide-color color-pvc">
|
||||
<span></span>
|
||||
</div>
|
||||
<div class="slide-type">
|
||||
<p>VIDOK <strong>PVC</strong></p>
|
||||
</div>
|
||||
<a href="#" class="slide-link">
|
||||
<span>Szczegóły</span>
|
||||
<?= $box6_arrow; ?>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="swiper-slide">
|
||||
<div class="slide-wrapper">
|
||||
<div class="slide-img">
|
||||
<img src="/upload/filemanager/Pages/home-page/img-4.jpg" alt="">
|
||||
<ol class="flags">
|
||||
<li class="polecane">
|
||||
<span>POLECANE</span>
|
||||
</li>
|
||||
</ol>
|
||||
</div>
|
||||
<div class="slide-data">
|
||||
<h3 class="slide-title">VP 80 Platinum Design Aluminiowy look</h3>
|
||||
<div class="slide-color color-pvc">
|
||||
<span></span>
|
||||
</div>
|
||||
<div class="slide-type">
|
||||
<p>VIDOK <strong>PVC</strong></p>
|
||||
</div>
|
||||
<a href="#" class="slide-link">
|
||||
<span>Szczegóły</span>
|
||||
<?= $box6_arrow; ?>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="swiper-slide">
|
||||
<div class="slide-wrapper">
|
||||
<div class="slide-img">
|
||||
<img src="/upload/filemanager/Pages/home-page/img-5-1.jpg" alt="">
|
||||
<ol class="flags">
|
||||
<li class="promocja">
|
||||
<span>PROMOCJA!</span>
|
||||
</li>
|
||||
</ol>
|
||||
</div>
|
||||
<div class="slide-data">
|
||||
<h3 class="slide-title">Drzwi aluminiowe dostępne od ręki w super cenie!</h3>
|
||||
<div class="slide-color color-alu">
|
||||
<span></span>
|
||||
</div>
|
||||
<div class="slide-type">
|
||||
<p>VIDOK <strong>ALUMINIUM</strong></p>
|
||||
</div>
|
||||
<a href="#" class="slide-link">
|
||||
<span>Szczegóły</span>
|
||||
<?= $box6_arrow; ?>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="swiper-slide">
|
||||
<div class="slide-wrapper">
|
||||
<div class="slide-img">
|
||||
<img src="/upload/filemanager/Pages/home-page/img-6.jpg" alt="">
|
||||
<ol class="flags">
|
||||
<li class="nowosc">
|
||||
<span>NOWOŚĆ</span>
|
||||
</li>
|
||||
</ol>
|
||||
</div>
|
||||
<div class="slide-data">
|
||||
<h3 class="slide-title">NORDIC Okna otwierane na zewnątrz</h3>
|
||||
<div class="slide-color color-drewno-alu">
|
||||
<span></span>
|
||||
<span></span>
|
||||
</div>
|
||||
<div class="slide-type">
|
||||
<p>VIDOK <strong>DREWNO+ALU</strong></p>
|
||||
</div>
|
||||
<a href="#" class="slide-link">
|
||||
<span>Szczegóły</span>
|
||||
<?= $box6_arrow; ?>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -185,6 +350,21 @@
|
||||
<div class="box-8">
|
||||
<div class="container">
|
||||
<div class="box-8--wrapper">
|
||||
|
||||
<div class="data-box">
|
||||
<div class="data-text">
|
||||
<div class="data-text--wrapper">
|
||||
<h3>Otwórz drzwi do inspiracji</h3>
|
||||
<p>Zobacz wybrane realizacje i możliwości aranżacji.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="data-img">
|
||||
<div class="shape">
|
||||
<img src="/upload/filemanager/Pages/home-page/shape-1.svg" alt="">
|
||||
</div>
|
||||
<img src="/upload/filemanager/Pages/home-page/img-2.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -194,19 +374,66 @@
|
||||
<div class="box-9--wrapper">
|
||||
<h2 class="box-title">Co mówią o nas klienci</h2>
|
||||
|
||||
|
||||
<ol class="tiles">
|
||||
<li class="tile">
|
||||
<div class="tile-wrapper">
|
||||
<ul class="stars">
|
||||
<?php foreach (range(1, 5) as $star) : ?>
|
||||
<li><img src="/upload/filemanager/Pages/home-page/star.svg" alt=""></li>
|
||||
<?php endforeach; ?>
|
||||
</ul>
|
||||
<div class="tile-data">
|
||||
<p>Mój mąż przeprowadzał w ostatnim czasie kapitalny remont domu, do którego mamy się wprowadzić. Do wymiany poszło wiele rzeczy, w tym okna, które były nieszczelne. Znajomy polecił nam firmę VIDOK. Posłuchaliśmy się jego rekomendacji i zamówiliśmy okna drewniane, które pięknie się prezentują i świetnie tłumią hałasy z zewnątrz.</p>
|
||||
</div>
|
||||
<div class="tile-author">
|
||||
<p>Monika, borek stary</p>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li class="tile">
|
||||
<div class="tile-wrapper">
|
||||
<ul class="stars">
|
||||
<?php foreach (range(1, 5) as $star) : ?>
|
||||
<li><img src="/upload/filemanager/Pages/home-page/star.svg" alt=""></li>
|
||||
<?php endforeach; ?>
|
||||
</ul>
|
||||
<div class="tile-data">
|
||||
<p>Kolejny raz. zaufalismy firmie VIDOK jako dostawcy okien do realizowanego przez nas projektu. Serdecznie pilecamy. Jakosc wykonania, a przede wszystkim jakosc montazu 👌😎 Dwoch Panow, ktorzy montowali okna 15 maja po poludniu absolutny 100 % profesjonalizm i cp moze nawet jest jeszcze wazniejsze najwyzsza kultura osobista nie zachwiana nawet podczas przeciwnosci konstrukcyjnych istniejacego podczas montazu okien. Polecamy 😎👌</p>
|
||||
</div>
|
||||
<div class="tile-author">
|
||||
<p>SARNA ARCHITEKCI, Rzeszów</p>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li class="tile">
|
||||
<div class="tile-wrapper">
|
||||
<ul class="stars">
|
||||
<?php foreach (range(1, 5) as $star) : ?>
|
||||
<li><img src="/upload/filemanager/Pages/home-page/star.svg" alt=""></li>
|
||||
<?php endforeach; ?>
|
||||
</ul>
|
||||
<div class="tile-data">
|
||||
<p>Bardzo polecam firmę. Zamówienie, doradztwo, obsługa , terminowość absolutnie znakomita. Osoby tam pracujące przywracają mi wiarę w solidność i profesjonalizm ludzką. Wrócę do Was po drzwi😀</p>
|
||||
</div>
|
||||
<div class="tile-author">
|
||||
<p>Katarzyna Woskowicz, Kraków</p>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<script class="footer">
|
||||
var swiper_box_2 = new Swiper(".slider-box-2", {
|
||||
var swiper_box_3 = new Swiper(".slider-box-3", {
|
||||
slidesPerView: 5,
|
||||
spaceBetween: 80,
|
||||
pagination: {
|
||||
el: ".swiper-pagination",
|
||||
clickable: true,
|
||||
},
|
||||
});
|
||||
|
||||
var swiper_box_6 = new Swiper(".slider-box-6", {
|
||||
slidesPerView: 4,
|
||||
spaceBetween: 26,
|
||||
});
|
||||
</script>
|
||||
Reference in New Issue
Block a user