Merge remote-tracking branch 'origin/develop' into develop

This commit is contained in:
Derrick Hammer 2023-08-13 05:18:52 -04:00
commit 4e061b4df0
Signed by: pcfreak30
GPG Key ID: C997C339BE476FF2
12 changed files with 255 additions and 276 deletions

View File

@ -1,3 +1,31 @@
# [0.1.0-develop.5](https://git.lumeweb.com/LumeWeb/lumeweb.com/compare/v0.1.0-develop.4...v0.1.0-develop.5) (2023-08-13)
### Features
* refactor message component and footer ([8c14799](https://git.lumeweb.com/LumeWeb/lumeweb.com/commit/8c14799f5a0136cffffd05d90e83a81f53954b81))
# [0.1.0-develop.4](https://git.lumeweb.com/LumeWeb/lumeweb.com/compare/v0.1.0-develop.3...v0.1.0-develop.4) (2023-08-13)
### Bug Fixes
* update copy ([9b5fcfe](https://git.lumeweb.com/LumeWeb/lumeweb.com/commit/9b5fcfea318a83f662ae436fce0444c2dd808040))
# [0.1.0-develop.3](https://git.lumeweb.com/LumeWeb/lumeweb.com/compare/v0.1.0-develop.2...v0.1.0-develop.3) (2023-08-13)
### Bug Fixes
* meme misalignment ([e773619](https://git.lumeweb.com/LumeWeb/lumeweb.com/commit/e773619524647074554005f18ec8840ddd06b1cb))
# [0.1.0-develop.2](https://git.lumeweb.com/LumeWeb/lumeweb.com/compare/v0.1.0-develop.1...v0.1.0-develop.2) (2023-08-13)
### Bug Fixes
* wording change ([575a5b8](https://git.lumeweb.com/LumeWeb/lumeweb.com/commit/575a5b81495b3560a8146d4d35cd4a0064d37a32))
# [0.1.0-develop.1](https://git.lumeweb.com/LumeWeb/lumeweb.com/compare/v0.0.1...v0.1.0-develop.1) (2023-08-13) # [0.1.0-develop.1](https://git.lumeweb.com/LumeWeb/lumeweb.com/compare/v0.0.1...v0.1.0-develop.1) (2023-08-13)

4
npm-shrinkwrap.json generated
View File

@ -1,12 +1,12 @@
{ {
"name": "@lumeweb/lumeweb.com", "name": "@lumeweb/lumeweb.com",
"version": "0.1.0-develop.1", "version": "0.1.0-develop.5",
"lockfileVersion": 3, "lockfileVersion": 3,
"requires": true, "requires": true,
"packages": { "packages": {
"": { "": {
"name": "@lumeweb/lumeweb.com", "name": "@lumeweb/lumeweb.com",
"version": "0.1.0-develop.1", "version": "0.1.0-develop.5",
"dependencies": { "dependencies": {
"@astrojs/react": "^2.1.1", "@astrojs/react": "^2.1.1",
"@astrojs/tailwind": "^3.1.1", "@astrojs/tailwind": "^3.1.1",

View File

@ -1,7 +1,7 @@
{ {
"name": "@lumeweb/lumeweb.com", "name": "@lumeweb/lumeweb.com",
"type": "module", "type": "module",
"version": "0.1.0-develop.1", "version": "0.1.0-develop.5",
"private": true, "private": true,
"repository": { "repository": {
"type": "git", "type": "git",

View File

@ -11,12 +11,12 @@ import abstractBg from "/src/assets/single-brand-bg-1.png";
Community-Powered Community-Powered
</h2> </h2>
<h3 class="font-display text-4xl md:text-6xl font-bold"> <h3 class="font-display text-4xl md:text-6xl font-bold">
Building a new world for your data Building the open, user-owned web you deserve
</h3> </h3>
<p class="font-body text-xl md:text-3xl text-body"> <p class="font-body text-xl md:text-3xl text-body">
Right now, Lume has only one full-time developer and limited helper staff! Right now, Lume has only one full-time developer, a few freelancers, and
We need help from developers, fundraisers, funders, and contributors to limited helper staff! We need help from developers, fundraisers, funders,
bring the new web to the masses. and contributors to bring the new internet to the masses.
</p> </p>
<div class="flex flex-row items-center gap-6"> <div class="flex flex-row items-center gap-6">
<img src={avatar.src} class="w-20 h-20" /> <img src={avatar.src} class="w-20 h-20" />

View File

@ -8,29 +8,30 @@ import mulletMeme from "/src/assets/centralized-mullet-meme.png";
<h2 <h2
class="font-display text-primary font-bold text-xl md:text-2xl uppercase" class="font-display text-primary font-bold text-xl md:text-2xl uppercase"
> >
BUSTING THE DECENTERALIZED WEB3 MYTH Busting the Decentralized Web3 Myth
</h2> </h2>
<h3 class="font-display text-4xl md:text-6xl font-bold"> <h3 class="font-display text-4xl md:text-6xl font-bold">
The Centralized Mullet The Decentralized Mullet
</h3> </h3>
<p class="font-body text-xl md:text-3xl text-body"> <p class="font-body text-xl md:text-3xl text-body">
Right now, despite many claims, a majority, if not all, the services Right now, despite many claims, a majority, <b>if not all</b>, the
that build the legos of Web3 are actually centralized, both with what services that build the legos of Web3 are actually centralized, both
you can see and what you can't. with what you can <b>see</b> and what you <b>can't.</b>
</p>
<p class="font-body text-xl md:text-3xl text-body">
While some <b>blockchains</b> may be more <b>decentralized</b> than others,
access to nearly every blockchain is also
<b>centralized</b>.
</p> </p>
<p class="font-body text-xl md:text-3xl text-body">
While some blockchains may be more decentralized than others, access to
nearly every blockchain is also centralized.
</p>
<p class="font-body text-xl md:text-3xl text-body"> <p class="font-body text-xl md:text-3xl text-body">
So consider this a call to action for our community to go back to ethos So consider this a call to action for our community to go back to ethos
and make Web3 real. and make Web3 <i>real</i>.
</p> </p>
</div> </div>
<img <img
src={mulletMeme.src} src={mulletMeme.src}
class="w-[500px] xl:w-[550px] max-h-[650px] self-center" class="w-[500px] xl:w-[650px] max-h-[550px] self-center"
alt="Web 1" alt="Web 1"
style="padding-bottom: 3em" style="padding-bottom: 3em"
/> />

View File

@ -1,12 +1,14 @@
--- ---
import './Message.scss';
--- ---
<section id="message"> <section id="message" class="bg-primary py-16 px-40 space-y-4">
<h2> <h2 class="text-3xl font-bold text-black font-display">
A message from Derrick A message from Derrick
</h2> </h2>
<p> <p class="text-2xl text-black font-body">
Some of the world's largest online threats right now are censorship of speech <i>and</i> money. Web3 represents unifying many legos to create a truly user-owned web. Decentralization is a means to an end, not the end itself. The true goal is that you are in control of your personal web, and no one else. Some of the world's largest online threats right now are censorship of
speech <i>and</i> money. Web3 represents unifying many legos to create a truly
user-owned web. Decentralization is a means to an end, not the end itself. The
true goal is that you are in control of your personal web, and no one else.
</p> </p>
</section> </section>

View File

@ -1,27 +0,0 @@
@import "/src/styles/mixins.scss";
@import "/src/styles/vars.scss";
#message {
padding: 5em 7.5%;
background: $color-aquamarine;
color: $color-blue-charcoal-2;
@media screen and (max-width: 47.99999rem) {
text-align: center;
}
h2 {
margin-bottom: 0.25em;
@include fluid-font-size(2rem);
font-weight: 700;
line-height: 153%;
text-transform: none;
color: inherit;
}
p {
font-family: $font-family-jaldi;
@include fluid-font-size(1.5rem);
line-height: 137%;
}
}

View File

@ -6,12 +6,16 @@
Our Vision Our Vision
</h2> </h2>
<h3 class="font-display text-4xl md:text-6xl font-bold"> <h3 class="font-display text-4xl md:text-6xl font-bold">
Make Web3 easy for everyone Enable an open, censorship-resistant web
</h3> </h3>
<p class="font-body text-xl md:text-3xl text-body"> <p class="font-body text-xl md:text-3xl text-body">
Web3 offers freedom of speech, data sovereignty, and privacy. We simplify Web3 is the next evolution of the internet that combines many legos from
Web3 by bridging the gap between the two webs, enabling easy usage without past decades.
censorship or backdoors over your personal web. </p>
<p class="font-body text-xl md:text-3xl text-body">
Benefits include internet <b>freedom</b>, <b>privacy</b>, and <b
>ownership</b
> over your personal web.
</p> </p>
<div class="pt-10 w-full"> <div class="pt-10 w-full">
<a <a

View File

@ -1,6 +1,7 @@
--- ---
import gfxLeft from "../../../assets/home-gfx-left.png" import gfxLeft from "../../../assets/home-gfx-left.png";
--- ---
<section <section
id="web3" id="web3"
class="flex flex-col lg:flex-row lg:bg-transparent lg:p-0 gap-10 mx-10 sm:mx-20 xl:mx-40" class="flex flex-col lg:flex-row lg:bg-transparent lg:p-0 gap-10 mx-10 sm:mx-20 xl:mx-40"
@ -18,9 +19,15 @@ import gfxLeft from "../../../assets/home-gfx-left.png"
Why Web3 matters Why Web3 matters
</h3> </h3>
<p class="font-body text-xl md:text-3xl text-body"> <p class="font-body text-xl md:text-3xl text-body">
Web3 gives people control over their data, privacy, and ownership. Lume's Web3 often gets mixed up with other terms/buzz words such as "crypto" or
affordable Web3 tech aims to speed up the transition from Web2 to Web3, "defi". However, the current web you use now is often referred to insiders
which matters for privacy and security. as "web2".
</p>
<p class="font-body text-xl md:text-3xl text-body">
While Web3 can include many decentralized services, it symbolizes the
multiverse, or the entirety of all decentralized & P2P networks. Some may
refer to this as the "metaverse", or even "dweb", but we can agree to
disagree 😉.
</p> </p>
<div class="pt-10 w-full"> <div class="pt-10 w-full">
<a <a

View File

@ -25,9 +25,10 @@ import meme4Small from "/src/assets/meme-4-small.png";
<span class="float-right mt-16 w-[300px] space-y-10 mr-5"> <span class="float-right mt-16 w-[300px] space-y-10 mr-5">
<h3 class="font-display text-6xl">Web1</h3> <h3 class="font-display text-6xl">Web1</h3>
<p class="font-body text-2xl text-body"> <p class="font-body text-2xl text-body">
Nostalgically recalled for chat rooms and IRC by tech enthusiasts, Web1 is probably best remembered by geeks as chat rooms and IRC (which
signifies the era of integrated services like AOL dial-up, providing still exist to this day, but only to power users). To normal users it
web access, email, shopping, and chat for mainstream users. was the age of AOL dial-up and similar networks where you got web,
email, shopping, and chat all in one place.
</p> </p>
</span> </span>
</div> </div>
@ -37,14 +38,25 @@ import meme4Small from "/src/assets/meme-4-small.png";
alt="" alt=""
class="absolute bottom-0 -left-[110px] object-contain xl:-left-5 float-left" class="absolute bottom-0 -left-[110px] object-contain xl:-left-5 float-left"
/> />
<span class="float-right mt-16 w-[300px] space-y-10 mr-5"> <span
class="float-right mt-16 w-[300px] space-y-10 mr-5 overflow-y-auto max-h-[400px]"
>
<h3 class="font-display text-6xl">Web2</h3> <h3 class="font-display text-6xl">Web2</h3>
<p class="font-body text-2xl text-body"> <p class="font-body text-body text-2xl">
Featuring improved gaming, online apps, and video streaming, was Web2 since evolved with the web browser and we got better gaming,
swiftly monopolized by Silicon Valley, creating a top-down system online apps, video streaming and calling and much, much more. However,
controlled by a few tech elites. Despite innovations, this system, it also got quickly captured by Silicon Valley and what some refer to
including the broader internet infrastructure like ISPs and domains, as the "tech bros".
regulates your web experience, often citing "safety". </p>
<p class="font-body text-body text-2xl">
So <i>despite</i> the innovation that occurred, it has turned into a top-down
system where only a few geeks/CEO's and their investors control your entire
web.
</p>
<p class="font-body text-body text-2xl">
This also excludes the wider internet infrastructure of domains and
ISP's (internet providers and hosting), who also play a part in
controlling your web, be it for your "safety", or other reasons.
</p> </p>
</span> </span>
</div> </div>
@ -52,37 +64,70 @@ import meme4Small from "/src/assets/meme-4-small.png";
<div <div
class="hidden lg:flex flex-1 flex-row w-full divide-x divide-dark-aquamarine" class="hidden lg:flex flex-1 flex-row w-full divide-x divide-dark-aquamarine"
> >
<div class="relative flex-1"> <div class="relative flex-1 overflow-hidden">
<img <img
src={meme3.src} src={meme3.src}
alt="" alt=""
class="absolute bottom-0 -left-[110px] xl:-left-5 float-left" class="absolute bottom-0 -left-[110px] xl:-left-5 float-left object-contain"
/> />
<span class="float-right mt-16 w-[300px] space-y-10 mr-1 xl:mr-5"> <span
class="float-right mt-16 w-[300px] space-y-10 mr-1 xl:mr-5 overflow-y-auto max-h-[400px]"
>
<h3 class="font-display text-6xl">Crypto/<br />DeFi</h3> <h3 class="font-display text-6xl">Crypto/<br />DeFi</h3>
<p class="font-body text-2xl text-body"> <p class="font-body text-2xl text-body">
The advent of Bitcoin sparked innovation, but over time, We get the birth of Bitcoin and all of the innovation that followed.
centralization increased. Factors such as the influx of big money, While BTC and a handful of other chains have remained decentralized
greed, hype, and FOMO contributed to this trend. The introduction of both in operation, and access, the innovation over time has caused
many money legos worsened the situation, leading to boom and bust things to re-centralize.
cycles. </p>
<p class="font-body text-2xl text-body">
This is due to several factors including big money coming in, pushing
greed, hype, and "FOMO". The invention of several new logos's causing
this to only get worse, creating a classic "boom" and "bust". Human
nature tends to be greedy, so over time, money overrode principles.
</p>
<p class="font-body text-2xl text-body">
Many development teams prioritized inventing new ideas and "shipping"
them to users, while selling them "tokens" to exit at their expense,
all while knowing none of what they created was <i
>truly decentralized</i
>.
</p>
<p class="font-body text-2xl text-body">
It became one large crypto casino.
</p> </p>
</span> </span>
</div> </div>
<div class="relative flex-1 max-w-full overflow-hidden"> <div class="relative flex-1 overflow-hidden">
<img <img
src={meme4.src} src={meme4.src}
alt="" alt=""
class="absolute bottom-0 -left-[110px] object-contain xl:-left-5 float-left" class="absolute bottom-0 -left-[110px] object-contain xl:-left-5 float-left"
/> />
<span class="float-right mt-16 w-[300px] space-y-10 mr-1 xl:mr-5"> <span
class="float-right mt-16 w-[300px] space-y-10 mr-1 xl:mr-5 overflow-y-auto max-h-[400px]"
>
<h3 class="font-display text-6xl">Web3</h3> <h3 class="font-display text-6xl">Web3</h3>
<p class="font-body text-2xl text-body"> <p class="font-body text-2xl text-body">
Web3 emerged as a buzzword to replace DeFi, but its meaning varies. What to say about Web3? Honestly... upfront it appeared to get used as
Despite aiming for decentralization, Web3 relies on centralized a new buzz word to replace "DeFi". Terms like "Web3" and "Metaverse"
crypto/DeFi infrastructure. Money dominates over ideology, driven by have many different meanings to many people. It is intended to include
funders. A balance is necessary between free markets and public goods more than just money and trading, and yet every blockchain-based
to address the current imbalance. system that can be labeled "web3" still builds onto of the same
centralized crypto/defi infrastructure.
</p>
<p class="font-body text-2xl text-body">
The end result is an ecosystem that promotes and <b><i>wants</i></b> to
be decentralized, but where money overrules ideology, ethos, and principles.
This is in part due to who's bankrolling it all, and thus the incentives
to build make it more about the money then about freedom.
</p>
<p class="font-body text-2xl text-body">
There needs to be a balance here between free markets/money and public
goods/infra, and so far things are way out of wack and need to be
fixed.
</p> </p>
</span> </span>
</div> </div>
@ -93,41 +138,76 @@ import meme4Small from "/src/assets/meme-4-small.png";
<div class="lg:hidden flex flex-col gap-8 py-10 px-8"> <div class="lg:hidden flex flex-col gap-8 py-10 px-8">
<h3 class="font-display text-3xl">Web1</h3> <h3 class="font-display text-3xl">Web1</h3>
<p class="font-body text-body text-xl"> <p class="font-body text-body text-xl">
Nostalgically recalled for chat rooms and IRC by tech enthusiasts, Web1 is probably best remembered by geeks as chat rooms and IRC (which
signifies the era of integrated services like AOL dial-up, providing web still exist to this day, but only to power users). To normal users it was
access, email, shopping, and chat for mainstream users. the age of AOL dial-up and similar networks where you got web, email,
shopping, and chat all in one place..
</p> </p>
<img src={meme1Small.src} class="-mb-10 w-60 self-center" /> <img src={meme1Small.src} class="-mb-10 w-60 self-center" />
</div> </div>
<div class="lg:hidden flex flex-col gap-8 py-10 px-8"> <div class="lg:hidden flex flex-col gap-8 py-10 px-8">
<h3 class="font-display text-3xl">Web2</h3> <h3 class="font-display text-3xl">Web2</h3>
<p class="font-body text-body text-xl"> <p class="font-body text-body text-xl">
Featuring improved gaming, online apps, and video streaming, was swiftly Web2 since evolved with the web browser and we got better gaming, online
monopolized by Silicon Valley, creating a top-down system controlled by a apps, video streaming and calling and much, much more. However, it also
few tech elites. Despite innovations, this system, including the broader got quickly captured by Silicon Valley and what some refer to as the "tech
internet infrastructure like ISPs and domains, regulates your web bros".
experience, often citing "safety". </p>
<p class="font-body text-body text-xl">
So <i>despite</i> the innovation that occurred, it has turned into a top-down
system where only a few geeks/CEO's and their investors control your entire
web.
</p>
<p class="font-body text-body text-xl">
This also excludes the wider internet infrastructure of domains and ISP's
(internet providers and hosting), who also play a part in controlling your
web, be it for your "safety", or other reasons.
</p> </p>
<img src={meme2Small.src} class="-mb-10 w-60 self-center" /> <img src={meme2Small.src} class="-mb-10 w-60 self-center" />
</div> </div>
<div class="lg:hidden flex flex-col gap-8 py-10 px-8"> <div class="lg:hidden flex flex-col gap-8 py-10 px-8">
<h3 class="font-display text-3xl">Crypto/DeFi</h3> <h3 class="font-display text-3xl">Crypto/DeFi</h3>
<p class="font-body text-body text-xl"> <p class="font-body text-body text-xl">
The advent of Bitcoin sparked innovation, but over time, centralization We get the birth of Bitcoin and all of the innovation that followed. While
increased. Factors such as the influx of big money, greed, hype, and FOMO BTC and a handful of other chains have remained decentralized both in
contributed to this trend. The introduction of many money legos worsened operation, and access, the innovation over time has caused things to
the situation, leading to boom and bust cycles. re-centralize.
</p>
<p class="font-body text-body text-xl">
This is due to several factors including big money coming in, pushing
greed, hype, and "FOMO". The invention of several new logos's causing this
to only get worse, creating a classic "boom" and "bust". Human nature
tends to be greedy, so over time, money overrode principles.
</p>
<p class="font-body text-body text-xl">
Many development teams prioritized inventing new ideas and "shipping" them
to users, while selling them "tokens" to exit at their expense, all while
knowing none of what they created was <i>truly decentralized</i>.
</p>
<p class="font-body text-body text-xl">
It became one large crypto casino.
</p> </p>
<img src={meme3Small.src} class="-mb-10 w-60 self-center" /> <img src={meme3Small.src} class="-mb-10 w-60 self-center" />
</div> </div>
<div class="lg:hidden flex flex-col gap-8 py-10 px-8"> <div class="lg:hidden flex flex-col gap-8 py-10 px-8">
<h3 class="font-display text-3xl">Web3</h3> <h3 class="font-display text-3xl">Web3</h3>
<p class="font-body text-body text-xl"> <p class="font-body text-xl text-body">
Web3 emerged as a buzzword to replace DeFi, but its meaning varies. What to say about Web3? Honestly... upfront it appeared to get used as a
Despite aiming for decentralization, Web3 relies on centralized new buzz word to replace "DeFi". Terms like "Web3" and "Metaverse" have
crypto/DeFi infrastructure. Money dominates over ideology, driven by many different meanings to many people. It is intended to include more
funders. A balance is necessary between free markets and public goods to than just money and trading, and yet every blockchain-based system that
address the current imbalance. can be labeled "web3" still builds onto of the same centralized
crypto/defi infrastructure.
</p>
<p class="font-body text-xl text-body">
The end result is an ecosystem that promotes and <b><i>wants</i></b> to be
decentralized, but where money overrules ideology, ethos, and principles. This
is in part due to who's bankrolling it all, and thus the incentives to build
make it more about the money then about freedom.
</p>
<p class="font-body text-xl text-body">
There needs to be a balance here between free markets/money and public
goods/infra, and so far things are way out of wack and need to be fixed.
</p> </p>
<img src={meme4Small.src} class="-mb-10 w-60 self-center" /> <img src={meme4Small.src} class="-mb-10 w-60 self-center" />
</div> </div>

View File

@ -1,63 +1,79 @@
--- ---
import "./Footer.scss";
import logo from "/src/assets/lume-logo.png"; import logo from "/src/assets/lume-logo.png";
--- ---
<footer> <footer class="flex flex-row py-24 font-body mb-3 mx-40">
<div> <div class="flex-1">
<div class="footer-logo">
<a href="/"> <a href="/">
<img src={logo.src} alt="Lume"> <img src={logo.src} class="w-36 mb-2" alt="Lume" />
</a> </a>
</div> <a
<div class="footer-contact"> href="mailto:contact@lumeweb.com"
<a href="mailto:contact@lumeweb.com"> class="flex flex-row items-center text-body text-xl"
<svg fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" xmlns="http://www.w3.org/2000/svg"> >
<path stroke-linecap="round" stroke-linejoin="round" d="M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75"> <svg
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
class="w-4 h-4 mr-2"
xmlns="http://www.w3.org/2000/svg"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75"
>
</path>
</svg> </svg>
contact@lumeweb.com contact@lumeweb.com
</a> </a>
<div class="text-lg text-primary font-bold font-display mt-10">
Freedom. Privacy. <br />Ownership.
</div> </div>
<div class="footer-phrase">Freedom. Privacy. Ownership.</div>
</div> </div>
<div> <div class="flex-1">
<h5>General</h5> <h5 class="text-3xl mb-3">General</h5>
<ul> <ul class="text-body font-body text-xl">
<li> <li>
<a href="/">Home</a> <a href="/" class="hover:underline">Home</a>
</li> </li>
<li> <li>
<a href="https://git.lumeweb.com">Git</a> <a href="https://git.lumeweb.com" class="hover:underline">Git</a>
</li> </li>
</ul> </ul>
</div> </div>
<div> <div class="flex-1">
<h5>Community</h5> <h5 class="text-3xl mb-3">Community</h5>
<ul> <ul class="text-body font-body text-xl">
<li> <li>
<a href="https://github.com/LumeWeb">GitHub</a> <a href="https://github.com/LumeWeb" class="hover:underline">GitHub</a>
</li> </li>
<li> <li>
<a href="https://discord.gg/qpC8ADp3rS">Discord</a> <a href="https://discord.gg/qpC8ADp3rS" class="hover:underline"
>Discord</a
>
</li> </li>
<li> <li>
<a href="https://twitter.com/lumeweb3">Twitter</a> <a href="https://twitter.com/lumeweb3" class="hover:underline"
>Twitter</a
>
</li> </li>
</ul> </ul>
</div> </div>
<div> <div class="flex-1">
<h5>Ecosystem</h5> <h5 class="text-3xl mb-3">Ecosystem</h5>
<ul> <ul class="text-body font-body text-xl">
<li> <li>
<a href="https://web3extension.io">Extension</a> <a href="https://web3extension.io" class="hover:underline">Extension</a>
</li> </li>
</ul> </ul>
</div> </div>
<div> <div class="flex-1">
<h5>Support Us</h5> <h5 class="text-3xl mb-3">Support Us</h5>
<ul> <ul class="text-body font-body text-xl">
<li> <li>
<a href="/donate">Donate</a> <a href="/donate" class="hover:underline">Donate</a>
</li> </li>
</ul> </ul>
</div> </div>

View File

@ -1,132 +0,0 @@
@import "/src/styles/mixins.scss";
@import "/src/styles/vars.scss";
footer {
display: flex;
gap: 2%;
padding: 7em 7.5% 8em;
font-family: $font-family-jaldi;
@include fluid-font-size(0.625rem);
background: $color-blue-charcoal;
> div {
flex-basis: 0;
flex-grow: 1;
@include fluid-font-size(1.375rem);
&:first-child {
flex-grow: 1.5 !important;
display: flex;
flex-direction: column;
}
}
img {
@include fluid-width(8.4375rem);
}
a:hover {
color: $color-white;
}
h5 {
@include fluid-font-size(1.75rem);
line-height: 100%;
white-space: nowrap;
margin: 0.3em 0;
}
li {
line-height: 138%;
color: $color-cloud;
list-style-type: none;
white-space: nowrap;
}
}
.footer-logo {
a {
display: inline-block;
}
}
.footer-contact {
margin: auto 0;
color: $color-cloud;
a {
display: inline-flex;
align-items: center;
}
svg {
@include fluid-width-height(1.375rem, 1.375rem);
margin-right: 0.5em;
}
}
.footer-phrase {
margin: auto 0 0;
font-family: $font-family-jetbrains-mono;
font-weight: 700;
line-height: 133%;
color: $color-aquamarine;
}
@media screen and (min-width: 48rem) and (max-width: 64rem) {
footer {
flex-wrap: wrap;
> div:first-child {
order: 1;
flex: 0 0 100%;
margin-top: 3%;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
}
.footer-contact {
margin: 0;
}
.footer-phrase {
margin: 0;
}
}
@media screen and (max-width: 47.99999rem) {
footer {
flex-direction: column;
padding-top: 1.5rem;
padding-bottom: 5rem;
text-align: center;
> div {
margin-top: 2rem;
font-size: 1.25rem;
}
> div:first-child {
margin-top: 4rem;
order: 2;
}
img {
width: 8.4375rem;
}
h5 {
font-size: 1.625rem;
}
}
.footer-contact {
margin: 1.25rem 0;
a {
justify-content: center;
}
}
}