Merge branch 'develop'

This commit is contained in:
Derrick Hammer 2023-08-13 15:03:58 -04:00
commit fc0c1a6dd5
Signed by: pcfreak30
GPG Key ID: C997C339BE476FF2
21 changed files with 14060 additions and 373 deletions

View File

@ -11,6 +11,12 @@ on:
jobs: jobs:
build: build:
runs-on: ubuntu-latest runs-on: ubuntu-latest
env:
RCLONE_CONFIG_S3_TYPE: s3
RCLONE_CONFIG_S3_PROVIDER: Cloudflare
RCLONE_CONFIG_S3_ACCESS_KEY_ID: ${{ secrets.S3_ACCESS_KEY }}
RCLONE_CONFIG_S3_SECRET_ACCESS_KEY: ${{ secrets.S3_SECRET_KEY }}
RCLONE_CONFIG_S3_ENDPOINT: ${{ secrets.CF_ACCOUNT_ID }}.r2.cloudflarestorage.com
steps: steps:
- uses: actions/checkout@v3 - uses: actions/checkout@v3
- name: Use Node.js - name: Use Node.js
@ -32,7 +38,6 @@ jobs:
env: env:
NPM_TOKEN: ${{ secrets.NPM_TOKEN }} NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
- name: Clean Up Robots Dev - name: Clean Up Robots Dev
if: ${{ github.ref_name == 'develop' }} if: ${{ github.ref_name == 'develop' }}
run: mv dist/robots-dev.txt dist/robots.txt run: mv dist/robots-dev.txt dist/robots.txt
@ -41,19 +46,15 @@ jobs:
if: ${{ github.ref_name == 'master' }} if: ${{ github.ref_name == 'master' }}
run: rm dist/robots-dev.txt run: rm dist/robots-dev.txt
- name: Set up S3CMD - name: Setup RClone
uses: s3-actions/s3cmd@v1.5.0 run: curl https://rclone.org/install.sh | sudo bash -s
with:
provider: cloudflare
account_id: ${{ secrets.CF_ACCOUNT_ID }}
access_key: ${{ secrets.S3_ACCESS_KEY }}
secret_key: ${{ secrets.S3_SECRET_KEY }}
- name: Publish to S3 Dev - name: Publish to S3 Dev
if: ${{ github.ref_name == 'develop' }} if: ${{ github.ref_name == 'develop' }}
run: sync "dist/" s3://${{ vars.S3_BUCKET_DEV }}/" run: rclone sync dist/ s3:${{ vars.S3_BUCKET_DEV }}/
- name: Publish to S3 Prod - name: Publish to S3 Prod
if: ${{ github.ref_name == 'master' }} if: ${{ github.ref_name == 'master' }}
run: sync "dist/" s3://${{ vars.S3_BUCKET }}/" run: rclone sync dist/ s3:${{ vars.S3_BUCKET }}/
- name: Setup tmate session - name: Setup tmate session
uses: mxschmitt/action-tmate@v3 uses: mxschmitt/action-tmate@v3
if: ${{ github.event_name == 'workflow_dispatch' && inputs.debug_enabled && failure() }} if: ${{ github.event_name == 'workflow_dispatch' && inputs.debug_enabled && failure() }}

74
CHANGELOG.md Normal file
View File

@ -0,0 +1,74 @@
# [0.1.0-develop.8](https://git.lumeweb.com/LumeWeb/lumeweb.com/compare/v0.1.0-develop.7...v0.1.0-develop.8) (2023-08-13)
### Bug Fixes
* contrast on 'ourvision' section ([2ec5873](https://git.lumeweb.com/LumeWeb/lumeweb.com/commit/2ec58730439533d5dbe329ae9a5def22c0c67566))
# [0.1.0-develop.7](https://git.lumeweb.com/LumeWeb/lumeweb.com/compare/v0.1.0-develop.6...v0.1.0-develop.7) (2023-08-13)
### Bug Fixes
* mobile layout on footer and message component ([5a8b20b](https://git.lumeweb.com/LumeWeb/lumeweb.com/commit/5a8b20b16e1493d4a6238acd81718f8b500c1ac4))
# [0.1.0-develop.6](https://git.lumeweb.com/LumeWeb/lumeweb.com/compare/v0.1.0-develop.5...v0.1.0-develop.6) (2023-08-13)
### Bug Fixes
* set url for download extension button ([fa8993b](https://git.lumeweb.com/LumeWeb/lumeweb.com/commit/fa8993b2bd422cbc2bc09c467dbc1749a8a921bb))
# [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)
### Bug Fixes
* bg image invalid, and update name ([a8bbcc1](https://git.lumeweb.com/LumeWeb/lumeweb.com/commit/a8bbcc19ec87ed09fb26512651deb7b5a4d1a098))
* grammer error ([432be86](https://git.lumeweb.com/LumeWeb/lumeweb.com/commit/432be86cc584543c560581936d63714db5037849))
* responsive is now all over the page :) ([7c48975](https://git.lumeweb.com/LumeWeb/lumeweb.com/commit/7c48975f79720b88131c27a7559120597a4e3f5c))
* small improvement on 4k screens ([0bba290](https://git.lumeweb.com/LumeWeb/lumeweb.com/commit/0bba290f286b9f54a6b3e14c4c5e1d516f44dcf9))
* switch to experimental image support and import missing images ([cd278e3](https://git.lumeweb.com/LumeWeb/lumeweb.com/commit/cd278e3a466b59df6946634142aa17016b4024ff))
* typo ([26b3f5f](https://git.lumeweb.com/LumeWeb/lumeweb.com/commit/26b3f5f8788151a06dbcf83bb848918ccaf8d067))
### Features
* copy to clipboard, qr code generation, further donation methods ([20a99a6](https://git.lumeweb.com/LumeWeb/lumeweb.com/commit/20a99a65d85fd55526ff0e3bee382794f7e528f5))
* create two remaining components, optimize layout and existing components (wip) ([b6f8d56](https://git.lumeweb.com/LumeWeb/lumeweb.com/commit/b6f8d567baaf5a6d0358e1dcb0de39ad081f32f0))
* finish all new design implementations ([486bc6a](https://git.lumeweb.com/LumeWeb/lumeweb.com/commit/486bc6ae7278e66aa2cd6f9d3e5c2df491d21960))
* local fonts ([b52911c](https://git.lumeweb.com/LumeWeb/lumeweb.com/commit/b52911cb51d2b3a4169da07a80ab39b9503492cf))
* meme grid is now responsive ([3552e8b](https://git.lumeweb.com/LumeWeb/lumeweb.com/commit/3552e8bb845d154a833a7e37ee30b2135e03bd79))
* mobile menu, css cleanup, component details ([0c6391e](https://git.lumeweb.com/LumeWeb/lumeweb.com/commit/0c6391e3a13e62f2c93035e8dd82577b63b42fd6))
* pure css tilted background ([05eb109](https://git.lumeweb.com/LumeWeb/lumeweb.com/commit/05eb1099386f3cdf1f300a82d6bb2eee4c60f861))
* rework several sections on home page, some refactoring ([4935177](https://git.lumeweb.com/LumeWeb/lumeweb.com/commit/4935177908f9411de0999048367cc384592f198a))
* sass support, mixins for fluid design, refactoring, work on components ([9701291](https://git.lumeweb.com/LumeWeb/lumeweb.com/commit/97012911aab8659d0ddb268a9bc54d72e1c37b6f))
* svg icons, donation methods ([63e0c57](https://git.lumeweb.com/LumeWeb/lumeweb.com/commit/63e0c57b0329f76609f6d9a55a37585dfce7f45d))

202
LICENSE.txt Normal file
View File

@ -0,0 +1,202 @@
Apache License
Version 2.0, January 2004
http://www.apache.org/licenses/
TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
1. Definitions.
"License" shall mean the terms and conditions for use, reproduction,
and distribution as defined by Sections 1 through 9 of this document.
"Licensor" shall mean the copyright owner or entity authorized by
the copyright owner that is granting the License.
"Legal Entity" shall mean the union of the acting entity and all
other entities that control, are controlled by, or are under common
control with that entity. For the purposes of this definition,
"control" means (i) the power, direct or indirect, to cause the
direction or management of such entity, whether by contract or
otherwise, or (ii) ownership of fifty percent (50%) or more of the
outstanding shares, or (iii) beneficial ownership of such entity.
"You" (or "Your") shall mean an individual or Legal Entity
exercising permissions granted by this License.
"Source" form shall mean the preferred form for making modifications,
including but not limited to software source code, documentation
source, and configuration files.
"Object" form shall mean any form resulting from mechanical
transformation or translation of a Source form, including but
not limited to compiled object code, generated documentation,
and conversions to other media types.
"Work" shall mean the work of authorship, whether in Source or
Object form, made available under the License, as indicated by a
copyright notice that is included in or attached to the work
(an example is provided in the Appendix below).
"Derivative Works" shall mean any work, whether in Source or Object
form, that is based on (or derived from) the Work and for which the
editorial revisions, annotations, elaborations, or other modifications
represent, as a whole, an original work of authorship. For the purposes
of this License, Derivative Works shall not include works that remain
separable from, or merely link (or bind by name) to the interfaces of,
the Work and Derivative Works thereof.
"Contribution" shall mean any work of authorship, including
the original version of the Work and any modifications or additions
to that Work or Derivative Works thereof, that is intentionally
submitted to Licensor for inclusion in the Work by the copyright owner
or by an individual or Legal Entity authorized to submit on behalf of
the copyright owner. For the purposes of this definition, "submitted"
means any form of electronic, verbal, or written communication sent
to the Licensor or its representatives, including but not limited to
communication on electronic mailing lists, source code control systems,
and issue tracking systems that are managed by, or on behalf of, the
Licensor for the purpose of discussing and improving the Work, but
excluding communication that is conspicuously marked or otherwise
designated in writing by the copyright owner as "Not a Contribution."
"Contributor" shall mean Licensor and any individual or Legal Entity
on behalf of whom a Contribution has been received by Licensor and
subsequently incorporated within the Work.
2. Grant of Copyright License. Subject to the terms and conditions of
this License, each Contributor hereby grants to You a perpetual,
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
copyright license to reproduce, prepare Derivative Works of,
publicly display, publicly perform, sublicense, and distribute the
Work and such Derivative Works in Source or Object form.
3. Grant of Patent License. Subject to the terms and conditions of
this License, each Contributor hereby grants to You a perpetual,
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
(except as stated in this section) patent license to make, have made,
use, offer to sell, sell, import, and otherwise transfer the Work,
where such license applies only to those patent claims licensable
by such Contributor that are necessarily infringed by their
Contribution(s) alone or by combination of their Contribution(s)
with the Work to which such Contribution(s) was submitted. If You
institute patent litigation against any entity (including a
cross-claim or counterclaim in a lawsuit) alleging that the Work
or a Contribution incorporated within the Work constitutes direct
or contributory patent infringement, then any patent licenses
granted to You under this License for that Work shall terminate
as of the date such litigation is filed.
4. Redistribution. You may reproduce and distribute copies of the
Work or Derivative Works thereof in any medium, with or without
modifications, and in Source or Object form, provided that You
meet the following conditions:
(a) You must give any other recipients of the Work or
Derivative Works a copy of this License; and
(b) You must cause any modified files to carry prominent notices
stating that You changed the files; and
(c) You must retain, in the Source form of any Derivative Works
that You distribute, all copyright, patent, trademark, and
attribution notices from the Source form of the Work,
excluding those notices that do not pertain to any part of
the Derivative Works; and
(d) If the Work includes a "NOTICE" text file as part of its
distribution, then any Derivative Works that You distribute must
include a readable copy of the attribution notices contained
within such NOTICE file, excluding those notices that do not
pertain to any part of the Derivative Works, in at least one
of the following places: within a NOTICE text file distributed
as part of the Derivative Works; within the Source form or
documentation, if provided along with the Derivative Works; or,
within a display generated by the Derivative Works, if and
wherever such third-party notices normally appear. The contents
of the NOTICE file are for informational purposes only and
do not modify the License. You may add Your own attribution
notices within Derivative Works that You distribute, alongside
or as an addendum to the NOTICE text from the Work, provided
that such additional attribution notices cannot be construed
as modifying the License.
You may add Your own copyright statement to Your modifications and
may provide additional or different license terms and conditions
for use, reproduction, or distribution of Your modifications, or
for any such Derivative Works as a whole, provided Your use,
reproduction, and distribution of the Work otherwise complies with
the conditions stated in this License.
5. Submission of Contributions. Unless You explicitly state otherwise,
any Contribution intentionally submitted for inclusion in the Work
by You to the Licensor shall be under the terms and conditions of
this License, without any additional terms or conditions.
Notwithstanding the above, nothing herein shall supersede or modify
the terms of any separate license agreement you may have executed
with Licensor regarding such Contributions.
6. Trademarks. This License does not grant permission to use the trade
names, trademarks, service marks, or product names of the Licensor,
except as required for reasonable and customary use in describing the
origin of the Work and reproducing the content of the NOTICE file.
7. Disclaimer of Warranty. Unless required by applicable law or
agreed to in writing, Licensor provides the Work (and each
Contributor provides its Contributions) on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
implied, including, without limitation, any warranties or conditions
of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
PARTICULAR PURPOSE. You are solely responsible for determining the
appropriateness of using or redistributing the Work and assume any
risks associated with Your exercise of permissions under this License.
8. Limitation of Liability. In no event and under no legal theory,
whether in tort (including negligence), contract, or otherwise,
unless required by applicable law (such as deliberate and grossly
negligent acts) or agreed to in writing, shall any Contributor be
liable to You for damages, including any direct, indirect, special,
incidental, or consequential damages of any character arising as a
result of this License or out of the use or inability to use the
Work (including but not limited to damages for loss of goodwill,
work stoppage, computer failure or malfunction, or any and all
other commercial damages or losses), even if such Contributor
has been advised of the possibility of such damages.
9. Accepting Warranty or Additional Liability. While redistributing
the Work or Derivative Works thereof, You may choose to offer,
and charge a fee for, acceptance of support, warranty, indemnity,
or other liability obligations and/or rights consistent with this
License. However, in accepting such obligations, You may act only
on Your own behalf and on Your sole responsibility, not on behalf
of any other Contributor, and only if You agree to indemnify,
defend, and hold each Contributor harmless for any liability
incurred by, or claims asserted against, such Contributor by reason
of your accepting any such warranty or additional liability.
END OF TERMS AND CONDITIONS
APPENDIX: How to apply the Apache License to your work.
To apply the Apache License to your work, attach the following
boilerplate notice, with the fields enclosed by brackets "[]"
replaced with your own identifying information. (Don't include
the brackets!) The text should be enclosed in the appropriate
comment syntax for the file format. We also recommend that a
file or class name and description of purpose be included on the
same "printed page" as the copyright notice for easier
identification within third-party archives.
Copyright 2023 Hammer Technologies LLC
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.

View File

@ -1,33 +1,4 @@
# Astro Starter Kit: Minimal # Lume Web Project Site
```
npm create astro@latest -- --template minimal
```
[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/withastro/astro/tree/latest/examples/minimal)
[![Open with CodeSandbox](https://assets.codesandbox.io/github/button-edit-lime.svg)](https://codesandbox.io/p/sandbox/github/withastro/astro/tree/latest/examples/minimal)
[![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/withastro/astro?devcontainer_path=.devcontainer/minimal/devcontainer.json)
> 🧑‍🚀 **Seasoned astronaut?** Delete this file. Have fun!
## 🚀 Project Structure
Inside of your Astro project, you'll see the following folders and files:
```
/
├── public/
├── src/
│ └── pages/
│ └── index.astro
└── package.json
```
Astro looks for `.astro` or `.md` files in the `src/pages/` directory. Each page is exposed as a route based on its file name.
There's nothing special about `src/components/`, but that's where we like to put any Astro/React/Vue/Svelte/Preact components.
Any static assets, like images, can be placed in the `public/` directory.
## 🧞 Commands ## 🧞 Commands
@ -41,7 +12,3 @@ All commands are run from the root of the project, from a terminal:
| `npm run preview` | Preview your build locally, before deploying | | `npm run preview` | Preview your build locally, before deploying |
| `npm run astro ...` | Run CLI commands like `astro add`, `astro check` | | `npm run astro ...` | Run CLI commands like `astro add`, `astro check` |
| `npm run astro -- --help` | Get help using the Astro CLI | | `npm run astro -- --help` | Get help using the Astro CLI |
## 👀 Want to learn more?
Feel free to check [our documentation](https://docs.astro.build) or jump into our [Discord server](https://astro.build/chat).

View File

@ -1,9 +1,11 @@
import { defineConfig } from 'astro/config'; import { defineConfig } from 'astro/config'
import tailwind from '@astrojs/tailwind'; import tailwind from '@astrojs/tailwind'
import react from '@astrojs/react'; import react from '@astrojs/react'
import image from '@astrojs/image';
// https://astro.build/config // https://astro.build/config
export default defineConfig({ export default defineConfig({
integrations: [tailwind({ config: { applyBaseStyles: false } }), image(), react()], integrations: [tailwind({ config: { applyBaseStyles: false } }), react()],
}); experimental: {
assets: true
}
})

13523
npm-shrinkwrap.json generated Normal file

File diff suppressed because it is too large Load Diff

View File

@ -1,17 +1,21 @@
{ {
"name": "lume-web", "name": "@lumeweb/lumeweb.com",
"type": "module", "type": "module",
"version": "0.0.1", "version": "0.1.0-develop.8",
"private": true, "private": true,
"repository": {
"type": "git",
"url": "gitea@git.lumeweb.com:LumeWeb/lumeweb.com.git"
},
"scripts": { "scripts": {
"dev": "TAILWIND_MODE=watch astro dev", "dev": "TAILWIND_MODE=watch astro dev",
"start": "astro dev", "start": "astro dev",
"build": "astro build", "build": "astro build",
"preview": "astro preview", "preview": "astro preview",
"astro": "astro" "astro": "astro",
"semantic-release": "semantic-release"
}, },
"dependencies": { "dependencies": {
"@astrojs/image": "^0.16.6",
"@astrojs/react": "^2.1.1", "@astrojs/react": "^2.1.1",
"@astrojs/tailwind": "^3.1.1", "@astrojs/tailwind": "^3.1.1",
"@types/react": "^18.2.0", "@types/react": "^18.2.0",

View File

Before

Width:  |  Height:  |  Size: 327 KiB

After

Width:  |  Height:  |  Size: 327 KiB

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 internet 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 entralized.
</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,17 @@
--- ---
import './Message.scss';
--- ---
<section id="message"> <section
<h2> id="message"
class="bg-primary py-16 px-10 md:px-20 xl:px-40 space-y-4"
>
<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

@ -1,11 +1,12 @@
--- ---
import bg from "../../../assets/home-hero-bg.webp"
import TypewriterContent from "./TypewriterContent.jsx"; import TypewriterContent from "./TypewriterContent.jsx";
--- ---
<div class="absolute -z-10 -right-[250px] top-[250px] w-[1250px]"> <div class="absolute -z-10 -right-[250px] top-[250px] w-[1250px]">
<img <img
class="object-contain w-[1250px]" class="object-contain w-[1250px]"
src="/src/assets/video-placeholder.webp" src={bg.src}
/> />
</div> </div>

View File

@ -1,17 +1,21 @@
<section <section
id="vision" id="vision"
class="bg-black/40 p-5 lg:bg-transparent lg:p-0 space-y-10 mx-10 sm:mx-20 xl:mx-40" class="bg-black/40 p-5 lg:p-0 space-y-10 mx-10 sm:mx-20 xl:mx-40"
> >
<h2 class="font-display text-primary font-bold text-xl md:text-2xl uppercase"> <h2 class="font-display text-primary font-bold text-xl md:text-2xl uppercase">
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,9 +1,13 @@
---
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"
> >
<div class="flex-1 -ml-10 -mr-20 lg:-ml-40 lg:mr-0"> <div class="flex-1 -ml-10 -mr-20 lg:-ml-40 lg:mr-0">
<img src="/src/assets/home-gfx-left.png" class="w-full" /> <img src={gfxLeft.src} class="w-full" />
</div> </div>
<div class="flex-1 -mt-40 space-y-10 flex flex-col justify-center"> <div class="flex-1 -mt-40 space-y-10 flex flex-col justify-center">
<h2 <h2
@ -15,9 +19,15 @@
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

@ -37,7 +37,9 @@ 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-2xl text-body">
Featuring improved gaming, online apps, and video streaming, was Featuring improved gaming, online apps, and video streaming, was
@ -52,13 +54,15 @@ 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, The advent of Bitcoin sparked innovation, but over time,
@ -69,13 +73,15 @@ import meme4Small from "/src/assets/meme-4-small.png";
</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. Web3 emerged as a buzzword to replace DeFi, but its meaning varies.
@ -93,41 +99,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,98 +1,81 @@
--- ---
import "./Footer.scss";
import logo from "/src/assets/lume-logo.png"; import logo from "/src/assets/lume-logo.png";
--- ---
<footer> <footer
<div> class="flex flex-col lg:flex-row py-24 font-body mb-3 mx-10 md:mx-20 xl:mx-40 max-w-screen"
<div class="footer-logo"> >
<div class="flex-1">
<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 my-10">
Freedom. Privacy. <br />Ownership.
</div> </div>
<div class="footer-phrase">Freedom. Privacy. Ownership.</div>
</div> </div>
<div> <div class="flex-1 my-5 lg:my-0">
<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="#">Get Started</a> <a href="https://git.lumeweb.com" class="hover:underline">Git</a>
</li>
<li>
<a href="#">Documentation</a>
</li>
<li>
<a href="#">Projects</a>
</li> </li>
</ul> </ul>
</div> </div>
<div> <div class="flex-1 my-5 lg:my-0">
<h5>Community</h5> <h5 class="text-3xl mb-3">Community</h5>
<ul> <ul class="text-body font-body text-xl">
<li> <li>
<a href="#">GitHub</a> <a href="https://github.com/LumeWeb" class="hover:underline">GitHub</a>
</li> </li>
<li> <li>
<a href="#">Discord</a> <a href="https://discord.gg/qpC8ADp3rS" class="hover:underline"
>Discord</a
>
</li> </li>
<li> <li>
<a href="#">Twitter</a> <a href="https://twitter.com/lumeweb3" class="hover:underline"
</li> >Twitter</a
<li> >
<a href="#">Facebook</a>
</li> </li>
</ul> </ul>
</div> </div>
<div> <div class="flex-1 my-5 lg:my-0">
<h5>Ecosystem</h5> <h5 class="text-3xl mb-3">Ecosystem</h5>
<ul> <ul class="text-body font-body text-xl">
<li> <li>
<a href="#">Browser</a> <a href="https://web3extension.io" class="hover:underline">Extension</a>
</li>
<li>
<a href="#">Extension</a>
</li>
<li>
<a href="#">Universal Storage</a>
</li> </li>
</ul> </ul>
</div> </div>
<div> <div class="flex-1 my-5 lg:my-0">
<h5>Other</h5> <h5 class="text-3xl mb-3">Support Us</h5>
<ul> <ul class="text-body font-body text-xl">
<li> <li>
<a href="#">Browser</a> <a href="/donate" class="hover:underline">Donate</a>
</li>
<li>
<a href="#">Extension</a>
</li>
<li>
<a href="#">Universal Storage</a>
</li>
</ul>
</div>
<div>
<h5>Support Us</h5>
<ul>
<li>
<a href="/donate">Donate</a>
</li>
<li>
<a href="#">Download App</a>
</li>
<li>
<a href="#">Partnerships</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;
}
}
}

View File

@ -1,4 +1,5 @@
--- ---
import logo from "../../../assets/lume-logo.png";
const { view } = Astro.props; const { view } = Astro.props;
function getActiveClass(linkView) { function getActiveClass(linkView) {
@ -10,7 +11,7 @@ function getActiveClass(linkView) {
<div class="logo"> <div class="logo">
<!-- TODO: Hide this logo and show simplified when 320 > width --> <!-- TODO: Hide this logo and show simplified when 320 > width -->
<a href="/"> <a href="/">
<img class="w-44" src="/src/assets/lume-logo.png" alt="Lume Logo" /> <img class="w-44" src={logo.src} alt="Lume Logo" />
</a> </a>
</div> </div>
<menu <menu
@ -30,7 +31,7 @@ function getActiveClass(linkView) {
</li> </li>
<li> <li>
<a <a
href="#" href="https://web3extension.io"
class="text-md rounded-md bg-primary py-3 px-10 mt-14 text-[black] font-body" class="text-md rounded-md bg-primary py-3 px-10 mt-14 text-[black] font-body"
>Download Extension</a >Download Extension</a
> >
@ -41,7 +42,34 @@ function getActiveClass(linkView) {
class="hidden lg:hidden bg-black/40 w-screen h-screen fixed z-10 top-0 botton-0 right-0 left-0" class="hidden lg:hidden bg-black/40 w-screen h-screen fixed z-10 top-0 botton-0 right-0 left-0"
> >
</div> </div>
<button id="hamburger" class="z-30 text-4xl lg:hidden">☰</button> <button id="hamburger" class="z-30 text-4xl lg:hidden">
<svg
width="24"
height="24"
viewBox="0 0 52 43"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M1 1.06787H51.295"
stroke="white"
stroke-width="1.28"
stroke-linecap="round"
stroke-linejoin="round"></path>
<path
d="M1 21.5728H51.295"
stroke="white"
stroke-width="1.28"
stroke-linecap="round"
stroke-linejoin="round"></path>
<path
d="M1 42.0776H51.295"
stroke="white"
stroke-width="1.28"
stroke-linecap="round"
stroke-linejoin="round"></path>
</svg>
</button>
<script> <script>
const navbarOverlayEl = document.getElementById("navbar-overlay"); const navbarOverlayEl = document.getElementById("navbar-overlay");
const hamburgerEl = document.getElementById("hamburger"); const hamburgerEl = document.getElementById("hamburger");

View File

@ -23,9 +23,9 @@ const { view, title } = Astro.props;
/> />
<meta <meta
name="description" name="description"
content="Lume Web - Web3 for the masses | Install the Lume Web3 Extension and have a 1-click gateway into the Web3 internet on Opera, Vivaldi, Edge and Firefox." content="A platform, network and experience that allows you to control and own your online web, and access all of the possibilities Web3 has to offer. Join the open web."
/> />
<meta name="keywords" content="Web3 Extension, Lume Web, Web3" /> <meta name="keywords" content="Web3 Extension, web3 browser, Lume Web, Web3, dWeb, p2p, handshake, eth, ethereum, ipfs, open web, privacy, decentralization, blockchain" />
</head> </head>
<body class="max-w-[1600px] mx-auto"> <body class="max-w-[1600px] mx-auto">
<Navbar view={view} /> <Navbar view={view} />

View File

@ -11,7 +11,7 @@ import CTO from "../components/Home/CTO/CTO.astro";
import Message from "../components/Home/Message/Message.astro"; import Message from "../components/Home/Message/Message.astro";
--- ---
<Layout view="home" title="Lume Web - Web3 for the masses"> <Layout view="home" title="Lume Web - Your Open Web">
<Typewriter /> <Typewriter />
<Vision /> <Vision />
<Web3 /> <Web3 />