mirror of
https://github.com/ivabus/www
synced 2024-11-26 12:05:05 +03:00
Footer navigation
This commit is contained in:
parent
637d4e0215
commit
3fd9dc8e8e
3 changed files with 71 additions and 29 deletions
25
src/layouts/partials/footer-nav.html
Normal file
25
src/layouts/partials/footer-nav.html
Normal file
|
@ -0,0 +1,25 @@
|
|||
<ul class="nav justify-content-end">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link footer-link small" aria-current="page" href="#">Careers</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link footer-link small" href="#">Privacy Policy</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link footer-link small" href="#">Terms of Use</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<style>
|
||||
.footer-link{
|
||||
text-transform: lowercase;
|
||||
color: white;
|
||||
padding: 0px 0px 0px 40px !important;
|
||||
}
|
||||
|
||||
.footer-link:hover{
|
||||
color: #00ffd0 !important;
|
||||
text-decoration:underline;
|
||||
}
|
||||
|
||||
</style>
|
|
@ -1,36 +1,44 @@
|
|||
<hr>
|
||||
<section class="footer">
|
||||
<div class="container">
|
||||
<div class="row mb-5">
|
||||
<div class="col-lg-8 footer-content">
|
||||
<h4>Equitable Open-Source for Web3</h4>
|
||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
|
||||
<img src="/Images/footer-grid-element.svg" alt="tea.grid">
|
||||
</div>
|
||||
<div class="col-lg-4">
|
||||
<div class="card social-box" style="width: 100%; float:right;">
|
||||
<ul class="list-group list-group-flush">
|
||||
<a class="list-group-item" role="button" href="https://twitter.com">Twitter</a>
|
||||
<a class="list-group-item" role="button" href="https://twitter.com">Discord</a>
|
||||
<li class="list-group-item">GitHub</li>
|
||||
<li class="list-group-item">Reddit</li>
|
||||
<li class="list-group-item">Telegram</li>
|
||||
<li class="list-group-item">Instagram</li>
|
||||
</ul>
|
||||
<hr>
|
||||
<div class="row mb-5">
|
||||
<div class="col-lg-8 footer-content">
|
||||
<h4>Equitable Open-Source for Web3</h4>
|
||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
|
||||
<img src="/Images/footer-grid-element.svg" alt="tea.grid">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<hr>
|
||||
<div class="col">
|
||||
<div class="input-group">
|
||||
<input type="text" class="form-control footer-email" placeholder="Recipient's username" aria-label="Recipient's username with two button addons">
|
||||
<button class="btn btn-outline-secondary" type="button">Button</button>
|
||||
<button class="btn btn-outline-secondary" type="button">Button</button>
|
||||
<div class="col-lg-4">
|
||||
<div class="card social-box" style="width: 100%; float:right;">
|
||||
<ul class="list-group list-group-flush">
|
||||
<a class="list-group-item" role="button" href="https://twitter.com">Twitter</a>
|
||||
<a class="list-group-item" role="button" href="https://twitter.com">Discord</a>
|
||||
<li class="list-group-item">GitHub</li>
|
||||
<li class="list-group-item">Reddit</li>
|
||||
<li class="list-group-item">Telegram</li>
|
||||
<li class="list-group-item">Instagram</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<hr>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row mb-4">
|
||||
<hr>
|
||||
<div class="col">
|
||||
<div class="input-group">
|
||||
<input type="text" class="form-control footer-email" placeholder="Recipient's username" aria-label="Recipient's username with two button addons">
|
||||
<button class="btn btn-outline-secondary" type="button">Button</button>
|
||||
<button class="btn btn-outline-secondary" type="button">Button</button>
|
||||
</div>
|
||||
</div>
|
||||
<hr>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-lg-6">
|
||||
<p class="small">©2022 tea inc. You can also share our <a href="" class="teal">Linktree</a>.</p>
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
{{- partial "footer-nav.html" . -}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
|
|
@ -181,6 +181,11 @@ p{
|
|||
color: #ffffff;
|
||||
}
|
||||
|
||||
li{
|
||||
font-family: "sono", sans-serif;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
/* Breakpoint-Specific Typography */
|
||||
|
||||
|
||||
|
@ -283,7 +288,11 @@ hr{
|
|||
/* Footer Styling */
|
||||
|
||||
.footer-email{
|
||||
padding: 35px 75px;
|
||||
font-family: "pp-neue-machina", sans-serif;
|
||||
text-transform: uppercase;
|
||||
font-size: 38px;
|
||||
line-height: 38px;
|
||||
padding: 35px 0px;
|
||||
background: none;
|
||||
border: none;
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue