Adicionando barra de vantagens na home
This commit is contained in:
parent
d61a1a612d
commit
2e03035571
@ -1,5 +1,6 @@
|
||||
.home {
|
||||
.main-banners {
|
||||
margin-bottom: 38px;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
@ -101,4 +102,50 @@
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.advantages{
|
||||
margin-bottom: 117px;
|
||||
|
||||
&__list {
|
||||
margin: 0;
|
||||
padding: 0 15px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
overflow: auto;
|
||||
|
||||
@include mq(sm, min) {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
&__item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-right: 75px;
|
||||
|
||||
&:last-of-type {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
|
||||
@include mq(md, max) {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
i {
|
||||
margin-right: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
&__text {
|
||||
margin: 0;
|
||||
white-space: nowrap;
|
||||
line-height: 12px;
|
||||
font-size: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
BIN
src/arquivos/sprite/credit-card-icon.png
Normal file
BIN
src/arquivos/sprite/credit-card-icon.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 1.2 KiB |
BIN
src/arquivos/sprite/shop-icon.png
Normal file
BIN
src/arquivos/sprite/shop-icon.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 1.1 KiB |
BIN
src/arquivos/sprite/truck-icon.png
Normal file
BIN
src/arquivos/sprite/truck-icon.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 971 B |
@ -30,6 +30,32 @@
|
||||
<vtex:contentPlaceHolder id="banners-principais-mobile" />
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="advantages">
|
||||
<ul class="advantages__list">
|
||||
<li class="advantages__item">
|
||||
<i class="sprite sprite-credit-card-icon"></i>
|
||||
<p class="advantages__text">
|
||||
PARCELAMENTO EM <br />
|
||||
ATÉ 6X SEM JUROS
|
||||
</p>
|
||||
</li>
|
||||
<li class="advantages__item">
|
||||
<i class="sprite sprite-truck-icon"></i>
|
||||
<p class="advantages__text">
|
||||
PAC GRÁTIS PARA COMPRAS <br />
|
||||
ACIMA DE <strong> R$ 500,00</strong>
|
||||
</p>
|
||||
</li>
|
||||
<li class="advantages__item">
|
||||
<i class="sprite sprite-shop-icon"></i>
|
||||
<p class="advantages__text">
|
||||
FÁBRICA <br />
|
||||
PRÓPRIA
|
||||
</p>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
|
Loading…
Reference in New Issue
Block a user