Skip to content

A
ads
Commit e4df6e60 authored by IrinaPronina's avatar IrinaPronina
Browse files
Options

Most pages

parent 8f5d23b3
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 1506 additions and 19 deletions
src/blocks/about-solutions/about-solutions.pug
View file @ e4df6e60
......@@ -26,5 +26,5 @@ mixin about-solutions(text, mods)
+apply()
+projects()
+partners()
+more()
+more('Запросить дополнительную информацию')
src/blocks/about/about.scss
View file @ e4df6e60
......@@ -68,13 +68,4 @@
&.decor:after {
bottom: -100px;
}
&__apply {
.apply__item{
@media (max-width: ($screen-xxl - 1)){
flex: 0 0 50%;
margin-bottom: 20px;
}
}
}
}
\ No newline at end of file
src/blocks/accordeon/accordeon.pug 0 → 100644
View file @ e4df6e60
This diff is collapsed.
src/blocks/accordeon/accordeon.scss 0 → 100644
View file @ e4df6e60
// В этом файле должны быть стили для БЭМ-блока accordeon, его элементов,
// модификаторов, псевдоселекторов, псевдоэлементов, @media-условий...
// Очередность: http://nicothin.github.io/idiomatic-pre-CSS/#priority
.accordeon {
$block-name: &; // #{$block-name}__element
padding: 120px 0;
margin-bottom: -52px;
@media (min-width: $screen-xxl) {
margin-bottom: -80px;
}
&__element{
&.open {
.accordeon__check::before {
opacity: 0;
}
.accordeon__btn:after {
background: linear-gradient(0deg, rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0.45));
}
.accordeon__content {
max-height: 2000px;
opacity: 1;
padding-top: 24px;
visibility: visible;
}
}
}
&__btn {
position: relative;
width: 100%;
height: 256px;
border-radius: 16px;
background-repeat: no-repeat;
background-color: $main-dark;
background-position: center center;
background-size: cover;
box-shadow: 0px 8px 32px rgba(0, 0, 0, 0.24);
margin-bottom: 40px;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 80px;
cursor: pointer;
&::after {
position: absolute;
content: '';
top: 0;
left: 0;
border-radius: 16px;
width: 100%;
height: 100%;
cursor: pointer;
background: linear-gradient(0deg, rgba(1, 73, 60, 0.6), rgba(1, 73, 60, 0.6)), linear-gradient(180deg, rgba(0, 221, 164, 0.5) 0%, rgba(0, 212, 192, 0.5) 100%);
transition: all $transition-time;
}
&:hover {
&:after {
background: linear-gradient(0deg, rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0.45));
}
.accordeon__check::after,
.accordeon__check::before {
background-color: $main-light;
}
}
}
&__content {
max-height: 0;
opacity: 0;
visibility: hidden;
transition: all $transition-time;
}
&__title {
width: 90%;
color: $white;
pointer-events: none;
z-index: 2;
}
&__check {
position: relative;
padding: 0;
width: 64px;
height: 64px;
border-radius: 16px;
background: $white;
z-index: 5;
pointer-events: none;
transition: all $transition-time;
&::after {
position: absolute;
content: '';
pointer-events: none;
top: 50%;
transform: translate(50%, -50%);
right: 50%;
width: 20px;
height: 2px;
background-color: $main-dark;
z-index: 3;
opacity: 1;
transition: all $transition-time;
}
&::before {
display: block;
position: absolute;
content: '';
pointer-events: none;
top: 50%;
transform: translate(50%, -50%);
right: 50%;
width: 2px;
height: 20px;
background-color: $main-dark;
z-index: 3;
opacity: 1;
transition: all $transition-time;
}
}
.task__item::before {
background-color: $white;
}
}
\ No newline at end of file
src/blocks/apply/apply.scss
View file @ e4df6e60
......@@ -26,6 +26,10 @@
&__item {
margin-bottom: 16px;
@media (max-width: ($screen-xxl - 1)){
flex: 0 0 50%;
margin-bottom: 20px;
}
@media (min-width: $screen-lg) {
padding: 0 20px;
......
src/blocks/best/best.scss
View file @ e4df6e60
......@@ -132,5 +132,9 @@
display: flex;
margin-bottom: 0;
}
img{
border-radius: 6px;
}
}
}
\ No newline at end of file
src/blocks/collapse/collapse.scss 0 → 100644
View file @ e4df6e60
// В этом файле должны быть стили для БЭМ-блока collapse, его элементов,
// модификаторов, псевдоселекторов, псевдоэлементов, @media-условий...
// Очередность: http://nicothin.github.io/idiomatic-pre-CSS/#priority
.collapse {
$block-name: &; // #{$block-name}__element
width: 100%;
display: flex;
justify-content: center;
&__btn{
color: $white;
position: relative;
&::before{
position: absolute;
content: '';
background: url(../img/arrow-down-white.svg);
background-repeat: no-repeat;
background-position: center;
background-size: contain;
border: 0;
width: 20px;
height: 24px;
top: -100%;
left: 50%;
transform: translateX(-50%);
transition: all $transition-time;
}
}
&:hover{
.collapse__btn::before{
top: -110%;
}
}
}
src/blocks/more/more.pug
View file @ e4df6e60
......@@ -21,4 +21,4 @@ mixin more(text, mods)
.more(class=allMods)&attributes(attributes)
.more__inner.container
.more__wrapper
a(href="").more__btn.btn Запросить дополнительную информацию
a(href="javascript:void(0);").more__btn.btn.more__btn=text
src/blocks/page-footer/page-footer.scss
View file @ e4df6e60
......@@ -197,6 +197,7 @@
&__link {
text-decoration: none;
color: $white;
transition: color $transition-time;
}
}
......
src/blocks/page-header/page-header.pug
View file @ e4df6e60
......@@ -80,12 +80,17 @@ mixin page-header(mods)
a(href="tel:+7(495)2802595").page-header__phone +7 (495) 280-25-95
a(href="javascript:void(0)").page-header__connect-btn.btn Обратный звонок
.page-header__magnify
button.page-header__search.btn-reset
button.page-header__search.search-btn.btn-reset
svg.page-header__search-btn(width='23' height='22' viewBox='0 0 23 22' fill='none' xmlns='http://www.w3.org/2000/svg')
path(d='M9.11 17.22C13.589 17.22 17.22 13.589 17.22 9.11C17.22 4.63097 13.589 1 9.11 1C4.63097 1 1 4.63097 1 9.11C1 13.589 4.63097 17.22 9.11 17.22Z' stroke='#00E68A' stroke-width='2' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round' fill='none')
path(d='M15.52 14.28L21.6 20.36' stroke='#00E68A' stroke-width='2' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round' fill='none')
svg.page-header__search-close(width='20' height='19' viewBox='0 0 20 19' fill='none' xmlns='http://www.w3.org/2000/svg')
path(d='M17.5664 0.556641L19.2431 2.23334L2.47614 19.0003L0.799449 17.3236L17.5664 0.556641Z' fill='#00E68A')
path(d='M2.21094 0.556641L0.534242 2.23334L17.3012 19.0003L18.9779 17.3236L2.21094 0.556641Z' fill='#00E68A')
.search-block
.search-block__inner.container
.search-block__content
label.search-block__label Введите запрос
input.search-block__input(type="search" name="" placeholder="Поиск по сайту")
svg.search-block__btn(width='20' height='18' viewBox='0 0 20 18' fill='none' xmlns='http://www.w3.org/2000/svg')
path(d='M8.6777 14.405C12.3794 14.405 15.3802 11.4042 15.3802 7.70248C15.3802 4.0008 12.3794 1 8.6777 1C4.97602 1 1.97522 4.0008 1.97522 7.70248C1.97522 11.4042 4.97602 14.405 8.6777 14.405Z' stroke='white' stroke-width='2' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round' fill='none')
path(d='M13.9754 11.9753L19.0002 17.0001' stroke='white' stroke-width='2' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round')
.page-header__lang
a(href="javascript:void(0)").page-header__lang-btn ENG
\ No newline at end of file
src/blocks/page-header/page-header.scss
View file @ e4df6e60
......@@ -26,6 +26,7 @@
@media (min-width: $screen-lg) {
padding: 24px 0 12px;
}
@media (min-width: $screen-sm) {
padding: 16px 0 16px;
}
......@@ -121,13 +122,152 @@
&__magnify {
display: flex;
position: relative;
}
&__search {
width: 22px;
height: 22px;
padding: 0;
transition: all $transition-time;
&.active {
z-index: 2000;
.page-header__search-btn path {
stroke: $white;
}
}
}
.search-block {
position: fixed;
width: 100%;
height: 100%;
background: rgba(1, 73, 69, .48);
top: 0;
left: 0;
z-index: 1000;
opacity: 0;
visibility: hidden;
overflow-y: auto;
transition: all $transition-time;
&.active {
opacity: 1;
visibility: visible;
transform: translateY(0);
pointer-events: all;
}
&__inner {
padding-top: 52px;
padding-right: 16px;
display: flex;
justify-content: flex-end;
@media (min-width: $screen-xxl) {
padding-top: 80px;
padding-right: 86px;
}
@media (min-width: $screen-xl) {
padding-top: 52px;
padding-right: 36px;
}
@media (min-width: $screen-lg) {
padding-right: 214px;
}
@media (min-width: $screen-md) {
}
}
&__content {
display: flex;
flex-direction: column;
position: relative;
border-radius: 8px;
filter: drop-shadow(0px 8px 32px rgba(0, 0, 0, 0.24));
background-color: $main-light;
width: 100%;
height: auto;
padding: 24px;
z-index: 8;
transform: translateY(10%);
transition: all $transition-time;
@media (min-width: $screen-lg) {
width: 447px;
}
&::before {
position: absolute;
content: '';
background-color: $main-light;
top: -8px;
right: 42px;
width: 16px;
height: 16px;
z-index: -1;
opacity: 0;
transform: rotate(45deg);
@media (min-width: $screen-lg) {
opacity: 1;
}
}
}
&__label {
font: 16px/1.3 $ff-i-sb;
font-weight: 600;
color: $black;
width: 100%;
margin-bottom: 16px;
}
&__input {
position: relative;
width: 100%;
background: #0BB578;
border-radius: 4px;
border: none;
padding: 16px;
padding-right: 36px;
font: 14px/1.3 $ff-i-r;
letter-spacing: 0.05em;
color: $white;
&:focus {
outline: 1px solid $white;
.search-block__btn path {
stroke: $main-light;
}
}
&::placeholder {
font: 14px/1.3 $ff-i-r;
letter-spacing: 0.05em;
color: $white;
opacity: 0.5;
}
}
&__btn {
position: absolute;
width: 17px;
height: 16px;
right: 40px;
bottom: 40px;
& path {
stroke: $white;
transition: all $transition-time;
}
}
}
&__search-close {
......
src/blocks/page/page.scss
View file @ e4df6e60
......@@ -428,4 +428,117 @@ pre {
@media (min-width: $screen-lg) {
margin-bottom: 56px;
}
}
a:hover {
color: $main-light;
}
//choices
.choices__inner {
background-color: $white;
border: 1px solid #e3e3e3;
border-radius: 4px;
}
.choices__item {
font: 12px/1.3 $ff-i-r;
letter-spacing: 0.05em;
color: $black;
@media (min-width: $screen-xxl) {
font-size: 14px;
}
@media (min-width: $screen-lg) {
font-size: 12px;
}
}
.is-focused .choices__inner,
.is-open .choices__inner {
border-color: $color-accent;
}
.is-open .choices__inner {
border-radius: 4px;
}
.is-flipped.is-open .choices__inner {
border-radius: 4px;
}
.choices[data-type*=select-one]:after {
background: url("../img/arrow-down.svg");
background-repeat: no-repeat;
background-position: right;
background-size: contain;
border: none;
width: 18px;
height: 16px;
top: 40%;
}
.choices[data-type*=select-one].is-open:after {
background: url("../img/arrow-down-green.svg");
background-repeat: no-repeat;
background-position: right;
background-size: contain;
border: none;
width: 18px;
height: 16px;
top: 40%;
margin-top: 0;
}
.choices__placeholder {
color: $main-dark;
opacity: 1;
}
.choices__list--dropdown .choices__item {
&:not(:last-child) {
border-bottom: 1px solid #e3e3e3;
}
}
.choices__list--dropdown .choices__item.is-highlighted {
background-color: $main-light;
}
.choices__list--dropdown {
border-bottom-left-radius: 0px;
border-bottom-right-radius: 0px;
}
.is-open .choices__list--dropdown {
border: none;
filter: drop-shadow(0px 4px 15px rgba(0, 0, 0, 0.1));
}
.choices__list--dropdown .choices__placeholder {
display: none;
}
.is-flipped .choices__list--dropdown {
border-radius: 0;
}
//choices ends
.mt-80{
margin-top: 48px;
@media (min-width: $screen-lg) {
margin-top: 80px;
}
}
.mb-64{
margin-top: 48px;
@media (min-width: $screen-lg) {
margin-top: 64px;
}
}
\ No newline at end of file
src/blocks/project-grid/project-grid.pug 0 → 100644
View file @ e4df6e60
//- Все примеси в этом файле должны начинаться c имени блока (project-grid)
mixin project-grid(text, mods)
//- Принимает:
//- text {string} - текст
//- mods {string} - список модификаторов
//- Вызов:
+project-grid('Текст', 'some-mod')
-
// список модификаторов
var allMods = '';
if(typeof(mods) !== 'undefined' && mods) {
var modsList = mods.split(',');
for (var i = 0; i < modsList.length; i++) {
allMods = allMods + ' project-grid--' + modsList[i].trim();
}
}
section.project-grid(class=allMods)&attributes(attributes)
.project-grid__inner.container
ul.project-grid__list
li.project-grid__item
.project-grid__body
.project-grid__pic
img(src="img/partner-6.png" alt="Логотип").project-grid__img
.project-grid__content
.project-grid__title
p.project-grid__text Роботизированная загрузка прайс-листа АО «НМЖК»
.project-grid__subtitle
span.project-grid__num 1 проект
li.project-grid__item
.project-grid__body
.project-grid__pic
img(src="img/partner-7.png" alt="Логотип").project-grid__img
.project-grid__content
.project-grid__title
p.project-grid__text Автоматизация процесса управления сетью терминальных устройств самообслуживания и POS-терминалов
.project-grid__subtitle
span.project-grid__num 3 проекта
li.project-grid__item
.project-grid__body
.project-grid__pic
img(src="img/partner-2.png" alt="Логотип").project-grid__img
.project-grid__content
.project-grid__title
p.project-grid__text Автоматизированная система управления ремонтами и техническим обслуживанием оборудования
.project-grid__subtitle
span.project-grid__num 1 проект
li.project-grid__item
.project-grid__body
.project-grid__pic
img(src="img/partner-1.png" alt="Логотип").project-grid__img
.project-grid__content
.project-grid__title
p.project-grid__text Автоматизированная система управления ремонтами и техническим обслуживанием оборудования
.project-grid__subtitle
span.project-grid__num 1 проект
li.project-grid__item
.project-grid__body
.project-grid__pic
img(src="img/partner-4.png" alt="Логотип").project-grid__img
.project-grid__content
.project-grid__title
p.project-grid__text Автоматизированная система управления ремонтами и техническим обслуживанием оборудования
.project-grid__subtitle
span.project-grid__num 1 проект
li.project-grid__item
.project-grid__body
.project-grid__pic
img(src="img/partner-3.png" alt="Логотип").project-grid__img
.project-grid__content
.project-grid__title
p.project-grid__text Автоматизированная система управления ремонтами и техническим обслуживанием оборудования
.project-grid__subtitle
span.project-grid__num 1 проект
li.project-grid__item
.project-grid__body
.project-grid__pic
img(src="img/partner-8.png" alt="Логотип").project-grid__img
.project-grid__content
.project-grid__title
p.project-grid__text Портал Морской порт
.project-grid__subtitle
span.project-grid__num 1 проект
li.project-grid__item
.project-grid__body
.project-grid__pic
img(src="img/partner-9.png" alt="Логотип").project-grid__img
.project-grid__content
.project-grid__title
p.project-grid__text Автоматизированная система управления ремонтами и техническим обслуживанием оборудования
.project-grid__subtitle
span.project-grid__num 1 проект
li.project-grid__item
.project-grid__body
.project-grid__pic
img(src="img/partner-5.png" alt="Логотип").project-grid__img
.project-grid__content
.project-grid__title
p.project-grid__text Автоматизированная система управления ремонтами и техническим обслуживанием оборудования
.project-grid__subtitle
span.project-grid__num 3 проекта
src/blocks/project-grid/project-grid.scss 0 → 100644
View file @ e4df6e60
// В этом файле должны быть стили для БЭМ-блока project-grid, его элементов,
// модификаторов, псевдоселекторов, псевдоэлементов, @media-условий...
// Очередность: http://nicothin.github.io/idiomatic-pre-CSS/#priority
.project-grid {
$block-name: &; // #{$block-name}__element
&__list {
padding: 0;
list-style: none;
@media (min-width: $screen-lg) {
display: flex;
flex-wrap: wrap;
margin: 0 -20px;
}
}
&__item {
margin-bottom: 16px;
@media (min-width: $screen-xl) {
flex: 0 0 33.333%;
}
@media (min-width: $screen-lg) {
flex: 0 0 50%;
padding: 0 20px;
margin-bottom: 40px;
}
&:hover {
.project-grid__body {
box-shadow: 0px 8px 32px rgba(0, 0, 0, 0.24);
}
.project-grid__img {
filter: grayscale(0%);
opacity: 1;
}
}
}
&__body {
box-shadow: 0px 8px 32px rgba(0, 0, 0, 0.05);
border-radius: 16px;
padding: 16px;
display: flex;
justify-content: space-between;
flex-direction: column;
cursor: pointer;
height: 100%;
transition: all $transition-time;
@media (min-width: $screen-lg) {
padding: 48px;
flex: 0 0 25%;
flex-direction: column;
justify-content: start;
}
}
&__pic {
width: 170px;
height: 120px;
margin-bottom: 40px;
@media (min-width: $screen-lg) {
width: 170px;
height: 120px;
}
}
&__img {
height: 100%;
object-fit: contain;
filter: grayscale(99%);
opacity: .5;
transition: all $transition-time;
}
&__content {
width: calc(100% - 64px);
display: flex;
flex-direction: column;
@media (min-width: $screen-lg) {
flex: 1 0 auto;
width: 100%;
}
}
&__title {
display: flex;
margin-bottom: 8px;
font: 14px/1.5 $ff-i-sb;
@media (min-width: $screen-xl) {
font-size: 18px;
}
@media (min-width: $screen-lg) {
flex: 1 0 auto;
}
}
&__subtitle {
display: flex;
font: 16px/1.5 $ff-i-r;
color: #93969E;
@media (min-width: $screen-lg) {
flex: 1 0 auto;
align-items: flex-end;
}
}
}
\ No newline at end of file
src/blocks/project-search/project-search.scss 0 → 100644
View file @ e4df6e60
// В этом файле должны быть стили для БЭМ-блока project-search, его элементов,
// модификаторов, псевдоселекторов, псевдоэлементов, @media-условий...
// Очередность: http://nicothin.github.io/idiomatic-pre-CSS/#priority
.project-search {
$block-name: &; // #{$block-name}__element
padding-top: 48px;
margin-bottom: 40px;
@media (min-width: $screen-lg) {
margin-bottom: 64px; padding-top: 80px;
}
&__top {
@media (min-width: $screen-lg) {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
}
&__selects {
margin-bottom: 16px;
@media (min-width: $screen-lg) {
flex: 0 0 31.5%;
margin-bottom: 0;
}
}
&__submit {
@media (min-width: $screen-xl) {
flex: 0 0 31.5%;
}
@media (min-width: $screen-lg) {
display: flex;
justify-content: space-between;
flex: 0 0 35%;
}
}
&__other {
margin-bottom: 16px;
@media (min-width: $screen-lg) {
flex: 0 0 68%;
margin-bottom: 0;
}
}
&__search {
@media (min-width: $screen-lg) {
width: 120px;
}
}
&__btn {
width: 100%;
}
}
\ No newline at end of file
src/blocks/project-tasks/project-tasks.pug 0 → 100644
View file @ e4df6e60
//- Все примеси в этом файле должны начинаться c имени блока (project-tasks)
mixin project-tasks(text, mods)
//- Принимает:
//- text {string} - текст
//- mods {string} - список модификаторов
//- Вызов:
+project-tasks('Текст', 'some-mod')
-
// список модификаторов
var allMods = '';
if(typeof(mods) !== 'undefined' && mods) {
var modsList = mods.split(',');
for (var i = 0; i < modsList.length; i++) {
allMods = allMods + ' project-tasks--' + modsList[i].trim();
}
}
.project-tasks(class=allMods)&attributes(attributes)
.project-tasks__inner.container
ul.project-tasks__list
li.project-tasks__item
a(href="javascript:void(0);").project-tasks__body
.project-tasks__title
p.project-tasks__text.h5 Автоматизированная система управления ремонтами и техническим обслуживанием оборудования
li.project-tasks__item
a(href="javascript:void(0);").project-tasks__body
.project-tasks__title
p.project-tasks__text.h5 Система управления ремонтами и техническим обслуживанием оборудования
li.project-tasks__item
a(href="javascript:void(0);").project-tasks__body
.project-tasks__title
p.project-tasks__text.h5 Управление ремонтом и техническим обслуживанием оборудования
src/blocks/project-tasks/project-tasks.scss 0 → 100644
View file @ e4df6e60
// В этом файле должны быть стили для БЭМ-блока project-tasks, его элементов,
// модификаторов, псевдоселекторов, псевдоэлементов, @media-условий...
// Очередность: http://nicothin.github.io/idiomatic-pre-CSS/#priority
.project-tasks {
$block-name: &; // #{$block-name}__element
margin: 48px 0;
@media (min-width: $screen-lg){
margin: 80px 0 64px;
}
&__list {
padding: 0;
list-style: none;
@media (min-width: $screen-lg) {
display: flex;
flex-wrap: wrap;
margin: 0 -20px;
}
}
&__item {
margin-bottom: 16px;
@media (min-width: $screen-xl) {
flex: 0 0 33.333%;
}
@media (min-width: $screen-lg) {
flex: 0 0 50%;
padding: 0 20px;
margin-bottom: 40px;
}
&:hover {
.project-tasks__body {
background: linear-gradient(0deg, rgba(64, 119, 115, 0.85), rgba(64, 119, 115, 0.85)), url("../img/fill-img.jpg");
background-repeat: no-repeat;
background-color: $main-dark;
background-position: right center;
background-size: cover;
}
.project-tasks__title {
color: $white;
}
}
}
&__body {
text-decoration: none;
box-shadow: 0px 8px 32px rgba(0, 0, 0, 0.05);
border-radius: 16px;
padding: 16px;
display: flex;
justify-content: space-between;
flex-direction: column;
cursor: pointer;
height: 100%;
background-repeat: no-repeat;
background-color: $white;
background-position: right center;
background-size: cover;
transition: all $transition-time;
@media (min-width: $screen-xxl) {
padding: 48px;
}
@media (min-width: $screen-lg) {
padding: 36px;
flex: 0 0 25%;
flex-direction: column;
justify-content: start;
}
}
&__title {
color: $black;
font: 14px/1.5 $ff-i-sb;
transition: color $transition-time;
@media (min-width: $screen-xl) {
font-size: 18px;
}
@media (min-width: $screen-lg) {
flex: 1 0 auto;
}
}
}
\ No newline at end of file
src/blocks/return/return.pug 0 → 100644
View file @ e4df6e60
//- Все примеси в этом файле должны начинаться c имени блока (return)
mixin return(text, mods)
//- Принимает:
//- text {string} - текст
//- mods {string} - список модификаторов
//- Вызов:
+return('Текст', 'some-mod')
-
// список модификаторов
var allMods = '';
if(typeof(mods) !== 'undefined' && mods) {
var modsList = mods.split(',');
for (var i = 0; i < modsList.length; i++) {
allMods = allMods + ' return--' + modsList[i].trim();
}
}
.return(class=allMods)&attributes(attributes)
.return__inner.container
a(href="javascript:void(0);").return__link=text
src/blocks/return/return.scss 0 → 100644
View file @ e4df6e60
// В этом файле должны быть стили для БЭМ-блока return, его элементов,
// модификаторов, псевдоселекторов, псевдоэлементов, @media-условий...
// Очередность: http://nicothin.github.io/idiomatic-pre-CSS/#priority
.return {
$block-name: &; // #{$block-name}__element
margin-bottom: 48px;
@media (min-width: $screen-lg) {
margin-bottom: 80px;
}
&__link{
text-decoration: none;
border: none;
cursor: pointer;
font: 12px/1.2 $ff-i-b;
letter-spacing: 0.05em;
text-transform: uppercase;
color: $main-dark;
transition: all $transition-time;
@media (min-width: $screen-xxl) {
font-size: 16px;
}
@media (min-width: $screen-md) {
font-size: 12px;
}
&:hover{
color: $main-light;
}
}
}
\ No newline at end of file
src/blocks/text-block/text-block.pug
View file @ e4df6e60
......@@ -25,5 +25,5 @@ mixin text-block(text, mods)
p.text-block__text.text-bold Коммерческий учет
p.text-block__text.text-bold Диспетчеризация и технический учет
p.text-block__text.text-bold Управление жизненным циклов средств измерения и приборов учета
p.text-block__text.text Наши Заказчики&nbsp;&mdash; основные предприятия реального сектора экономики: энергетики, нефтегазодобычи, промышленного производства. Наши продукты помогают им&nbsp;контролировать критическую инфраструктуру, обеспечивают аналитику для принятия управленческих решений, оптимизируют сложные технологические процессы.
p.text-block__text.text Наши Заказчики – основные предприятия реального сектора экономики: энергетики, нефтегазодобычи, промышленного производства. Наши продукты помогают им контролировать критическую инфраструктуру, обеспечивают аналитику для принятия управленческих решений, оптимизируют сложные технологические процессы.
block
src/img/arrow-down-green.svg 0 → 100644
View file @ e4df6e60
<svg width="20" height="23" viewBox="0 0 20 23" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M16.939 11.1772C17.5247 10.5913 18.4744 10.591 19.0604 11.1766C19.6463 11.7622 19.6466 12.712 19.061 13.2979L16.939 11.1772ZM10.242 20L11.3029 21.0604L10.242 22.1219L9.18099 21.0604L10.242 20ZM1.42294 13.2979C0.837322 12.712 0.837591 11.7622 1.42354 11.1766C2.0095 10.591 2.95924 10.5913 3.54486 11.1772L1.42294 13.2979ZM19.061 13.2979L11.3029 21.0604L9.18099 18.9396L16.939 11.1772L19.061 13.2979ZM9.18099 21.0604L1.42294 13.2979L3.54486 11.1772L11.3029 18.9396L9.18099 21.0604Z" fill="#00E68A"/>
<path d="M11.741 19.811C11.741 20.6395 11.0695 21.311 10.241 21.311C9.4126 21.311 8.74103 20.6395 8.74103 19.811L11.741 19.811ZM8.74103 2C8.74103 1.17157 9.4126 0.499996 10.241 0.499996C11.0695 0.499996 11.741 1.17157 11.741 2L8.74103 2ZM8.74103 19.811L8.74103 2L11.741 2L11.741 19.811L8.74103 19.811Z" fill="#00E68A"/>
</svg>
src/img/arrow-down-white.svg 0 → 100644
View file @ e4df6e60
<svg width="24" height="29" viewBox="0 0 24 29" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M2.71721 14.4104C2.13159 14.9964 1.18184 14.9967 0.59589 14.411C0.00993776 13.8254 0.00966918 12.8757 0.59529 12.2897L2.71721 14.4104ZM12.0005 3L10.9395 1.93964L12.0005 0.87808L13.0614 1.93964L12.0005 3ZM23.4057 12.2897C23.9913 12.8757 23.991 13.8254 23.4051 14.411C22.8191 14.9967 21.8694 14.9964 21.2837 14.4104L23.4057 12.2897ZM0.59529 12.2897L10.9395 1.93964L13.0614 4.06036L2.71721 14.4104L0.59529 12.2897ZM13.0614 1.93964L23.4057 12.2897L21.2837 14.4104L10.9395 4.06036L13.0614 1.93964Z" fill="white"/>
<path d="M10.5 3.25195C10.5 2.42353 11.1716 1.75195 12 1.75195C12.8284 1.75195 13.5 2.42353 13.5 3.25195H10.5ZM13.5 27.0004C13.5 27.8288 12.8284 28.5004 12 28.5004C11.1716 28.5004 10.5 27.8288 10.5 27.0004H13.5ZM13.5 3.25195L13.5 27.0004H10.5L10.5 3.25195H13.5Z" fill="white"/>
</svg>
src/img/arrow-down.svg 0 → 100644
View file @ e4df6e60
<svg width="20" height="23" viewBox="0 0 20 23" fill="none" xmlns="http://www.w3.org/2000/svg">
<g opacity="0.2">
<path d="M16.939 11.1772C17.5247 10.5913 18.4744 10.591 19.0604 11.1766C19.6463 11.7622 19.6466 12.712 19.061 13.2979L16.939 11.1772ZM10.242 20L11.3029 21.0604L10.242 22.1219L9.18099 21.0604L10.242 20ZM1.42294 13.2979C0.837322 12.712 0.837591 11.7622 1.42354 11.1766C2.0095 10.591 2.95924 10.5913 3.54486 11.1772L1.42294 13.2979ZM19.061 13.2979L11.3029 21.0604L9.18099 18.9396L16.939 11.1772L19.061 13.2979ZM9.18099 21.0604L1.42294 13.2979L3.54486 11.1772L11.3029 18.9396L9.18099 21.0604Z" fill="black"/>
<path d="M11.741 19.811C11.741 20.6395 11.0695 21.311 10.241 21.311C9.4126 21.311 8.74103 20.6395 8.74103 19.811L11.741 19.811ZM8.74103 2C8.74103 1.17157 9.4126 0.499996 10.241 0.499996C11.0695 0.499996 11.741 1.17157 11.741 2L8.74103 2ZM8.74103 19.811L8.74103 2L11.741 2L11.741 19.811L8.74103 19.811Z" fill="black"/>
</g>
</svg>
src/img/collect-data.png 0 → 100644
View file @ e4df6e60
This diff is collapsed.
src/img/fill-img.jpg 0 → 100644
View file @ e4df6e60
This diff is collapsed.
src/img/logo-sq-white.svg 0 → 100644
View file @ e4df6e60
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="64" height="64" rx="8" fill="white"/>
<path d="M25.328 26.3964C22.7831 31.0366 17.7842 40.1446 17.7842 40.1446C17.7842 40.1446 29.3607 40.1494 29.3511 40.1446C30.26 40.1637 30.7336 40.3312 31.2167 41.2305C31.2167 41.2353 32.9627 44.4164 32.9627 44.4164C32.9627 44.4164 14.5409 44.4164 14.5361 44.4164C12.307 44.4068 11.3789 42.7804 12.4361 40.8861C14.6701 36.8965 23.3763 20.9957 23.3763 20.9861C23.8212 20.1681 24.51 19.6371 25.4189 19.6467C26.3278 19.6611 27.0215 20.2064 27.4663 21.01C27.4663 21.0196 37.5646 39.3936 37.5598 39.3888C37.8947 40.0011 38.3443 40.1207 38.9853 40.1255C43.769 40.1877 47.5385 36.6238 47.5624 31.9789C47.5863 27.5971 43.8694 23.9568 39.3106 23.9137C39.3154 23.9137 32.2643 23.9089 32.2643 23.9137C31.6664 23.8659 31.3363 23.6171 31.1067 23.2057C31.1162 23.2057 29.1597 19.618 29.1597 19.618C29.1597 19.618 36.3543 19.5415 39.2054 19.618C44.5583 19.7567 48.5383 22.139 50.8344 26.937C54.1686 33.9067 50.0403 42.2972 42.3865 44.0098C40.5639 44.4212 36.7322 44.4164 36.7275 44.4164C35.7755 44.4451 35.0915 43.9428 34.6131 43.0626C31.8051 37.8963 25.6725 26.8987 25.328 26.3964Z" fill="url(#paint0_linear_192_10984)"/>
<defs>
<linearGradient id="paint0_linear_192_10984" x1="48" y1="20.001" x2="10" y2="46.001" gradientUnits="userSpaceOnUse">
<stop stop-color="#00BFFF"/>
<stop offset="1" stop-color="#00E68A"/>
</linearGradient>
</defs>
</svg>
src/js/script.js
View file @ e4df6e60
......@@ -148,6 +148,68 @@ window.addEventListener("load", () => {
})
}
/*-- Choices --*/
const selectEls = document.querySelectorAll('.js-choice');
selectEls.forEach(selectEl => {
const choices = new Choices(selectEl, {
searchEnabled: false,
itemSelectText: '',
placeholder: true,
})
})
/*-- Gradient Accordeon --*/
const gradientAccordeon = document.querySelector('.accordeon');
if (gradientAccordeon) {
function GradientAccordeon() {
const accordeonContents = document.querySelectorAll('.accordeon__content');
const accordeonBtns = document.querySelectorAll('.accordeon__btn');
accordeonBtns.forEach((btn, index) => {
btn.addEventListener('click', () => {
accordeonBtns.forEach((btnItem, idx) => {
if (btnItem === btn) {
const accordeonelement = btn.closest('.accordeon__element');
const collapseBtn = accordeonelement.querySelector('.collapse__btn');
accordeonelement.classList.toggle('open');
collapseBtn.addEventListener('click', () => {
accordeonelement.classList.remove('open');
})
}
})
})
})
}
GradientAccordeon();
window.addEventListener('resize', GradientAccordeon);
}
/*-- Search --*/
const searchBtn = document.querySelector('.search-btn');
if (searchBtn) {
searchBtn.addEventListener('click', () => {
const searchBlock = document.querySelector('.search-block');
searchBlock.classList.toggle('active');
searchBtn.classList.toggle('active');
})
const searchInput = document.querySelector('.search-block input')
searchInput.addEventListener('focus', function() {
const searchIcon = document.querySelector('.search-block__btn');
const searchPaths = document.querySelectorAll('.search-block__btn path');
searchPaths.forEach(searchPath => {
searchPath.style.stroke = '#00E68A';
})
})
}
});
src/pages/all-pages.pug
View file @ e4df6e60
......@@ -17,10 +17,15 @@ block content
p #[a.h5(href="index.html", target="_blank").link Главная]
p #[a.h5(href="about.html", target="_blank").link Кто мы]
p #[a.h5(href="solutions.html", target="_blank").link Решения]
p #[a.h5(href="monitoring.html", target="_blank").link Мониторинг технологических процессов и производств]
p #[a.h5(href="solutions-det1.html", target="_blank").link Решения детальная - Энергоучёт и энергоэффективность]
p #[a.h5(href="monitoring.html", target="_blank").link Решения детальная - Мониторинг технологических процессов и производств]
p #[a.h5(href="planning.html", target="_blank").link Планирование и оптимизация производственных процессов]
p #[a.h5(href="industries.html", target="_blank").link Отрасли]
p #[a.h5(href="projects.html", target="_blank").link Проекты]
//- p #[a.h5(href="project-det.html", target="_blank").link Проект детальная - Бинбанк]
//- p #[a.h5(href="project-descr.html", target="_blank").link Проект детальная - Автоматизированная система управления ремонтами и техническим обслуживанием оборудования]
p #[a.h5(href="contacts.html", target="_blank").link Контакты]
p #[a.h5(href="search-result.html", target="_blank").link Поиск по сайту]
p #[a.h5(href="404.html", target="_blank").link 404]
//- block footer
......
src/pages/project-descr.pug 0 → 100644
View file @ e4df6e60
This diff is collapsed.
src/pages/project-det.pug 0 → 100644
View file @ e4df6e60
extends ../pug/layout.pug
block meta
title Проекты
meta(name='description' content='')
//- block append head
//- link(rel='stylesheet' href='css/some.css')
block content
+inner-wrapper()
+inner-wrapper-top(style="background-image: url(img/bgrd_projects.jpg);")
+breadcrumbs()
+breadcrumbs-item('Главная', '/')
+breadcrumbs-item('Проекты', '/')
+breadcrumbs-item('Бинбанк')
+main-title('Бинбанк')
+main-descr('Разработка комплексных программных продуктов на заказ, реализация решений в области цифровизации производства и снижения импортозависимости.')
+project-tasks()
+return('назад к проектам')
//- block footer
//- p footer
//- block append page-bottom
//- script(src='js/some.js')
src/pages/projects.pug 0 → 100644
View file @ e4df6e60
extends ../pug/layout.pug
block meta
title Проекты
meta(name='description' content='')
//- block append head
//- link(rel='stylesheet' href='css/some.css')
block content
+inner-wrapper()
+inner-wrapper-top(style="background-image: url(img/bgrd_projects.jpg);")
+breadcrumbs()
+breadcrumbs-item('Главная', '/')
+breadcrumbs-item('Проекты')
+main-title('Проекты')
+main-descr('Разработка комплексных программных продуктов на заказ, реализация решений в области цифровизации производства и снижения импортозависимости.')
section.project-search
.project-search__inner.container
.project-search__top
.project-search__selects
select(data-trigger name="search-ind").js-choice
option(value="" selected) Отрасль
option(value="Отрасль1") Отрасль1
option(value="Отрасль2") Отрасль2
option(value="Отрасль3") Отрасль3
.project-search__selects
select(data-trigger name="search-alph").js-choice
option(value="" selected) Поиск по алфавиту
option(value="Значение1") Значение1
option(value="Значение2") Значение2
option(value="Значение3") Значение3
.project-search__submit
.project-search__other
select(data-trigger name="search-projects").js-choice
option(value="" selected) Поиск по проектам
option(value="Значение1") Значение1
option(value="Значение2") Значение2
option(value="Значение3") Значение3
.project-search__search
button.project-search__btn.btn поиск
+project-grid()
+more('показать больше')
//- block footer
//- p footer
//- block append page-bottom
//- script(src='js/some.js')
src/pages/search-result.pug 0 → 100644
View file @ e4df6e60
extends ../pug/layout.pug
block meta
title Энергоучёт и энергоэффективность
meta(name='description', content='')
//- block append head
//- link(rel='stylesheet', href='css/some.css')
block content
+inner-wrapper()
+inner-wrapper-top(style="background-image: url(img/bgrd_solutions.jpg);")
+breadcrumbs()
+breadcrumbs-item('Главная', '/')
+breadcrumbs-item('Решения', '/')
+breadcrumbs-item('Энергоучёт и энергоэффективность')
+main-title('Энергоучёт и энергоэффективность')
+main-descr('Разработка комплексных программных продуктов на заказ, реализация решений в области цифровизации производства и снижения импортозависимости.')
+about-solutions()
+accordeon()
//- block footer
//- p footer
//- block append page-bottom
//- script(src='js/some.js')
src/pages/solutions-det1.pug 0 → 100644
View file @ e4df6e60
extends ../pug/layout.pug
block meta
title Энергоучёт и энергоэффективность
meta(name='description', content='')
//- block append head
//- link(rel='stylesheet', href='css/some.css')
block content
+inner-wrapper()
+inner-wrapper-top(style="background-image: url(img/bgrd_solutions.jpg);")
+breadcrumbs()
+breadcrumbs-item('Главная', '/')
+breadcrumbs-item('Решения', '/')
+breadcrumbs-item('Энергоучёт и энергоэффективность')
+main-title('Энергоучёт и энергоэффективность')
+main-descr('Разработка комплексных программных продуктов на заказ, реализация решений в области цифровизации производства и снижения импортозависимости.')
+about-solutions()
+accordeon()
//- block footer
//- p footer
//- block append page-bottom
//- script(src='js/some.js')
src/scss/global.scss
View file @ e4df6e60
......@@ -186,6 +186,7 @@
border: none;
background: inherit;
cursor: pointer;
padding: 0;
}
.btn {
......@@ -356,4 +357,5 @@
.pt-16 {
padding-top: 16px;
}
\ No newline at end of file
}
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