Commit a04a9850 authored by Sergey's avatar Sergey

Add menu-list

parent 42bd2866
@import "../settings/color";
.menu-list{
background: $menu-list;
}
.menu-list__wrapper{
padding: 0 20px;
}
.menu-list__list{
display: flex;
list-style-type: none;
padding-left: 0;
margin: 0;
justify-content: space-between;
}
.menu-list__item{
position: relative;
padding: 0 10px;
&:after{
content: "";
display: inline-block;
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
width: 1px;
height: 100%;
background: rgba($white-text, .6);
}
&:last-child{
&:after{
content: "";
display: none;
}
}
}
.menu-list__link{
text-decoration: none;
color: $white-text;
}
\ No newline at end of file
$red-color: #e33000;
$white-text: #fefefe;
$menu-list: #232021;
\ No newline at end of file
......@@ -6,7 +6,6 @@ body{
margin: 0;
padding: 0;
font-family: 'PT Sans', serif;
background: #232021;
}
.wrapper{
......
<div class="menu-list">
<div class="wrapper menu-list__wrapper">
<ul class="menu-list__list">
<li class="menu-list__item">sdasd</li>
<li class="menu-list__item">
<a href="#" class="menu-list__link">
<img src="" alt="" class="menu-list__ico">
<p class="menu-list__tit">Колесные мини-погрузчики</p>
</a>
</li>
<li class="menu-list__item">
<a href="#" class="menu-list__link">
<img src="" alt="" class="menu-list__ico">
<p class="menu-list__tit">Колесные мини-погрузчики</p>
</a>
</li>
<li class="menu-list__item">
<a href="#" class="menu-list__link">
<img src="" alt="" class="menu-list__ico">
<p class="menu-list__tit">Колесные мини-погрузчики</p>
</a>
</li>
<li class="menu-list__item">
<a href="#" class="menu-list__link">
<img src="" alt="" class="menu-list__ico">
<p class="menu-list__tit">Колесные мини-погрузчики</p>
</a>
</li>
<li class="menu-list__item">
<a href="#" class="menu-list__link">
<img src="" alt="" class="menu-list__ico">
<p class="menu-list__tit">Колесные мини-погрузчики</p>
</a>
</li>
<li class="menu-list__item">
<a href="#" class="menu-list__link">
<img src="" alt="" class="menu-list__ico">
<p class="menu-list__tit">Колесные мини-погрузчики</p>
</a>
</li>
</ul>
</div>
</div>
\ 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