Commit a15ade53 authored by Evgeny Talagaev's avatar Evgeny Talagaev

changes from 19.01.23

parent 6ed79938
...@@ -16,7 +16,7 @@ let config = { ...@@ -16,7 +16,7 @@ let config = {
'src/scss/mixins.scss', 'src/scss/mixins.scss',
'../../node_modules/swiper/swiper.scss', '../../node_modules/swiper/swiper.scss',
'../../node_modules/swiper/modules/autoplay/autoplay.scss', '../../node_modules/swiper/modules/autoplay/autoplay.scss',
'../../node_modules/swiper/modules/autoplay/autoplay.scss', '../../node_modules/swiper/modules/thumbs/thumbs.scss',
// '../../node_modules/accordion-js/dist/accordion.min.css', // '../../node_modules/accordion-js/dist/accordion.min.css',
// 'somePackage/dist/somePackage.css', // для 'node_modules/somePackage/dist/somePackage.css', // 'somePackage/dist/somePackage.css', // для 'node_modules/somePackage/dist/somePackage.css',
], ],
......
...@@ -2,73 +2,77 @@ ...@@ -2,73 +2,77 @@
import ready from 'Utils/documentReady.js'; import ready from 'Utils/documentReady.js';
ready(function() { ready(function() {
const bgSliders = document.querySelectorAll('.bg-slider'); const bgSliderWrapper = document.querySelector('.bg-sliders');
if (bgSliders.length > 0) { if (bgSliderWrapper && window.getComputedStyle(bgSliderWrapper).display != 'none') {
const sldierDuration = parseInt(window.getComputedStyle(bgSliders[0]).getPropertyValue('--slider-duration-js')); const bgSliders = document.querySelectorAll('.bg-slider');
const sliderDelay = 1000;
const sliderAnimation = sldierDuration + sliderDelay;
const sliderDelayInAction = sldierDuration + (sliderAnimation * 2);
console.log(sldierDuration);
bgSliders.forEach(slider => { if (bgSliders.length > 0) {
firstAction(slider); const sldierDuration = parseInt(window.getComputedStyle(bgSliders[0]).getPropertyValue('--slider-duration-js'));
sliderInAction(slider, sliderDelayInAction); //1500 + 2500 + 2500 = 6500 const sliderDelay = 1000;
}); const sliderAnimation = sldierDuration + sliderDelay;
const sliderDelayInAction = sldierDuration + (sliderAnimation * 2);
function firstAction(slider) { bgSliders.forEach(slider => {
let activeSlide = slider.firstElementChild firstAction(slider);
let activeSlideClasses = activeSlide.dataset.classes.split(' '); sliderInAction(slider, sliderDelayInAction); //1500 + 2500 + 2500 = 6500
});
activeSlide.classList.add('active');
function firstAction(slider) {
setTimeout(() => { let activeSlide = slider.firstElementChild
if (activeSlideClasses[1]) {
slider.classList.add(activeSlideClasses[0]);
}
activeSlide.classList.remove('active');
setTimeout(() => {
activeSlideClasses[1] ? slider.classList.add(activeSlideClasses[1]) : slider.classList.add(activeSlideClasses[0]);
activeSlide.classList.add('active');
}, sldierDuration)
}, sliderAnimation);
}
function sliderInAction(slider, delay) {
setTimeout(() => {
let activeSlide = slider.querySelector('.active');
let activeSlideClasses = activeSlide.dataset.classes.split(' '); let activeSlideClasses = activeSlide.dataset.classes.split(' ');
let nextSlide = activeSlide.nextElementSibling === null ? slider.firstElementChild : activeSlide.nextElementSibling; activeSlide.classList.add('active');
let nextSlideClasses = nextSlide.dataset.classes.split(' ');
slider.classList.remove(...activeSlideClasses);
if (nextSlideClasses.length > 1) {
sliderInActionPart(activeSlide, nextSlide, nextSlideClasses);
} else {
sliderInActionPart(activeSlide, nextSlide, nextSlideClasses);
}
}, delay);
function sliderInActionPart(activeSlide, nextSlide, nextSlideClasses) {
if (nextSlideClasses[1]) {
slider.classList.add(nextSlideClasses[0]);
}
activeSlide.classList.remove('active');
setTimeout(() => { setTimeout(() => {
nextSlideClasses[1] ? slider.classList.add(nextSlideClasses[1]) : slider.classList.add(nextSlideClasses[0]); if (activeSlideClasses[1]) {
nextSlide.classList.add('active'); slider.classList.add(activeSlideClasses[0]);
}
sliderInAction(slider, sliderAnimation);
}, sldierDuration); activeSlide.classList.remove('active');
setTimeout(() => {
activeSlideClasses[1] ? slider.classList.add(activeSlideClasses[1]) : slider.classList.add(activeSlideClasses[0]);
activeSlide.classList.add('active');
}, sldierDuration)
}, sliderAnimation);
} }
function sliderInAction(slider, delay) {
setTimeout(() => {
let activeSlide = slider.querySelector('.active');
let activeSlideClasses = activeSlide.dataset.classes.split(' ');
let nextSlide = activeSlide.nextElementSibling === null ? slider.firstElementChild : activeSlide.nextElementSibling;
let nextSlideClasses = nextSlide.dataset.classes.split(' ');
slider.classList.remove(...activeSlideClasses);
if (nextSlideClasses.length > 1) {
sliderInActionPart(activeSlide, nextSlide, nextSlideClasses);
} else {
sliderInActionPart(activeSlide, nextSlide, nextSlideClasses);
}
}, delay);
function sliderInActionPart(activeSlide, nextSlide, nextSlideClasses) {
if (nextSlideClasses[1]) {
slider.classList.add(nextSlideClasses[0]);
}
activeSlide.classList.remove('active');
setTimeout(() => {
nextSlideClasses[1] ? slider.classList.add(nextSlideClasses[1]) : slider.classList.add(nextSlideClasses[0]);
nextSlide.classList.add('active');
sliderInAction(slider, sliderAnimation);
}, sldierDuration);
}
};
}; };
}
};
}); });
...@@ -21,8 +21,8 @@ ...@@ -21,8 +21,8 @@
@media (min-width: $screen-xxl) { @media (min-width: $screen-xxl) {
--s-cell: 161px; --s-cell: 161px;
--s-indent: 16px; --s-indent: 16px;
--slider-duration: 1.5s; --slider-duration: 1.25s;
--slider-duration-js: 1500; --slider-duration-js: 1250;
position: absolute; position: absolute;
left: var(--container-horizontal-padding); left: var(--container-horizontal-padding);
...@@ -39,20 +39,6 @@ ...@@ -39,20 +39,6 @@
transition: clip-path var(--slider-duration) cubic-bezier(0.895, 0, 0.18, 1); transition: clip-path var(--slider-duration) cubic-bezier(0.895, 0, 0.18, 1);
} }
@at-root .bg-sliders--type-1 & {
@media (min-width: $screen-xxl) {
--slider-duration: 2.25s;
--slider-duration-js: 2250;
}
}
@at-root .bg-sliders--type-2 & {
@media (min-width: $screen-xxl) {
--slider-duration: 3s;
--slider-duration-js: 3000;
}
}
&__item, &__item,
&__item-bg { &__item-bg {
@media (min-width: $screen-xxl) { @media (min-width: $screen-xxl) {
......
...@@ -14,6 +14,9 @@ ready(function(){ ...@@ -14,6 +14,9 @@ ready(function(){
function showBurgerTarget() { function showBurgerTarget() {
var targetId = this.getAttribute('data-target-id'); var targetId = this.getAttribute('data-target-id');
var targetClassToggle = this.getAttribute('data-target-class-toggle'); var targetClassToggle = this.getAttribute('data-target-class-toggle');
if (targetId && targetClassToggle) { if (targetId && targetClassToggle) {
this.classList.toggle('burger--close'); this.classList.toggle('burger--close');
document.getElementById(targetId).classList.toggle(targetClassToggle); document.getElementById(targetId).classList.toggle(targetClassToggle);
......
...@@ -8,14 +8,6 @@ ...@@ -8,14 +8,6 @@
position: relative; position: relative;
z-index: 10; z-index: 10;
@media (min-width: $screen-xxxl) {
margin: 0 76px;
}
@media (min-width: $screen-xxl) {
margin: 0 45px;
}
@at-root .page-header__inner & { @at-root .page-header__inner & {
@media (max-width: ($screen-xxl - 1)) { @media (max-width: ($screen-xxl - 1)) {
display: none; display: none;
...@@ -87,6 +79,7 @@ ...@@ -87,6 +79,7 @@
padding-right: 15px; padding-right: 15px;
} }
&.active,
&:hover, &:hover,
&:focus { &:focus {
outline: 0; outline: 0;
...@@ -95,6 +88,10 @@ ...@@ -95,6 +88,10 @@
color: $color-main; color: $color-main;
} }
&.active {
pointer-events: none;
}
&--lvl-2 { &--lvl-2 {
min-width: 200px; min-width: 200px;
......
...@@ -28,6 +28,7 @@ ...@@ -28,6 +28,7 @@
&__inner { &__inner {
display: flex; display: flex;
justify-content: space-between;
align-items: center; align-items: center;
position: relative; position: relative;
padding-top: 20px; padding-top: 20px;
...@@ -37,7 +38,6 @@ ...@@ -37,7 +38,6 @@
&__right { &__right {
display: flex; display: flex;
align-items: center; align-items: center;
margin-left: auto;
.main-nav__toggler { .main-nav__toggler {
@media (min-width: $screen-md) { @media (min-width: $screen-md) {
......
...@@ -859,10 +859,6 @@ pre { ...@@ -859,10 +859,6 @@ pre {
&__second { &__second {
font: 22px/140% $font-family; font: 22px/140% $font-family;
@media (min-width: $screen-xxl) {
font-size: 40px;
}
@media (min-width: $screen-xl) { @media (min-width: $screen-xl) {
font-size: 30px; font-size: 30px;
} }
...@@ -1055,6 +1051,18 @@ pre { ...@@ -1055,6 +1051,18 @@ pre {
@media (min-width: $screen-lg) { @media (min-width: $screen-lg) {
font-size: 36px; font-size: 36px;
} }
@at-root .next-article & {
@media (min-width: $screen-xxl) {
font-size: 40px;
}
}
&--type-1 {
@media (min-width: $screen-xxl) {
font-size: 50px;
}
}
} }
/* ----- .painted ----- */ /* ----- .painted ----- */
...@@ -1604,113 +1612,6 @@ pre { ...@@ -1604,113 +1612,6 @@ pre {
} }
} }
.swiper-pagination {
display: flex;
align-items: flex-start;
margin-top: 30px;
width: 100%;
@media (min-width: $screen-xxxl) {
margin-top: 110px;
width: calc(1920px - 20px);
}
@media (min-width: $screen-xxl) {
margin-top: 100px;
}
@media (min-width: $screen-xl) {
gap: 0 40px;
margin-top: 80px;
}
@media (min-width: $screen-lg) {
gap: 0 30px;
margin-top: 50px;
}
.swiper-pagination-custom-btn {
position: relative;
padding: 20px 0 0;
border: none;
width: 100%;
background-color: transparent;
overflow: hidden;
text-align: left;
font-size: 16px;
font-family: $font-family;
line-height: 130%;
cursor: pointer;
@media (min-width: $screen-xxxl) {
padding-top: 51px;
font-size: 25px;
width: calc(100% / 3 - (40px * 2));
}
@media (min-width: $screen-xxl) {
font-size: 23px;
}
@media (min-width: $screen-xl) {
padding-top: 50px;
font-size: 19px;
}
@media (min-width: $screen-md) {
padding-top: 35px;
font-size: 17px;
}
@media (max-width: ($screen-lg - 1)) {
display: none;
}
&.swiper-pagination-custom-btn-active {
cursor: default;
@media (max-width: ($screen-lg - 1)) {
display: block;
}
.swiper-pagination-progress {
span {
opacity: 1;
}
}
}
&.active {
.swiper-pagination-progress {
span {
width: 100%;
opacity: 1;
}
}
}
.swiper-pagination-progress,
.swiper-pagination-progress span {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 1px;
}
.swiper-pagination-progress {
background-color: rgba(48, 147, 100, 0.3);
span {
width: 0;
background-color: $color-main;
opacity: 0;
transition: opacity 1s;
}
}
}
}
&__s-inner { &__s-inner {
box-sizing: border-box; box-sizing: border-box;
...@@ -1854,6 +1755,116 @@ pre { ...@@ -1854,6 +1755,116 @@ pre {
} }
} }
.slider-t-1-pagination-wrapper {
@media (min-width: $screen-xxxl) {
// overflow: hidden;
}
}
.slider-t-1-pagination {
margin-top: 30px;
@media (min-width: $screen-xxxl) {
margin-top: 110px;
width: 1740px;
}
@media (min-width: $screen-xxl) {
margin-top: 100px;
}
@media (min-width: $screen-xl) {
margin-top: 80px;
}
@media (min-width: $screen-lg) {
margin-top: 50px;
}
}
.swiper-pagination-custom-btn {
position: relative;
padding: 20px 0 0;
border: none;
width: 100%;
background-color: transparent;
overflow: hidden;
text-align: left;
font-size: 16px;
font-family: $font-family;
line-height: 130%;
cursor: pointer;
@media (min-width: $screen-xxxl) {
padding-top: 51px;
font-size: 25px;
}
@media (min-width: $screen-xxl) {
font-size: 23px;
}
@media (min-width: $screen-xl) {
padding-top: 50px;
font-size: 19px;
}
@media (min-width: $screen-lg) {
}
@media (min-width: $screen-md) {
padding-top: 35px;
font-size: 17px;
}
@media (max-width: ($screen-lg - 1)) {
display: none;
}
@at-root .swiper-slide-thumb-active & {
cursor: default;
@media (max-width: ($screen-lg - 1)) {
display: block;
}
.swiper-pagination-progress {
span {
opacity: 1;
}
}
}
@at-root .autoplay-false .swiper-slide-thumb-active & {
.swiper-pagination-progress {
span {
width: 100%;
opacity: 1;
}
}
}
.swiper-pagination-progress,
.swiper-pagination-progress span {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 1px;
}
.swiper-pagination-progress {
background-color: rgba(48, 147, 100, 0.3);
span {
width: 0;
background-color: $color-main;
opacity: 0;
transition: opacity 1s;
}
}
}
/* ----- .map-svg ----- */ /* ----- .map-svg ----- */
.map-svg { .map-svg {
...@@ -1978,14 +1989,14 @@ pre { ...@@ -1978,14 +1989,14 @@ pre {
} }
&__pin { &__pin {
@media (min-width: $screen-xxl) { // @media (min-width: $screen-xxl) {
width: 28px; // width: 28px;
height: 28px; // height: 28px;
} // }
@media (min-width: $screen-xl) { @media (min-width: $screen-xl) {
width: 17px; width: 18px;
height: 17px; height: 18px;
} }
@media (min-width: $screen-lg) { @media (min-width: $screen-lg) {
...@@ -2028,8 +2039,8 @@ pre { ...@@ -2028,8 +2039,8 @@ pre {
path { path {
@media (min-width: $screen-md) { @media (min-width: $screen-md) {
position: relative; position: relative;
fill: transparent; // fill: transparent;
stroke: $color-main; // stroke: $color-main;
transition: fill $transition-time; transition: fill $transition-time;
} }
...@@ -2294,30 +2305,21 @@ pre { ...@@ -2294,30 +2305,21 @@ pre {
margin: 40px auto; margin: 40px auto;
@media (min-width: $screen-xxl) { @media (min-width: $screen-xxl) {
margin: 85px auto 100px;
} }
@media (min-width: $screen-lg) { @media (min-width: $screen-lg) {
margin: 80px auto; margin-bottom: 80px;
} }
&__title { &__title {
@media (min-width: $screen-xxl) { @media (min-width: $screen-lg) {
font-size: 80px; font-size: 40px;
} }
} }
& + .big-text { & + .big-text {
margin-top: 0; margin-top: 0;
} }
&--type-1 {
#{$block-name}__title {
@media (min-width: $screen-xxl) {
font-size: 80px;
}
}
}
} }
/* ----- .big-img ----- */ /* ----- .big-img ----- */
...@@ -2404,16 +2406,8 @@ pre { ...@@ -2404,16 +2406,8 @@ pre {
font-size: 18px; font-size: 18px;
line-height: 140%; line-height: 140%;
@media (min-width: $screen-xxl) {
font-size: 25px;
}
@media (min-width: $screen-xl) {
font-size: 22px;
}
@media (min-width: $screen-md) { @media (min-width: $screen-md) {
font-size: 22px; font-size: 20px;
} }
&__first, &__first,
...@@ -2486,10 +2480,6 @@ pre { ...@@ -2486,10 +2480,6 @@ pre {
} }
&__title { &__title {
@media (min-width: $screen-xxl) {
line-height: 82px;
}
@media (min-width: $screen-lg) { @media (min-width: $screen-lg) {
position: sticky; position: sticky;
top: 80px; top: 80px;
...@@ -2608,6 +2598,11 @@ pre { ...@@ -2608,6 +2598,11 @@ pre {
@media (min-width: $screen-lg) { @media (min-width: $screen-lg) {
margin: 80px auto; margin: 80px auto;
} }
.btn.active {
cursor: default;
pointer-events: none;
}
} }
/* ----- .buttons-group ----- */ /* ----- .buttons-group ----- */
...@@ -2880,6 +2875,12 @@ pre { ...@@ -2880,6 +2875,12 @@ pre {
background-image: url(../img/ico-clock-g.svg); background-image: url(../img/ico-clock-g.svg);
} }
} }
&--people {
&::before {
background-image: url(../img/ico-people.svg);
}
}
} }
&__i-divider { &__i-divider {
...@@ -2915,9 +2916,28 @@ pre { ...@@ -2915,9 +2916,28 @@ pre {
margin-top: 0 !important; margin-top: 0 !important;
} }
.swiper-slide {
max-width: 100%;
width: 70% !important;
opacity: 0.2;
transition: opacity 1s;
@media (min-width: $screen-xxl) {
width: 1160px !important;
}
&.swiper-slide-active {
opacity: 1;
}
}
.big-img { .big-img {
margin: 0 !important; margin: 0 !important;
} }
.big-img__photo {
aspect-ratio: 16/10.7;
}
} }
/* ----- .ac ----- */ /* ----- .ac ----- */
...@@ -2961,6 +2981,7 @@ pre { ...@@ -2961,6 +2981,7 @@ pre {
background-color: transparent; background-color: transparent;
font: 700 20px/130% $font-family; font: 700 20px/130% $font-family;
text-align: left; text-align: left;
color: $text-color;
@media (min-width: $screen-xxl) { @media (min-width: $screen-xxl) {
padding: 50px 100px 50px 0; padding: 50px 100px 50px 0;
...@@ -3037,10 +3058,6 @@ pre { ...@@ -3037,10 +3058,6 @@ pre {
margin: 40px 0; margin: 40px 0;
@media (min-width: $screen-xxl) {
margin: 120px 0;
}
@media (min-width: $screen-lg) { @media (min-width: $screen-lg) {
margin: 80px 0; margin: 80px 0;
} }
...@@ -3076,12 +3093,8 @@ pre { ...@@ -3076,12 +3093,8 @@ pre {
& + & { & + & {
margin-top: 30px; margin-top: 30px;
@media (min-width: $screen-xxl) {
margin-top: 90px;
}
@media (min-width: $screen-xl) { @media (min-width: $screen-xl) {
margin-top: 70px; margin-top: 60px;
} }
@media (min-width: $screen-lg) { @media (min-width: $screen-lg) {
...@@ -3115,10 +3128,6 @@ pre { ...@@ -3115,10 +3128,6 @@ pre {
font-size: 24px; font-size: 24px;
line-height: 130%; line-height: 130%;
@media (min-width: $screen-lg) {
font-size: 40px;
}
@media (min-width: $screen-md) { @media (min-width: $screen-md) {
font-size: 30px; font-size: 30px;
} }
......
This source diff could not be displayed because it is too large. You can view the blob instead.
import ready from 'Utils/documentReady.js'; import ready from 'Utils/documentReady.js';
import getScrollSize from 'Utils/getScrollSize.js'; import getScrollSize from 'Utils/getScrollSize.js';
import Swiper, { Navigation, Pagination, EffectFade, Autoplay } from 'swiper'; import Swiper, { Navigation, Pagination, EffectFade, Autoplay, Thumbs } from 'swiper';
import Accordion from 'accordion-js'; import Accordion from 'accordion-js';
Swiper.use([Navigation, Pagination, EffectFade, Autoplay]); Swiper.use([Navigation, Pagination, EffectFade, Autoplay, Thumbs]);
ready(function() { ready(function() {
console.log('DOM героически построен!'); console.log('DOM героически построен!');
...@@ -11,7 +11,7 @@ ready(function() { ...@@ -11,7 +11,7 @@ ready(function() {
// Добавление кастомного свойства с системной шириной скролла // Добавление кастомного свойства с системной шириной скролла
document.documentElement.style.setProperty('--css-scroll-size', `${getScrollSize()}px`); document.documentElement.style.setProperty('--css-scroll-size', `${getScrollSize()}px`);
const accordion = document.querySelector('.accordion-container'); const accordion = document.querySelector('.accordion-container');
if (accordion) { if (accordion) {
...@@ -20,13 +20,15 @@ ready(function() { ...@@ -20,13 +20,15 @@ ready(function() {
}); });
} }
const stickyHeader = document.querySelector('.page-header'); const stickyHeader = document.querySelector('.page-header');
const headerOffset = findOffset(stickyHeader); const headerOffset = findOffset(stickyHeader);
document.documentElement.style.setProperty('--header-bottom', `${stickyHeader.getBoundingClientRect().bottom}px`);
window.addEventListener('scroll', () => { window.addEventListener('scroll', () => {
const bodyScrollTop = document.documentElement.scrollTop || document.body.scrollTop; const bodyScrollTop = document.documentElement.scrollTop || document.body.scrollTop;
if (bodyScrollTop > headerOffset.top) { if (bodyScrollTop > headerOffset.top) {
stickyHeader.classList.add('fixed'); stickyHeader.classList.add('fixed');
} else { } else {
...@@ -38,20 +40,36 @@ ready(function() { ...@@ -38,20 +40,36 @@ ready(function() {
function findOffset(element) { function findOffset(element) {
let top = 0, left = 0; let top = 0, left = 0;
do { do {
top += element.offsetTop || 0; top += element.offsetTop || 0;
left += element.offsetLeft || 0; left += element.offsetLeft || 0;
element = element.offsetParent; element = element.offsetParent;
} while(element); } while(element);
return { return {
top: top, top: top,
left: left left: left
}; };
} }
// Swiper sliders // Swiper sliders
const sliderT1Pagination = new Swiper(".slider-t-1-pagination", {
speed: 1000,
spaceBetween: 40,
freeMode: true,
watchSlidesProgress: true,
breakpoints: {
320: {
slidesPerView: 1,
effect: 'fade',
},
992: {
slidesPerView: 3,
},
}
});
new Swiper(".slider-t-1", { new Swiper(".slider-t-1", {
autoplay: { autoplay: {
delay: 4000, delay: 4000,
...@@ -64,53 +82,20 @@ ready(function() { ...@@ -64,53 +82,20 @@ ready(function() {
nextEl: ".slider-t-1 .swiper-button-next", nextEl: ".slider-t-1 .swiper-button-next",
prevEl: ".slider-t-1 .swiper-button-prev", prevEl: ".slider-t-1 .swiper-button-prev",
}, },
pagination: { thumbs: {
el: '.slider-t-1 .swiper-pagination', swiper: sliderT1Pagination,
type: 'custom',
renderCustom: function(swiper, current, total) {
let customPaginationHtml = "";
for(let i = 0; i < total; i++) {
const slideTitle = swiper.slides[i].querySelector('.slider-t-1__s-title').textContent;
if(i == (current - 1)) {
customPaginationHtml += `
<button
data-slide='${i}'
class='swiper-pagination-custom-btn swiper-pagination-custom-btn-active'>
<span class='swiper-pagination-progress'><span></span></span>
${slideTitle}
</button>
`;
} else {
customPaginationHtml += `
<button
data-slide='${i}'
class='swiper-pagination-custom-btn'>
<span class='swiper-pagination-progress'><span></span></span>
${slideTitle}
</button>
`;
}
}
return customPaginationHtml;
}
}, },
on: { on: {
init: function(swiper) { init: function({activeIndex, passedParams}) {
body.addEventListener('click', (e) => { if (!passedParams.autoplay) {
if (e.target.classList.contains('swiper-pagination-custom-btn')) { sliderT1Pagination.el.classList.add('autoplay-false');
swiper.slideTo(e.target.dataset.slide); }
}
});
}, },
slideChange: function({pagination, activeIndex, passedParams}) { slideChange: function({activeIndex, passedParams}) {
if (passedParams.autoplay) { if (passedParams.autoplay) {
const acitveDot = pagination.el.children[activeIndex]; const paginationProgressElem = sliderT1Pagination.slides[activeIndex].querySelector('.swiper-pagination-progress span');
const paginationProgressElem = acitveDot.querySelector('.swiper-pagination-progress span');
const delay = (passedParams.autoplay.delay ? passedParams.autoplay.delay : 3000) + passedParams.speed; const delay = (passedParams.autoplay.delay ? passedParams.autoplay.delay : 3000) + passedParams.speed;
animate({ animate({
duration: delay, duration: delay,
timing(timeFraction) { timing(timeFraction) {
...@@ -120,17 +105,17 @@ ready(function() { ...@@ -120,17 +105,17 @@ ready(function() {
paginationProgressElem.style.width = progress * 100 + '%'; paginationProgressElem.style.width = progress * 100 + '%';
} }
}); });
function animate({timing, draw, duration}) { function animate({timing, draw, duration}) {
let start = performance.now(); let start = performance.now();
requestAnimationFrame(function animate(time) { requestAnimationFrame(function animate(time) {
let timeFraction = (time - start) / duration; let timeFraction = (time - start) / duration;
if (timeFraction > 1) timeFraction = 1; if (timeFraction > 1) timeFraction = 1;
let progress = timing(timeFraction); let progress = timing(timeFraction);
draw(progress); draw(progress);
if (timeFraction < 1) { if (timeFraction < 1) {
requestAnimationFrame(animate); requestAnimationFrame(animate);
} }
...@@ -141,6 +126,98 @@ ready(function() { ...@@ -141,6 +126,98 @@ ready(function() {
} }
}); });
// new Swiper(".slider-t-1", {
// autoplay: {
// delay: 4000,
// disableOnInteraction: false,
// },
// speed: 1000,
// slidesPerView: 1,
// effect: 'fade',
// navigation: {
// nextEl: ".slider-t-1 .swiper-button-next",
// prevEl: ".slider-t-1 .swiper-button-prev",
// },
// thumbs: {
// swiper: sliderT1Pagination,
// },
// pagination: {
// el: '.slider-t-1 .swiper-pagination',
// type: 'custom',
// renderCustom: function(swiper, current, total) {
// let customPaginationHtml = "";
// for(let i = 0; i < total; i++) {
// const slideTitle = swiper.slides[i].querySelector('.slider-t-1__s-title').textContent;
// if(i == (current - 1)) {
// customPaginationHtml += `
// <button
// data-slide='${i}'
// class='swiper-pagination-custom-btn swiper-pagination-custom-btn-active'>
// <span class='swiper-pagination-progress'><span></span></span>
// ${slideTitle}
// </button>
// `;
// } else {
// customPaginationHtml += `
// <button
// data-slide='${i}'
// class='swiper-pagination-custom-btn'>
// <span class='swiper-pagination-progress'><span></span></span>
// ${slideTitle}
// </button>
// `;
// }
// }
// return customPaginationHtml;
// }
// },
// on: {
// init: function(swiper) {
// body.addEventListener('click', (e) => {
// if (e.target.classList.contains('swiper-pagination-custom-btn')) {
// swiper.slideTo(e.target.dataset.slide);
// }
// });
// },
// slideChange: function({pagination, activeIndex, passedParams}) {
// if (passedParams.autoplay) {
// const acitveDot = pagination.el.children[activeIndex];
// const paginationProgressElem = acitveDot.querySelector('.swiper-pagination-progress span');
// const delay = (passedParams.autoplay.delay ? passedParams.autoplay.delay : 3000) + passedParams.speed;
// animate({
// duration: delay,
// timing(timeFraction) {
// return timeFraction;
// },
// draw(progress) {
// paginationProgressElem.style.width = progress * 100 + '%';
// }
// });
// function animate({timing, draw, duration}) {
// let start = performance.now();
// requestAnimationFrame(function animate(time) {
// let timeFraction = (time - start) / duration;
// if (timeFraction > 1) timeFraction = 1;
// let progress = timing(timeFraction);
// draw(progress);
// if (timeFraction < 1) {
// requestAnimationFrame(animate);
// }
// });
// }
// }
// },
// }
// });
new Swiper(".swiper-list .swiper", { new Swiper(".swiper-list .swiper", {
autoplay: { autoplay: {
delay: 3000, delay: 3000,
...@@ -164,14 +241,6 @@ ready(function() { ...@@ -164,14 +241,6 @@ ready(function() {
slidesPerView: 3, slidesPerView: 3,
spaceBetween: 40 spaceBetween: 40
}, },
992: {
slidesPerView: 4,
spaceBetween: 40
},
992: {
slidesPerView: 3,
spaceBetween: 40
},
1677: { 1677: {
slidesPerView: 4, slidesPerView: 4,
spaceBetween: 40 spaceBetween: 40
...@@ -180,9 +249,11 @@ ready(function() { ...@@ -180,9 +249,11 @@ ready(function() {
}); });
new Swiper(".big-slider", { new Swiper(".big-slider", {
slidesPerView: 1, // slidesPerView: 3,
slidesPerView: 'auto',
spaceBetween: 40,
centeredSlides: true,
speed: 1000, speed: 1000,
effect: 'fade',
navigation: { navigation: {
nextEl: ".big-slider .swiper-button-next", nextEl: ".big-slider .swiper-button-next",
prevEl: ".big-slider .swiper-button-prev", prevEl: ".big-slider .swiper-button-prev",
...@@ -205,11 +276,11 @@ ready(function() { ...@@ -205,11 +276,11 @@ ready(function() {
function pdgJSFun() { function pdgJSFun() {
const pdgJSLeft = pdgJSTitle.getBoundingClientRect().left; const pdgJSLeft = pdgJSTitle.getBoundingClientRect().left;
pdgJSListItems.forEach((item, i) => { pdgJSListItems.forEach((item, i) => {
if (!((i + 1) % divider)) { if (!((i + 1) % divider)) {
pdgJSListItems[i - (divider - 1)].style.paddingLeft = `${pdgJSLeft}px`; pdgJSListItems[i - (divider - 1)].style.paddingLeft = `${pdgJSLeft}px`;
pdgJSListItems[i].style.paddingRight = `${pdgJSLeft}px`; pdgJSListItems[i].style.paddingRight = `${pdgJSLeft - 17}px`;
} }
}); });
} }
...@@ -221,7 +292,7 @@ ready(function() { ...@@ -221,7 +292,7 @@ ready(function() {
if (mobMenu) { if (mobMenu) {
const mobMenuTrigger = document.querySelector('.main-nav__toggler'); const mobMenuTrigger = document.querySelector('.main-nav__toggler');
mobMenu.addEventListener("click", (e) => { mobMenu.addEventListener("click", (e) => {
if (e.target.classList.contains("mob-menu__close")) { if (e.target.classList.contains("mob-menu__close")) {
mobMenuTrigger.classList.remove('burger--close'); mobMenuTrigger.classList.remove('burger--close');
...@@ -250,15 +321,15 @@ ready(function() { ...@@ -250,15 +321,15 @@ ready(function() {
width: pathWidth, width: pathWidth,
height: pathHeight height: pathHeight
} = path.getBoundingClientRect(); } = path.getBoundingClientRect();
pathX = parseInt(pathX) - leftIndent; pathX = parseInt(pathX) - leftIndent;
pathY = parseInt(pathY) - topIndent; pathY = parseInt(pathY) - topIndent;
pinsArea.append(createPin(pathX + (pathWidth/2 - 13), pathY + (pathHeight/2 - 13), area)); pinsArea.append(createPin(pathX + (pathWidth/2 - 13), pathY + (pathHeight/2 - 13), area));
if (areaModal) { if (areaModal) {
const {width: modalWidth, height: modalHeight} = areaModal.getBoundingClientRect(); const {width: modalWidth, height: modalHeight} = areaModal.getBoundingClientRect();
const rightPointModal = pathX + leftIndent + pathWidth + 20 + modalWidth; const rightPointModal = pathX + leftIndent + pathWidth + 20 + modalWidth;
if (rightPointModal > screen.width) { if (rightPointModal > screen.width) {
areaModal.style.left = `${pathX - modalWidth - 20}px`; areaModal.style.left = `${pathX - modalWidth - 20}px`;
...@@ -291,7 +362,7 @@ ready(function() { ...@@ -291,7 +362,7 @@ ready(function() {
const curPin = document.querySelector(`.map-svg__pin[data-area='${area}']`); const curPin = document.querySelector(`.map-svg__pin[data-area='${area}']`);
const curModal = document.querySelector(`.map-svg__area[data-area='${area}']`); const curModal = document.querySelector(`.map-svg__area[data-area='${area}']`);
const curPath = document.querySelector(`#map-svg path[data-area='${area}']`); const curPath = document.querySelector(`#map-svg path[data-area='${area}']`);
curPath.classList[action]('hover'); curPath.classList[action]('hover');
curPin.classList[action]('hide'); curPin.classList[action]('hide');
curModal.classList[action]('active'); curModal.classList[action]('active');
...@@ -306,142 +377,155 @@ ready(function() { ...@@ -306,142 +377,155 @@ ready(function() {
const correctionsPins = { const correctionsPins = {
md: { md: {
smolenskaya: {left: 6, top: 5}, smolenskaya: {left: 6, top: 5},
kaliningradskaya: {left: 5, top: 5}, kaliningradskaya: {left: 8, top: 5},
murmanskaya: {left: 10, top: 0}, murmanskaya: {left: 9, top: 0},
leningradskaya: {left: 0, top: 2}, leningradskaya: {left: 0, top: 2},
pskovskaya: {left: 5, top: 6}, pskovskaya: {left: 5, top: 6},
novgorodskaya: {left: 7, top: 4}, novgorodskaya: {left: 7, top: 4},
tverskaya: {left: 6, top: 6}, tverskaya: {left: 6, top: 6},
bryanskaya: {left: 9, top: 8}, bryanskaya: {left: 6, top: 4},
moskovskaya: {left: 6, top: 6}, moskovskaya: {left: 6, top: 6},
voronezhskaya: {left: 8, top: 6}, voronezhskaya: {left: 5, top: 4},
yaroslavskaya: {left: 9, top: 6}, yaroslavskaya: {left: 9, top: 6},
ryazanskaya: {left: 8, top: 4}, ryazanskaya: {left: 6, top: 2},
ivanovskaya: {left: 8, top: 6}, ivanovskaya: {left: 8, top: 4},
vladimirskaya: {left: 5, top: 6}, vladimirskaya: {left: 5, top: 6},
lipetskaya: {left: 8, top: 3}, lipetskaya: {left: 8, top: 3},
nizhegorodskaya: {left: 4, top: 4}, nizhegorodskaya: {left: 4, top: 2},
mordoviya: {left: 6, top: 4}, mordoviya: {left: 6, top: 4},
'mariy-el': {left: 9, top: 6}, 'mariy-el': {left: 8, top: 2},
chuvashiya: {left: 7, top: 4}, chuvashiya: {left: 6, top: 2},
samarskaya: {left: 6, top: 6}, samarskaya: {left: 6, top: 6},
kirovskaya: {left: 4, top: 8}, kirovskaya: {left: 4, top: 8},
arkhangelskaya: {left: 4, top: 2}, arkhangelskaya: {left: 4, top: 2},
komi: {left: 0, top: 5}, komi: {left: 0, top: 5},
krym: {left: 5, top: 3}, krym: {left: 6, top: 2},
rostovskaya: {left: 4, top: 4}, rostovskaya: {left: 4, top: 4},
kalmykia: {left: 11, top: 4}, kalmykia: {left: 11, top: 4},
dagestan: {left: 12, top: 0}, dagestan: {left: 2, top: 10},
'karachayevo-cherkesiya': {left: 6, top: 2}, 'karachayevo-cherkesiya': {left: 6, top: 2},
'kabardino-balkariya': {left: 6, top: 4}, 'kabardino-balkariya': {left: 7, top: 2},
omskaya: {left: 10, top: 2}, omskaya: {left: 5, top: 5},
permskiy: {left: 10, top: 2}, permskiy: {left: 6, top: 2},
sverdlovskaya: {left: 12, top: 10}, sverdlovskaya: {left: 12, top: 10},
bashkortostan: {left: 2, top: 0}, bashkortostan: {left: 2, top: 0},
orenburgskaya: {left: 0, top: -2}, orenburgskaya: {left: -2, top: -2},
chelyabinskaya: {left: 16, top: 0}, chelyabinskaya: {left: 12, top: 3},
kurganskaya: {left: 6, top: 4}, kurganskaya: {left: 3, top: 5},
'khanty-mansiyskiy': {left: -10, top: 10}, 'khanty-mansiyskiy': {left: -10, top: 10},
'yamalo-nenetskiy': {left: 10, top: 25}, 'yamalo-nenetskiy': {left: 10, top: 25},
kemerovskaya: {left: 6, top: -2}, kemerovskaya: {left: 5, top: 2},
tyva: {left: 22, top: 0}, tyva: {left: 15, top: 5},
buryatiya: {left: 35, top: -8}, buryatiya: {left: 35, top: -8},
zabaykalskaya: {left: 20, top: 15}, zabaykalskaya: {left: 20, top: 15},
amurskaya: {left: 15, top: 0}, amurskaya: {left: 15, top: 0},
primorskaya: {left: 10, top: 5}, primorskaya: {left: 10, top: 5},
sakhalinskaya: {left: 5, top: 0}, sakhalinskaya: {left: 5, top: 0},
kamchatskaya: {left: 18, top: -25}, kamchatskaya: {left: 17, top: 25},
altayskiy: {left: 5, top: 5},
novosibirskaya: {left: 10, top: 8},
tomskaya: {left: 8, top: 5},
}, },
xl: { xl: {
smolenskaya: {left: 4, top: 2}, smolenskaya: {left: 4, top: 2},
kaliningradskaya: {left: 3, top: 4}, kaliningradskaya: {left: 7, top: 3},
murmanskaya: {left: 7, top: 0}, murmanskaya: {left: 10, top: 0},
leningradskaya: {left: -6, top: -2}, leningradskaya: {left: -6, top: -2},
pskovskaya: {left: 5, top: 0}, pskovskaya: {left: 5, top: 0},
novgorodskaya: {left: 6, top: 0}, novgorodskaya: {left: 6, top: 0},
tverskaya: {left: 4, top: 4}, tverskaya: {left: 4, top: 4},
bryanskaya: {left: 6, top: 4}, bryanskaya: {left: 6, top: 4},
moskovskaya: {left: 4, top: 2}, moskovskaya: {left: 4, top: 2},
voronezhskaya: {left:6, top: 4}, voronezhskaya: {left: 3, top: 4},
yaroslavskaya: {left: 8, top: 4}, yaroslavskaya: {left: 6, top: 2},
ryazanskaya: {left: 5, top: 2}, ryazanskaya: {left: 5, top: 2},
ivanovskaya: {left: 6, top: 2}, ivanovskaya: {left: 6, top: 2},
vladimirskaya: {left: 3, top: 6}, vladimirskaya: {left: 3, top: 6},
lipetskaya: {left: 6, top: 3}, lipetskaya: {left: 6, top: 2},
nizhegorodskaya: {left: 2, top: 0}, nizhegorodskaya: {left: -2, top: 2},
mordoviya: {left: 1, top: 3}, mordoviya: {left: 2, top: 2},
'mariy-el': {left: 5, top: 4}, 'mariy-el': {left: 7, top: 2},
chuvashiya: {left: 5, top: 2}, chuvashiya: {left: 6, top: -2},
samarskaya: {left: 4, top: 2}, samarskaya: {left: 4, top: 2},
kirovskaya: {left: 0, top: 8}, kirovskaya: {left: 0, top: 8},
arkhangelskaya: {left: -4, top: -6}, arkhangelskaya: {left: -4, top: -6},
komi: {left: -4, top: -6}, komi: {left: -4, top: -6},
krym: {left: 1, top: 0}, krym: {left: 5, top: 0},
rostovskaya: {left: 0, top: 0}, rostovskaya: {left: 2, top: 0},
kalmykia: {left: 8, top: 0}, kalmykia: {left: 12, top: 2},
dagestan: {left: 10, top: 0}, dagestan: {left: -1, top: 15},
'karachayevo-cherkesiya': {left: 3, top: 1}, 'karachayevo-cherkesiya': {left: 6, top: 0},
'kabardino-balkariya': {left: 4, top: 0}, 'kabardino-balkariya': {left: 4, top: 0},
permskiy: {left: 5, top: 0}, permskiy: {left: 5, top: 0},
sverdlovskaya: {left: 15, top: 10}, sverdlovskaya: {left: 15, top: 10},
bashkortostan: {left: -5, top: 0}, bashkortostan: {left: -5, top: 0},
orenburgskaya: {left: -5, top: -10}, orenburgskaya: {left: -8, top: -10},
chelyabinskaya: {left: 15, top: -4}, chelyabinskaya: {left: 15, top: -4},
kurganskaya: {left: 0, top: 0}, kurganskaya: {left: 1, top: 2},
'khanty-mansiyskiy': {left: -15, top: 15}, 'khanty-mansiyskiy': {left: -15, top: 15},
'yamalo-nenetskiy': {left: 15, top: 35}, 'yamalo-nenetskiy': {left: 15, top: 35},
kemerovskaya: {left: 2, top: -5}, kemerovskaya: {left: 4, top: 0},
tyva: {left: 25, top: 0}, tyva: {left: 20, top: 5},
buryatiya: {left: 45, top: -8}, buryatiya: {left: 45, top: -8},
zabaykalskaya: {left: 25, top: 15}, zabaykalskaya: {left: 25, top: 15},
amurskaya: {left: 20, top: 0}, amurskaya: {left: 20, top: 0},
primorskaya: {left: 10, top: 5}, primorskaya: {left: 10, top: 5},
sakhalinskaya: {left: 5, top: 0}, sakhalinskaya: {left: 5, top: 0},
kamchatskaya: {left: 18, top: -55}, kamchatskaya: {left: 25, top: 40},
altayskiy: {left: 5, top: 5},
novosibirskaya: {left: 10, top: 8},
tomskaya: {left: 10, top: 5},
omskaya: {left: 5, top: 5},
}, },
xxl: { xxl: {
kaliningradskaya: {left: -4, top: -3}, smolenskaya: {left: 2, top: 2},
murmanskaya: {left: 5, top: 0}, kaliningradskaya: {left: 10, top: 4},
murmanskaya: {left: 12, top: 0},
leningradskaya: {left: -6, top: 0}, leningradskaya: {left: -6, top: 0},
pskovskaya: {left: -4, top: -6}, pskovskaya: {left: 6, top: -4},
novgorodskaya: {left: 0, top: -8}, novgorodskaya: {left: 0, top: -8},
tverskaya: {left: 0, top: -4}, tverskaya: {left: 2, top: 0},
bryanskaya: {left: 0, top: -4}, bryanskaya: {left: 4, top: 2},
moskovskaya: {left: -2, top: -4}, moskovskaya: {left: 4, top: -2},
yaroslavskaya: {left: 2, top: -3}, yaroslavskaya: {left: 4, top: 0},
ryazanskaya: {left: 1, top: -7}, ryazanskaya: {left: 5, top: 0},
ivanovskaya: {left: 2, top: -5}, ivanovskaya: {left: 6, top: 0},
vladimirskaya: {left: -3, top: -2}, vladimirskaya: {left: 0, top: 2},
lipetskaya: {left: 0, top: -8}, lipetskaya: {left: 6, top: 0},
nizhegorodskaya: {left: -5, top: -9}, nizhegorodskaya: {left: -5, top: -2},
mordoviya: {left: -4, top: -6}, mordoviya: {left: -1, top: 0},
'mariy-el': {left: 2, top: -5}, 'mariy-el': {left: 4, top: 0},
chuvashiya: {left: 0, top: -6}, chuvashiya: {left: 6, top: 0},
samarskaya: {left: -2, top: -7}, samarskaya: {left: 4, top: 2},
kirovskaya: {left: -2, top: 0}, kirovskaya: {left: 0, top: 4},
arkhangelskaya: {left: -4, top: -6}, arkhangelskaya: {left: -4, top: -6},
komi: {left: -4, top: -6}, komi: {left: -4, top: -6},
krym: {left: -4, top: -8}, krym: {left: 4, top: -2},
rostovskaya: {left: -8, top: -8}, rostovskaya: {left: 0, top: 0},
kalmykia: {left: 6, top: -4}, kalmykia: {left: 14, top: 0},
dagestan: {left: 8, top: -12}, dagestan: {left: -1, top: 16},
'karachayevo-cherkesiya': {left: -3, top: -9}, 'karachayevo-cherkesiya': {left: 6, top: 0},
'kabardino-balkariya': {left: 0, top: -9}, 'kabardino-balkariya': {left: 4, top: 0},
sverdlovskaya: {left: 15, top: 0}, sverdlovskaya: {left: 15, top: 0},
bashkortostan: {left: -15, top: -5}, bashkortostan: {left: -6, top: -5},
orenburgskaya: {left: -12, top: -10}, orenburgskaya: {left: -12, top: -10},
chelyabinskaya: {left: 4, top: -4}, chelyabinskaya: {left: 15, top: -1},
kurganskaya: {left: -7, top: -4}, kurganskaya: {left: 0, top: 0},
'khanty-mansiyskiy': {left: -35, top: 8}, 'khanty-mansiyskiy': {left: -35, top: 8},
'yamalo-nenetskiy': {left: 25, top: 45}, 'yamalo-nenetskiy': {left: 25, top: 45},
kemerovskaya: {left: -2, top: -5}, kemerovskaya: {left: 2, top: -5},
tyva: {left: 15, top: -8}, tyva: {left: 15, top: 5},
buryatiya: {left: 55, top: -8}, buryatiya: {left: 55, top: -8},
zabaykalskaya: {left: 35, top: 15}, zabaykalskaya: {left: 35, top: 15},
amurskaya: {left: 20, top: -15}, amurskaya: {left: 20, top: -5},
primorskaya: {left: 7, top: 0}, primorskaya: {left: 12, top: 15},
sakhalinskaya: {left: 4, top: 0}, sakhalinskaya: {left: 4, top: 0},
kamchatskaya: {left: 25, top: -75}, kamchatskaya: {left: 30, top: 50},
altayskiy: {left: 5, top: 5},
novosibirskaya: {left: 10, top: 10},
tomskaya: {left: 10, top: 5},
omskaya: {left: 5, top: 5},
voronezhskaya: {left:4, top: 4},
}, },
}; };
......
...@@ -20,7 +20,7 @@ block content ...@@ -20,7 +20,7 @@ block content
section.def-block section.def-block
.def-block__inner.container .def-block__inner.container
.def-block__first.def-block__first--type-1 .def-block__first.def-block__first--type-1
h2.def-title Портфолио h2.def-title.def-title--type-1 Портфолио
.def-block__second .def-block__second
section.two-col-txt section.two-col-txt
...@@ -34,7 +34,7 @@ block content ...@@ -34,7 +34,7 @@ block content
section.our-team.mb-0 section.our-team.mb-0
.our-team__inner.container .our-team__inner.container
.our-team__first .our-team__first
h2.def-title.our-team__title Наша команда h2.def-title.def-title--type-1.our-team__title Наша команда
.our-team__second .our-team__second
ul.our-team__list ul.our-team__list
......
...@@ -18,15 +18,15 @@ block content ...@@ -18,15 +18,15 @@ block content
address.contacts__info address.contacts__info
ul.contacts__list ul.contacts__list
li.contacts__item li.contacts__item
h6.contacts__i-title Адрес h6.contacts__i-title Адрес:
.contacts__i-cont .contacts__i-cont
p г. Нижний Новгород, ул. Нартова, д. 6 p г. Нижний Новгород, ул. Нартова, д. 6
li.contacts__item li.contacts__item
h6.contacts__i-title Телефон h6.contacts__i-title Телефон:
.contacts__i-cont .contacts__i-cont
a(href="tel:+78312600888") +7 (831) 260-08-88 a(href="tel:+78312600888") +7 (831) 260-08-88
li.contacts__item li.contacts__item
h6.contacts__i-title Email h6.contacts__i-title E-mail:
.contacts__i-cont .contacts__i-cont
a(href="mailto:info@niizig.ru") info@niizig.ru a(href="mailto:info@niizig.ru") info@niizig.ru
......
This source diff could not be displayed because it is too large. You can view the blob instead.
extends ../pug/layout.pug
block meta
title Главная
meta(name='description', content='')
//- block append head
//- link(rel='stylesheet', href='css/some.css')
block content
section.top-banner
.top-banner__inner.container.container--type-1
+bg-sliders('type-1')
.top-banner__right
h2.top-banner__r-title о нас
p.top-banner__r-text.h1 Земля <br> и город
+btn('перейти в раздел')(href='javascript:void(0)')
\ No newline at end of file
extends ../pug/layout.pug
block meta
title Главная
meta(name='description', content='')
//- block append head
//- link(rel='stylesheet', href='css/some.css')
block content
section.top-banner
.top-banner__inner.container.container--type-1
+bg-sliders('type-2')
.top-banner__right
h2.top-banner__r-title о нас
p.top-banner__r-text.h1 Земля <br> и город
+btn('перейти в раздел')(href='javascript:void(0)')
\ No newline at end of file
This source diff could not be displayed because it is too large. You can view the blob instead.
...@@ -18,9 +18,9 @@ block content ...@@ -18,9 +18,9 @@ block content
li.project-information__item.project-information__item--address Архангельская область li.project-information__item.project-information__item--address Архангельская область
li.project-information__item.project-information__item--customer #[span Заказчик:] Администрация муниципального образования «Северодвинск» li.project-information__item.project-information__item--customer #[span Заказчик:] Администрация муниципального образования «Северодвинск»
li.project-information__item.project-information__item--area #[span.project-information__i-divider Площадь территории:] 190 га li.project-information__item.project-information__item--area #[span.project-information__i-divider Площадь территории:] 190 га
li.project-information__item.project-information__item--date #[span.project-information__i-divider Период разработки:] ноябрь 2016 — декабрь 2017 li.project-information__item.project-information__item--date #[span.project-information__i-divider Период разработки:] ноябрь 2016 — декабрь 2017
section.swiper.big-slider.fade.container.container--type-1.lr-arrow section.swiper.big-slider.lr-arrow
.swiper-wrapper .swiper-wrapper
.swiper-slide .swiper-slide
figure.big-img figure.big-img
...@@ -35,27 +35,27 @@ block content ...@@ -35,27 +35,27 @@ block content
img(src="img/bi-1.jpg", alt="Lorem ipsum dolor sit amet consectetur adipisicing elit") img(src="img/bi-1.jpg", alt="Lorem ipsum dolor sit amet consectetur adipisicing elit")
figcaption.big-img__desc figcaption.big-img__desc
p Lorem ipsum dolor sit amet consectetur adipisicing elit p Lorem ipsum dolor sit amet consectetur adipisicing elit
.swiper-slide .swiper-slide
figure.big-img figure.big-img
.big-img__photo .big-img__photo
img(src="img/bi-2.jpg", alt="Voluptatem veniam necessitatibus dignissimos nostrum eius") img(src="img/bi-2.jpg", alt="Voluptatem veniam necessitatibus dignissimos nostrum eius")
figcaption.big-img__desc figcaption.big-img__desc
p Voluptatem veniam necessitatibus dignissimos nostrum eius p Voluptatem veniam necessitatibus dignissimos nostrum eius
+btn('', 'circle').swiper-button-prev +btn('', 'circle').swiper-button-prev
<svg width="17" height="12" viewBox="0 0 17 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6 1L1 6L6 11" stroke="#309364" stroke-linecap="round" stroke-linejoin="round"/><path d="M1.5 6H17" stroke="#309364"/></svg> <svg width="17" height="12" viewBox="0 0 17 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6 1L1 6L6 11" stroke="#309364" stroke-linecap="round" stroke-linejoin="round"/><path d="M1.5 6H17" stroke="#309364"/></svg>
+btn('', 'circle').swiper-button-next +btn('', 'circle').swiper-button-next
<svg width="17" height="12" viewBox="0 0 17 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11 1L16 6L11 11" stroke="#309364" stroke-linecap="round" stroke-linejoin="round"/><path d="M15.5 6H0" stroke="#309364"/></svg> <svg width="17" height="12" viewBox="0 0 17 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11 1L16 6L11 11" stroke="#309364" stroke-linecap="round" stroke-linejoin="round"/><path d="M15.5 6H0" stroke="#309364"/></svg>
section.def-block section.def-block
.def-block__inner.container.container--type-2 .def-block__inner.container.container--type-2
.def-block__third .def-block__third
+btn('Вернуться назад', 'link-circle, lc-reverse')(href='javascript:void(0)') +btn('Вернуться назад', 'link-circle, lc-reverse')(href='javascript:void(0)')
<svg width="17" height="12" viewBox="0 0 17 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11 1L16 6L11 11" stroke="#309364" stroke-linecap="round" stroke-linejoin="round"/><path d="M15.5 6H0" stroke="#309364"/></svg> <svg width="17" height="12" viewBox="0 0 17 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11 1L16 6L11 11" stroke="#309364" stroke-linecap="round" stroke-linejoin="round"/><path d="M15.5 6H0" stroke="#309364"/></svg>
section.def-block.def-block--type-1.next-article section.def-block.def-block--type-1.next-article
.def-block__inner.container .def-block__inner.container
.def-block__first.def-block__first--type-2 .def-block__first.def-block__first--type-2
......
...@@ -32,7 +32,7 @@ block content ...@@ -32,7 +32,7 @@ block content
.def-block__inner .def-block__inner
.def-block__first.container .def-block__first.container
.def-block__f-left .def-block__f-left
h2.def-title Проекты h2.def-title.def-title--type-1 Проекты
.def-block__f-right .def-block__f-right
+btn('перейти в раздел')(href='javascript:void(0)') +btn('перейти в раздел')(href='javascript:void(0)')
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment