forked from M3-Academy/practice-time-landing-page
Cria o footer desktop e mobile
This commit is contained in:
parent
e09f5376ab
commit
c49fc266b9
3
assets/images/facebook-icon.svg
Normal file
3
assets/images/facebook-icon.svg
Normal file
@ -0,0 +1,3 @@
|
||||
<svg width="14" height="24" viewBox="0 0 14 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M12.9992 0.0049936L9.88695 0C6.39043 0 4.13082 2.31828 4.13082 5.90643V8.62969H1.00158C0.731177 8.62969 0.512207 8.84891 0.512207 9.11932V13.065C0.512207 13.3354 0.731426 13.5544 1.00158 13.5544H4.13082V23.5106C4.13082 23.781 4.34979 24 4.62019 24H8.70296C8.97337 24 9.19234 23.7808 9.19234 23.5106V13.5544H12.8512C13.1216 13.5544 13.3405 13.3354 13.3405 13.065L13.342 9.11932C13.342 8.98948 13.2903 8.86514 13.1987 8.77326C13.1071 8.68138 12.9822 8.62969 12.8524 8.62969H9.19234V6.32115C9.19234 5.21157 9.45675 4.64829 10.9021 4.64829L12.9987 4.64755C13.2689 4.64755 13.4878 4.42833 13.4878 4.15817V0.494367C13.4878 0.224462 13.2691 0.00549296 12.9992 0.0049936Z" fill="white"/>
|
||||
</svg>
|
After Width: | Height: | Size: 792 B |
BIN
assets/images/instagram-icon.png
Normal file
BIN
assets/images/instagram-icon.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 490 B |
3
assets/images/youtube-icon.svg
Normal file
3
assets/images/youtube-icon.svg
Normal file
@ -0,0 +1,3 @@
|
||||
<svg width="24" height="18" viewBox="0 0 24 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M22.98 2.34C22.329 1.182 21.6225 0.969 20.184 0.888C18.747 0.7905 15.1335 0.75 12.003 0.75C8.8665 0.75 5.2515 0.7905 3.816 0.8865C2.3805 0.969 1.6725 1.1805 1.0155 2.34C0.345 3.4965 0 5.4885 0 8.9955C0 8.9985 0 9 0 9C0 9.003 0 9.0045 0 9.0045V9.0075C0 12.4995 0.345 14.5065 1.0155 15.651C1.6725 16.809 2.379 17.019 3.8145 17.1165C5.2515 17.2005 8.8665 17.25 12.003 17.25C15.1335 17.25 18.747 17.2005 20.1855 17.118C21.624 17.0205 22.3305 16.8105 22.9815 15.6525C23.658 14.508 24 12.501 24 9.009C24 9.009 24 9.0045 24 9.0015C24 9.0015 24 8.9985 24 8.997C24 5.4885 23.658 3.4965 22.98 2.34ZM9 13.5V4.5L16.5 9L9 13.5Z" fill="white"/>
|
||||
</svg>
|
After Width: | Height: | Size: 743 B |
@ -150,6 +150,31 @@ body {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.page-footer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background: #000000;
|
||||
align-items: center;
|
||||
padding: 38px 0;
|
||||
}
|
||||
|
||||
.footer-icons {
|
||||
display: flex;
|
||||
list-style: none;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.footer-icon {
|
||||
margin: 0 8px;
|
||||
}
|
||||
|
||||
.footer-text {
|
||||
text-transform: uppercase;
|
||||
font-size: 10px;
|
||||
line-height: 12px;
|
||||
color: #BDBDBD;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 414px) {
|
||||
.main-banner-desktop,
|
||||
.middle-banner-desktop {
|
||||
@ -182,6 +207,15 @@ body {
|
||||
.bottom-card-description {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.page-footer {
|
||||
padding-bottom: 26px;
|
||||
}
|
||||
|
||||
.footer-text {
|
||||
max-width: 280px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 992px) {
|
||||
|
26
index.html
26
index.html
@ -119,5 +119,31 @@
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<footer class="page-footer">
|
||||
<ul class="footer-icons">
|
||||
<li class="footer-icon">
|
||||
<a href="https://www.instagram.com/m3.ecommerce/" target="_blank" rel="external">
|
||||
<img src="./assets/images/instagram-icon.png" alt="Ícone do Instagram" />
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li class="footer-icon">
|
||||
<a href="https://www.facebook.com/digitalm3/" target="_blank" rel="external">
|
||||
<img src="./assets/images/facebook-icon.svg" alt="Ícone do Facebook" />
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li class="footer-icon">
|
||||
<a href="https://www.youtube.com/channel/UCW4o86gZG_ceA8CmHltXeXA/videos?app=desktop" target="_blank" rel="external">
|
||||
<img src="./assets/images/youtube-icon.svg" alt="Ícone do Youtube" />
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<p class="footer-text">
|
||||
Copyright © 2020 - Loja Comércio Eletrônico CNPJ: 000.000.000/0001-00
|
||||
</p>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
Loading…
Reference in New Issue
Block a user