Skip to content

B
bobcat-su_full
Commit fabf26ca authored by Sergey's avatar Sergey
Browse files
Options

Add footer

parent 9ccef7ca
Hide whitespace changes
Inline Side-by-side
Showing with 291 additions and 3 deletions
src/img/sprite/svg/search.svg 0 → 100644
View file @ fabf26ca
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18">
<metadata><?xpacket begin="" id="W5M0MpCehiHzreSzNTczkc9d"?>
<x:xmpmeta xmlns:x="adobe:ns:meta/" x:xmptk="Adobe XMP Core 5.6-c140 79.160451, 2017/05/06-01:08:21 ">
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#">
<rdf:Description rdf:about=""/>
</rdf:RDF>
</x:xmpmeta>
<?xpacket end="w"?></metadata>
<defs>
<style>
.cls-1 {
fill: #fff;
fill-rule: evenodd;
}
</style>
</defs>
<path id="Фигура_23" data-name="Фигура 23" class="cls-1" d="M1430.6,2274.08l-0.52.52a1.358,1.358,0,0,1-1.92,0l-3.31-3.31a7.759,7.759,0,1,1,2.44-2.44l3.31,3.31A1.358,1.358,0,0,1,1430.6,2274.08Zm-9.86-14.94a5.6,5.6,0,1,0,5.6,5.59A5.6,5.6,0,0,0,1420.74,2259.14Z" transform="translate(-1413 -2257)"/>
</svg>
src/index.html
View file @ fabf26ca
......@@ -9,5 +9,5 @@
//= template/news-main/index.html
//= template/link-list-red/index.html
footer
//= template/common/footer.html
\ No newline at end of file
src/scss/common/footer/footer-copyright.scss 0 → 100644
View file @ fabf26ca
@import "../../settings/color";
.footer__copyright{
background: black;
text-align: center;
}
.footer__copyright-text{
color: rgba($white-text, .3);
margin: 0;
padding: 2px;
}
\ No newline at end of file
src/scss/common/footer/footer-fline.scss 0 → 100644
View file @ fabf26ca
@import "../../settings/color";
.footer__f-line{
display: flex;
align-items: center;
justify-content: space-between;
}
.footer__logo-ico{
fill: $white-text;
width: 245px;
height: 70px;
}
\ No newline at end of file
src/scss/common/footer/footer-list.scss 0 → 100644
View file @ fabf26ca
@import "../../settings/color";
.footer__main{
display: flex;
padding-top: 40px;
justify-content: space-between;
align-items: flex-start;
}
.footer-hr{
width: 1px;
height: 260px;
background: $white-text;
}
.footer__list-h{
text-decoration: none;
transition: .2s;
color: $white-text;
font-weight: bold;
&:hover{
text-decoration: underline;
}
}
.footer__list{
padding-left: 0;
list-style-type: none;
}
.footer__item{
margin-bottom: 20px;
}
.footer__item-link{
text-decoration: none;
transition: .2s;
color: $white-text;
&:hover{
text-decoration: underline;
}
}
\ No newline at end of file
src/scss/common/footer/footer-main.scss 0 → 100644
View file @ fabf26ca
@import "../../settings/color";
.footer{
background: $footer;
padding-top: 45px;
}
.footer__wrapper{
width: 880px;
}
.footer__phone{
color: $white-text;
}
.footer__phone-link{
padding-top: 15px;
font-size: 30px;
text-decoration: none;
color: $white-text;
}
.footer__phone-title{
display: flex;
color: $white-text;
align-items: center;
}
.footer__phone-desc{
font-size: 14px;
}
.footer__phone-ico{
width: 35px;
height: 35px;
fill: $white-text;
margin-right: 20px;
}
.footer__mail{
padding-top: 40px;
}
.footer__mail-link{
display: flex;
text-decoration: none;
color: $white-text;
align-items: center;
}
.footer__mail-ico{
width: 35px;
height: 35px;
fill: $white-text;
margin-right: 20px;
}
.footer__mail-text{
font-size: 20px;
margin: 0;
}
\ No newline at end of file
src/scss/common/footer/footer-search.scss 0 → 100644
View file @ fabf26ca
@import "../../settings/color";
.footer__search{
position: relative;
width: 270px;
}
.footer__search-input{
width: 100%;
height: 30px;
border: none;
border-radius: 0;
padding-left: 10px;
}
.footer__search-btn{
position: absolute;
right: 0;
top: 0;
width: 30px;
height: 100%;
background: $red-color;
border: none;
}
.footer__search-ico{
width: 15px;
height: 15px;
fill: $white-text;
}
\ No newline at end of file
src/scss/settings/color.scss
View file @ fabf26ca
......@@ -3,4 +3,5 @@ $link-list: #ff3600;
$white-text: #fefefe;
$menu-list: #232021;
$about-bg: #dfdfdf;
$grey-text: #727272;
\ No newline at end of file
$grey-text: #727272;
$footer: #333333;
\ No newline at end of file
src/template/common/footer.html
View file @ fabf26ca
<footer role="contentinfo" class="footer">
<div class="wrapper footer__wrapper">
<div class="footer__f-line">
<a href="#">
<svg class="footer__logo-ico">
<use xlink:href="img/sprite-vector.svg#logo"></use>
</svg>
</a>
<div class="footer__search">
<input class="footer__search-input" type="search">
<button class="footer__search-btn">
<svg class="footer__search-ico">
<use xlink:href="img/sprite-vector.svg#search"></use>
</svg>
</button>
</div>
</div>
<div class="footer__main">
<div class="footer__main-item">
<a href="#" class="footer__list-h">Продукция</a>
<ul class="footer__list">
<li class="footer__item">
<a href="#" class="footer__item-link">Колесные мини-погрузчики</a>
</li>
<li class="footer__item">
<a href="#" class="footer__item-link">Гусеничные мини-погрузчики</a>
</li>
<li class="footer__item">
<a href="#" class="footer__item-link">Мини экскаваторы</a>
</li>
<li class="footer__item">
<a href="#" class="footer__item-link">Телескопические погрузчики</a>
</li>
<li class="footer__item">
<a href="#" class="footer__item-link">Экскаваторы погрузчики</a>
</li>
<li class="footer__item">
<a href="#" class="footer__item-link">Навесное оборудование</a>
</li>
</ul>
</div>
<div class="footer-hr"></div>
<div class="footer__main-item">
<a href="#" class="footer__list-h">Услуги</a>
<ul class="footer__list">
<li class="footer__item">
<a href="#" class="footer__item-link">Запчасти и аксессуары</a>
</li>
<li class="footer__item">
<a href="#" class="footer__item-link">Обслуживание и поддержка</a>
</li>
<li class="footer__item">
<a href="#" class="footer__item-link">Подержанное оборудование</a>
</li>
<li class="footer__item">
<a href="#" class="footer__item-link">Часто задаваемые вопросы</a>
</li>
</ul>
</div>
<div class="footer-hr"></div>
<div class="footer__main-item">
<div class="footer__phone">
<div class="footer__phone-title">
<svg class="footer__phone-ico">
<use xlink:href="img/sprite-vector.svg#phone-icon"></use>
</svg>
<p class="footer__phone-title-text">Контактный центр</p>
</div>
<div class="footer__phone-num"><a class="footer__phone-link" href="tel:+7888888888">8-800-000-00-00</a></div>
<div class="footer__phone-desc">(Звонок по России бесплатный)</div>
</div>
<div class="footer__mail">
<a href="#" class="footer__mail-link">
<svg class="footer__mail-ico">
<use xlink:href="img/sprite-vector.svg#mail-icon"></use>
</svg>
<p class="footer__mail-text">Bobcat Profi»mail.ru</p>
</a>
</div>
</div>
</div>
</div>
<div class="footer__copyright">
<p class="footer__copyright-text">2018 Copyright © Bobcat Profi</p>
</div>
</footer>
</body>
<script src="js/swiper.js"></script>
<script src="js/all.js"></script>
......
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