TPS
/
tps-site
4
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

new services link added

This commit is contained in:
Meylis Gazakow 2022-06-02 12:54:23 +03:00
parent ced257b048
commit c4fd63d19c
13 changed files with 424 additions and 218 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
about.html
View File

@ -102,9 +102,18 @@
</li>
<li>
<a href="service.html">
<span class="service_nav-link">
Услуги
</a>
</span>
<div class="service_nav">
<a href="outdoor-service.html">Наружная реклама</a>
<a href="indoor-service.html">Реклама в помещениях</a>
<a href="exhebition-service.html">Выставочные стенды</a>
<a href="events-service.html">Организация мероприятий</a>
<a href="media-service.html">Реклама в СМИ</a>
<a href="production-service.html">Производство</a>
</div>
</li>
<li>

50
assets/css/components/2-layout/header.scss
View File

@ -82,17 +82,64 @@
li {
margin-right: 60px;
position: relative;
&:last-child {
margin-right: 0;
}
a {
a,
span {
display: block;
font-weight: 500;
font-size: 16px;
line-height: 20px;
color: #FFFFFF;
cursor: pointer;
// &:hover~.service_nav {
// display: block;
// max-height: unset;
// }
}
}
}
.service_nav {
display: none;
@include transition;
max-height: 0;
overflow: hidden;
background: #fff;
padding: 15px;
position: absolute;
top: calc(100% + 20px);
left: 50%;
@include transformX;
white-space: nowrap;
z-index: 3;
&.active {
display: block;
max-height: unset;
}
a {
display: block;
font-weight: 500;
font-size: 16px;
line-height: 20px;
color: #000;
margin-bottom: 10px;
@include transition;
&:hover {
opacity: .8;
}
&:last-child {
margin-bottom: 0;
}
}
}
@ -275,6 +322,7 @@
animation: group-txt 1s linear;
-webkit-animation: group-txt 1s linear;
}
// =============================================================
svg .svg-elem-1 {

46
assets/css/main.css
View File

@ -228,16 +228,60 @@ li {
}
.header .nav ul li {
margin-right: 60px;
position: relative;
}
.header .nav ul li:last-child {
margin-right: 0;
}
.header .nav ul li a {
.header .nav ul li a,
.header .nav ul li span {
display: block;
font-weight: 500;
font-size: 16px;
line-height: 20px;
color: #FFFFFF;
cursor: pointer;
}
.header .nav .service_nav {
display: none;
-webkit-transition: all 0.2s ease-in-out 0s;
transition: all 0.2s ease-in-out 0s;
-moz-transition: all 0.2s ease-in-out 0s;
max-height: 0;
overflow: hidden;
background: #fff;
padding: 15px;
position: absolute;
top: calc(100% + 20px);
left: 50%;
transform: translateX(-50%);
-moz-ransform: translateX(-50%);
-o-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-webkit-transform: translateX(-50%);
white-space: nowrap;
z-index: 3;
}
.header .nav .service_nav.active {
display: block;
max-height: unset;
}
.header .nav .service_nav a {
display: block;
font-weight: 500;
font-size: 16px;
line-height: 20px;
color: #000;
margin-bottom: 10px;
-webkit-transition: all 0.2s ease-in-out 0s;
transition: all 0.2s ease-in-out 0s;
-moz-transition: all 0.2s ease-in-out 0s;
}
.header .nav .service_nav a:hover {
opacity: 0.8;
}
.header .nav .service_nav a:last-child {
margin-bottom: 0;
}
.header .lang {
position: relative;

19
assets/js/main.js
View File

@ -10,6 +10,9 @@ let lang_current = document.querySelector(".lang_current");
let burger = document.querySelector(".burger");
let nav_bg = document.querySelector(".nav_bg");
let service_nav_link = document.querySelector(".service_nav-link");
let service_nav = document.querySelector(".service_nav");
function sleep(time) {
return new Promise((resolve) => setTimeout(resolve, time));
@ -40,11 +43,11 @@ window.onclick = function (e) {
// drop_lang.classList.remove('active')
// }
if (nav_bg.classList.contains('active') && !e.target.closest('.burger') && !e.target.closest('.lang_current')) {
if (nav_bg.classList.contains('active') && !e.target.closest('.burger') && !e.target.closest('.lang_current') && !e.target.closest('.service_nav-link')) {
nav_bg.classList.remove('active')
}
if (burger.classList.contains('active') && !e.target.closest('.burger') && !e.target.closest('.lang_current')) {
if (burger.classList.contains('active') && !e.target.closest('.burger') && !e.target.closest('.lang_current') && !e.target.closest('.service_nav-link')) {
burger.classList.remove('active')
}
@ -52,6 +55,10 @@ window.onclick = function (e) {
lang_drop.classList.remove('active')
}
if (service_nav.classList.contains('active') && !e.target.closest('.service_nav-link')) {
service_nav.classList.remove('active')
}
}
@ -74,3 +81,11 @@ if (burger != undefined) {
});
});
}
if (service_nav_link != undefined) {
service_nav_link.addEventListener('click', function () {
sleep(2).then(() => {
service_nav.classList.toggle('active');
});
});
}

13
contact.html
View File

@ -102,9 +102,18 @@
</li>
<li>
<a href="service.html">
<span class="service_nav-link">
Услуги
</a>
</span>
<div class="service_nav">
<a href="outdoor-service.html">Наружная реклама</a>
<a href="indoor-service.html">Реклама в помещениях</a>
<a href="exhebition-service.html">Выставочные стенды</a>
<a href="events-service.html">Организация мероприятий</a>
<a href="media-service.html">Реклама в СМИ</a>
<a href="production-service.html">Производство</a>
</div>
</li>
<li>

149
events-service.html
View File

File diff suppressed because one or more lines are too long

13
exhebition-service.html
View File

@ -103,9 +103,18 @@
</li>
<li>
<a href="service.html">
<span class="service_nav-link">
Услуги
</a>
</span>
<div class="service_nav">
<a href="outdoor-service.html">Наружная реклама</a>
<a href="indoor-service.html">Реклама в помещениях</a>
<a href="exhebition-service.html">Выставочные стенды</a>
<a href="events-service.html">Организация мероприятий</a>
<a href="media-service.html">Реклама в СМИ</a>
<a href="production-service.html">Производство</a>
</div>
</li>
<li>

2
index.html
View File

@ -103,7 +103,7 @@
</li>
<li>
<span>
<span class="service_nav-link">
Услуги
</span>

13
indoor-service.html
View File

@ -103,9 +103,18 @@
</li>
<li>
<a href="service.html">
<span class="service_nav-link">
Услуги
</a>
</span>
<div class="service_nav">
<a href="outdoor-service.html">Наружная реклама</a>
<a href="indoor-service.html">Реклама в помещениях</a>
<a href="exhebition-service.html">Выставочные стенды</a>
<a href="events-service.html">Организация мероприятий</a>
<a href="media-service.html">Реклама в СМИ</a>
<a href="production-service.html">Производство</a>
</div>
</li>
<li>

149
media-service.html
View File

File diff suppressed because one or more lines are too long

13
outdoor-service.html
View File

@ -103,9 +103,18 @@
</li>
<li>
<a href="service.html">
<span class="service_nav-link">
Услуги
</a>
</span>
<div class="service_nav">
<a href="outdoor-service.html">Наружная реклама</a>
<a href="indoor-service.html">Реклама в помещениях</a>
<a href="exhebition-service.html">Выставочные стенды</a>
<a href="events-service.html">Организация мероприятий</a>
<a href="media-service.html">Реклама в СМИ</a>
<a href="production-service.html">Производство</a>
</div>
</li>
<li>

13
portfolio.html
View File

@ -103,9 +103,18 @@
</li>
<li>
<a href="service.html">
<span class="service_nav-link">
Услуги
</a>
</span>
<div class="service_nav">
<a href="outdoor-service.html">Наружная реклама</a>
<a href="indoor-service.html">Реклама в помещениях</a>
<a href="exhebition-service.html">Выставочные стенды</a>
<a href="events-service.html">Организация мероприятий</a>
<a href="media-service.html">Реклама в СМИ</a>
<a href="production-service.html">Производство</a>
</div>
</li>
<li>

149
production-service.html
View File

File diff suppressed because one or more lines are too long