This commit is contained in:
roryjshelton 2023-05-06 18:58:03 +02:00
parent 3fb257e87c
commit 7d41f1240a
3 changed files with 90 additions and 35 deletions

View File

@ -3,11 +3,13 @@ import "./FooterStyles.css";
---
<div class="footer-cards">
<div class="footer-card">
<div class="h-auto bg-[#020E10];">
<h6>
<div class="footer-logo"></div>
<ul>
<li class="footer-li">
<li
class="footer-li text-[#808687] text-[calc(10px_+_(21_-_10)_*_((100vw_-_300px)_/_(1600_-_300)))] font-thin not-italic leading-[1px] pl-0"
>
<span class="footer-email"></span>contact@lumeweb.com
</li><div class="footer-span">
<span class="footer-h2"
@ -17,65 +19,129 @@ import "./FooterStyles.css";
</ul>
</h6>
</div>
<div class="footer-card">
<div class="h-auto bg-[#020E10];">
<h5
class="inline-block text-left text-[calc(15px_+_(21_-_10)_*_((100vw_-_300px)_/_(1600_-_300)))]"
style="padding-left: 0.25em;"
>
General
</h5><br /><h6>
<li class="footer-li">Home</li>
<li class="footer-li">Get Started</li>
<li class="footer-li">Documentation</li>
<li class="footer-li">Projects</li>
<li
class="footer-li text-[#808687] text-[calc(10px_+_(21_-_10)_*_((100vw_-_300px)_/_(1600_-_300)))] font-thin not-italic leading-[1px] pl-0"
>
Home
</li>
<li
class="footer-li text-[#808687] text-[calc(10px_+_(21_-_10)_*_((100vw_-_300px)_/_(1600_-_300)))] font-thin not-italic leading-[1px] pl-0"
>
Get Started
</li>
<li
class="footer-li text-[#808687] text-[calc(10px_+_(21_-_10)_*_((100vw_-_300px)_/_(1600_-_300)))] font-thin not-italic leading-[1px] pl-0"
>
Documentation
</li>
<li
class="footer-li text-[#808687] text-[calc(10px_+_(21_-_10)_*_((100vw_-_300px)_/_(1600_-_300)))] font-thin not-italic leading-[1px] pl-0"
>
Projects
</li>
</h6>
</div>
<div class="footer-card">
<div class="h-auto bg-[#020E10];">
<h5
class="inline-block text-left text-[calc(15px_+_(21_-_10)_*_((100vw_-_300px)_/_(1600_-_300)))]"
style="padding-left: 0.25em;"
>
Community
</h5><br /><h6>
<li class="footer-li">GitHub</li>
<li class="footer-li">Discord</li>
<li class="footer-li">Twitter</li>
<li class="footer-li">facebook</li>
<li
class="footer-li text-[#808687] text-[calc(10px_+_(21_-_10)_*_((100vw_-_300px)_/_(1600_-_300)))] font-thin not-italic leading-[1px] pl-0"
>
GitHub
</li>
<li
class="footer-li text-[#808687] text-[calc(10px_+_(21_-_10)_*_((100vw_-_300px)_/_(1600_-_300)))] font-thin not-italic leading-[1px] pl-0"
>
Discord
</li>
<li
class="footer-li text-[#808687] text-[calc(10px_+_(21_-_10)_*_((100vw_-_300px)_/_(1600_-_300)))] font-thin not-italic leading-[1px] pl-0"
>
Twitter
</li>
<li
class="footer-li text-[#808687] text-[calc(10px_+_(21_-_10)_*_((100vw_-_300px)_/_(1600_-_300)))] font-thin not-italic leading-[1px] pl-0"
>
facebook
</li>
</h6>
</div>
<div class="footer-card">
<div class="h-auto bg-[#020E10];">
<h5
class="inline-block text-left text-[calc(15px_+_(21_-_10)_*_((100vw_-_300px)_/_(1600_-_300)))]"
style="padding-left: 0.25em;"
>
Ecosystem
</h5><br /><h6>
<li class="footer-li">Browser</li>
<li class="footer-li">Extension</li>
<li class="footer-li">Universal Storage</li>
<li
class="footer-li text-[#808687] text-[calc(10px_+_(21_-_10)_*_((100vw_-_300px)_/_(1600_-_300)))] font-thin not-italic leading-[1px] pl-0"
>
Browser
</li>
<li
class="footer-li text-[#808687] text-[calc(10px_+_(21_-_10)_*_((100vw_-_300px)_/_(1600_-_300)))] font-thin not-italic leading-[1px] pl-0"
>
Extension
</li>
<li
class="footer-li text-[#808687] text-[calc(10px_+_(21_-_10)_*_((100vw_-_300px)_/_(1600_-_300)))] font-thin not-italic leading-[1px] pl-0"
>
Universal Storage
</li>
</h6>
</div>
<div class="footer-card">
<div class="h-auto bg-[#020E10];">
<h5
class="inline-block text-left text-[calc(15px_+_(21_-_10)_*_((100vw_-_300px)_/_(1600_-_300)))]"
style="padding-left: 0.25em;"
>
Other
</h5><br /><h6>
<li class="footer-li">BrowserUniversal</li>
<li class="footer-li">Storage</li>
<li
class="footer-li text-[#808687] text-[calc(10px_+_(21_-_10)_*_((100vw_-_300px)_/_(1600_-_300)))] font-thin not-italic leading-[1px] pl-0"
>
BrowserUniversal
</li>
<li
class="footer-li text-[#808687] text-[calc(10px_+_(21_-_10)_*_((100vw_-_300px)_/_(1600_-_300)))] font-thin not-italic leading-[1px] pl-0"
>
Storage
</li>
</h6>
</div>
<div class="footer-card">
<div class="h-auto bg-[#020E10];">
<h5
class="inline-block text-left text-[calc(15px_+_(21_-_10)_*_((100vw_-_300px)_/_(1600_-_300)))]"
style="padding-left: 0.25em;"
>
Support Us
</h5><br /><h6>
<li class="footer-li">Donate</li>
<li class="footer-li">Download App</li>
<li class="footer-li">Partnerships</li>
<li
class="footer-li text-[#808687] text-[calc(10px_+_(21_-_10)_*_((100vw_-_300px)_/_(1600_-_300)))] font-thin not-italic leading-[1px] pl-0"
>
Donate
</li>
<li
class="footer-li text-[#808687] text-[calc(10px_+_(21_-_10)_*_((100vw_-_300px)_/_(1600_-_300)))] font-thin not-italic leading-[1px] pl-0"
>
Download App
</li>
<li
class="footer-li text-[#808687] text-[calc(10px_+_(21_-_10)_*_((100vw_-_300px)_/_(1600_-_300)))] font-thin not-italic leading-[1px] pl-0"
>
Partnerships
</li>
</h6>
</div>
</div>

View File

@ -1,16 +1,5 @@
.footer-card {
height: auto;
background-color: #020E10;
}
.footer-li {
color: #808687;
font-family: var(--font-family-jaldi);
font-size: calc(10px + (21 - 10) * ((100vw - 300px) / (1600 - 300)));
font-weight: 100;
font-style: normal;
padding-left: 0;
line-height: 1px;
margin-inline: 5px;
list-style-type: none;
}

View File

@ -9,7 +9,7 @@ import "./MessageStyles.css";
A message from Derrick
</div>
<div
class="message-content text-[color:var(--blue-charcoal-2)] text-[calc(15px_+_(21_-_14)_*_((100vw_-_300px)_/_(1600_-_300)))] max-w-[85%] font-normal not-italic;"
class="message-content text-[color:var(--blue-charcoal-2)] text-[calc(15px_+_(21_-_14)_*_((100vw_-_300px)_/_(1600_-_300)))] max-w-[100%] font-normal not-italic;"
>
Web3 gives people control over their data, privacy, and ownership.
Lume's affordable Web3 tech aims to speed up the transition from Web2 to