chore(release): 0.1.0-develop.1 [skip ci]

# [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](a8bbcc19ec)) * grammer error ([432be86](432be86cc5)) * responsive is now all over the page :) ([7c48975](7c48975f79)) * small improvement on 4k screens ([0bba290](0bba290f28)) * switch to experimental image support and import missing images ([cd278e3](cd278e3a46)) * typo ([26b3f5f](26b3f5f878)) ### Features * copy to clipboard, qr code generation, further donation methods ([20a99a6](20a99a65d8)) * create two remaining components, optimize layout and existing components (wip) ([b6f8d56](b6f8d567ba)) * finish all new design implementations ([486bc6a](486bc6ae72)) * local fonts ([b52911c](b52911cb51)) * meme grid is now responsive ([3552e8b](3552e8bb84)) * mobile menu, css cleanup, component details ([0c6391e](0c6391e3a1)) * pure css tilted background ([05eb109](05eb109938)) * rework several sections on home page, some refactoring ([4935177](4935177908)) * sass support, mixins for fluid design, refactoring, work on components ([9701291](97012911aa)) * svg icons, donation methods ([63e0c57](63e0c57b03))
refactor: update footer menu links
2023-08-13 04:41:10 +00:00 · 2023-08-13 00:39:01 -04:00 · 2023-08-13 00:23:41 -04:00 · 2023-08-13 00:07:12 -04:00 · 2023-08-12 22:43:51 -04:00 · 2023-08-12 21:59:20 -04:00
115 changed files with 16677 additions and 74 deletions
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@ -0,0 +1,62 @@
 name: Build/Publish
 on:
    push:
        branches:
            - master
            - develop
            - develop-*
    workflow_call:
 jobs:
    build:
        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:
            -   uses: actions/checkout@v3
            -   name: Use Node.js
                uses: actions/setup-node@v3
                with:
                    node-version: 18.x
                    cache: 'npm'
            -   run: npm ci
            -   run: npm run build --if-present
                env:
                    NODE_OPTIONS: "--max_old_space_size=4096"
            -   name: Install SSH key
                uses: shimataro/ssh-key-action@v2
                with:
                    key: ${{ secrets.GITEA_SSH_KEY }}
                    known_hosts: ${{ secrets.GITEA_KNOWN_HOST }}
            -   name: Publish
                run: npm run semantic-release
                env:
                    NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
            -   name: Clean Up Robots Dev
                if: ${{ github.ref_name == 'develop' }}
                run: mv dist/robots-dev.txt dist/robots.txt
            -   name: Clean Up Robots Prod
                if: ${{ github.ref_name == 'master' }}
                run: rm dist/robots-dev.txt
            -   name: Setup RClone
                run: curl https://rclone.org/install.sh | sudo bash -s
            -   name: Publish to S3 Dev
                if: ${{ github.ref_name == 'develop' }}
                run: rclone sync dist/ s3:${{ vars.S3_BUCKET_DEV }}/
            -   name: Publish to S3 Prod
                if: ${{ github.ref_name == 'master' }}
                run: rclone sync dist/ s3:${{ vars.S3_BUCKET }}/
            -   name: Setup tmate session
                uses: mxschmitt/action-tmate@v3
                if: ${{ github.event_name == 'workflow_dispatch' && inputs.debug_enabled && failure() }}
                with:
                    limit-access-to-actor: true
--- a/.gitignore
+++ b/.gitignore
@ -0,0 +1,2 @@
 node_modules
 dist
--- a/.releaserc.json
+++ b/.releaserc.json
@ -0,0 +1,73 @@
 {
    "plugins": [
        [
            "@semantic-release/commit-analyzer",
            {
                "releaseRules": [
                    {
                        "breaking": true,
                        "release": "major"
                    },
                    {
                        "revert": true,
                        "release": "patch"
                    },
                    {
                        "type": "feat",
                        "release": "minor"
                    },
                    {
                        "type": "fix",
                        "release": "patch"
                    },
                    {
                        "type": "perf",
                        "release": "patch"
                    },
                    {
                        "type": "dep",
                        "release": "patch"
                    },
                    {
                        "type": "refactor",
                        "release": "patch"
                    }
                ]
            }
        ],
        "@semantic-release/release-notes-generator",
        [
            "@semantic-release/changelog",
            {
                "changelogFile": "CHANGELOG.md"
            }
        ],
        [
            "@semantic-release/npm",
            {
                "npmPublish": false
            }
        ],
        [
            "@semantic-release/git",
            {
                "assets": [
                    "package.json",
                    "CHANGELOG.md",
                    "npm-shrinkwrap.json"
                ]
            }
        ]
    ],
    "branches": [
        "master",
        {
            "name": "develop",
            "prerelease": true
        },
        {
            "name": "develop-*",
            "prerelease": true
        }
    ]
 }
--- a/.stylelintrc.json
+++ b/.stylelintrc.json
@ -0,0 +1 @@
 { "extends": ["stylelint-config-standard"] }
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@ -0,0 +1,25 @@
 # [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))
--- a/73
+++ b/73
@ -1,73 +0,0 @@
 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 [yyyy] [name of copyright owner]
 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.
--- a/LICENSE.txt
+++ b/LICENSE.txt
@ -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.
--- a/README.md
+++ b/README.md
@ -1,2 +1,14 @@
-# lumeweb.com
+# Lume Web Project Site
 ## 🧞 Commands
 All commands are run from the root of the project, from a terminal:
 | Command                   | Action                                           |
 | :------------------------ | :----------------------------------------------- |
 | `npm install`             | Installs dependencies                            |
 | `npm run dev`             | Starts local dev server at `localhost:3000`      |
 | `npm run build`           | Build your production site to `./dist/`          |
 | `npm run preview`         | Preview your build locally, before deploying     |
 | `npm run astro ...`       | Run CLI commands like `astro add`, `astro check` |
 | `npm run astro -- --help` | Get help using the Astro CLI                     |
--- a/astro.config.mjs
+++ b/astro.config.mjs
@ -0,0 +1,11 @@
 import { defineConfig } from 'astro/config'
 import tailwind from '@astrojs/tailwind'
 import react from '@astrojs/react'
 // https://astro.build/config
 export default defineConfig({
    integrations: [tailwind({ config: { applyBaseStyles: false } }), react()],
    experimental: {
        assets: true
    }
 })
--- a/npm-shrinkwrap.json
+++ b/npm-shrinkwrap.json
--- a/package.json
+++ b/package.json
@ -0,0 +1,40 @@
 {
    "name": "@lumeweb/lumeweb.com",
    "type": "module",
    "version": "0.1.0-develop.1",
    "private": true,
    "repository": {
        "type": "git",
        "url": "gitea@git.lumeweb.com:LumeWeb/lumeweb.com.git"
    },
    "scripts": {
        "dev": "TAILWIND_MODE=watch astro dev",
        "start": "astro dev",
        "build": "astro build",
        "preview": "astro preview",
        "astro": "astro",
        "semantic-release": "semantic-release"
    },
    "dependencies": {
        "@astrojs/react": "^2.1.1",
        "@astrojs/tailwind": "^3.1.1",
        "@types/react": "^18.2.0",
        "astro": "^2.3.2",
        "autoprefixer": "^10.4.14",
        "qrcode": "^1.5.3",
        "react": "^18.2.0",
        "react-dom": "^18.2.0",
        "sass": "^1.62.1",
        "tailwindcss": "^3.3.2",
        "typewriter-effect": "^2.19.0"
    },
    "devDependencies": {
        "@semantic-release/changelog": "^6.0.3",
        "@semantic-release/git": "^10.0.1",
        "@semantic-release/npm": "^10.0.4",
        "@semantic-release/release-notes-generator": "^11.0.4",
        "semantic-release": "^21.0.7",
        "stylelint": "^15.6.0",
        "stylelint-config-standard": "^33.0.0"
    }
 }
--- a/postcss.config.cjs
+++ b/postcss.config.cjs
@ -0,0 +1,7 @@
 module.exports = {
  plugins: [
    require('tailwindcss/nesting'),
    require('tailwindcss'),
    require('autoprefixer')
  ]
 };
--- a/public/fonts/Jaldi-Regular.woff2
+++ b/public/fonts/Jaldi-Regular.woff2
--- a/public/fonts/JetBrainsMono-Bold.woff2
+++ b/public/fonts/JetBrainsMono-Bold.woff2
--- a/public/fonts/JetBrainsMono-Regular.woff2
+++ b/public/fonts/JetBrainsMono-Regular.woff2
--- a/public/fonts/ibm-plex-sans-devanagari.woff2
+++ b/public/fonts/ibm-plex-sans-devanagari.woff2
--- a/public/robots-dev.txt
+++ b/public/robots-dev.txt
@ -0,0 +1,2 @@
 User-Agent: *
 Disallow: /
--- a/public/robots.txt
+++ b/public/robots.txt
@ -0,0 +1,2 @@
 User-Agent: *
 Allow: /
--- a/src/assets/centralized-mullet-meme.png
+++ b/src/assets/centralized-mullet-meme.png
--- a/src/assets/contribute-bg.png
+++ b/src/assets/contribute-bg.png
--- a/src/assets/cto-avatar.png
+++ b/src/assets/cto-avatar.png
--- a/src/assets/donate-gfx-right.png
+++ b/src/assets/donate-gfx-right.png
--- a/src/assets/double-brand-bg.png
+++ b/src/assets/double-brand-bg.png
--- a/src/assets/home-gfx-left.png
+++ b/src/assets/home-gfx-left.png
--- a/src/assets/home-hero-bg.webp
+++ b/src/assets/home-hero-bg.webp
--- a/src/assets/icons/discord.svg
+++ b/src/assets/icons/discord.svg
@ -0,0 +1,3 @@
 <svg viewBox="0 0 127.14 96.36" xmlns="http://www.w3.org/2000/svg">
  <path fill="currentcolor" d="M107.7,8.07A105.15,105.15,0,0,0,81.47,0a72.06,72.06,0,0,0-3.36,6.83A97.68,97.68,0,0,0,49,6.83,72.37,72.37,0,0,0,45.64,0,105.89,105.89,0,0,0,19.39,8.09C2.79,32.65-1.71,56.6.54,80.21h0A105.73,105.73,0,0,0,32.71,96.36,77.7,77.7,0,0,0,39.6,85.25a68.42,68.42,0,0,1-10.85-5.18c.91-.66,1.8-1.34,2.66-2a75.57,75.57,0,0,0,64.32,0c.87.71,1.76,1.39,2.66,2a68.68,68.68,0,0,1-10.87,5.19,77,77,0,0,0,6.89,11.1A105.25,105.25,0,0,0,126.6,80.22h0C129.24,52.84,122.09,29.11,107.7,8.07ZM42.45,65.69C36.18,65.69,31,60,31,53s5-12.74,11.43-12.74S54,46,53.89,53,48.84,65.69,42.45,65.69Zm42.24,0C78.41,65.69,73.25,60,73.25,53s5-12.74,11.44-12.74S96.23,46,96.12,53,91.08,65.69,84.69,65.69Z"/>
 </svg>
--- a/src/assets/icons/git.svg
+++ b/src/assets/icons/git.svg
@ -0,0 +1,3 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 92 92">
 	<path style="stroke:none;fill-rule:nonzero;fill:currentColor;fill-opacity:1" d="M90.156 41.965 50.036 1.848a5.918 5.918 0 0 0-8.372 0l-8.328 8.332 10.566 10.566a7.03 7.03 0 0 1 7.23 1.684 7.034 7.034 0 0 1 1.669 7.277l10.187 10.184a7.028 7.028 0 0 1 7.278 1.672 7.04 7.04 0 0 1 0 9.957 7.05 7.05 0 0 1-9.965 0 7.044 7.044 0 0 1-1.528-7.66l-9.5-9.497V59.36a7.04 7.04 0 0 1 1.86 11.29 7.04 7.04 0 0 1-9.957 0 7.04 7.04 0 0 1 0-9.958 7.06 7.06 0 0 1 2.304-1.539V33.926a7.049 7.049 0 0 1-3.82-9.234L29.242 14.272 1.73 41.777a5.925 5.925 0 0 0 0 8.371L41.852 90.27a5.925 5.925 0 0 0 8.37 0l39.934-39.934a5.925 5.925 0 0 0 0-8.371"/>
 </svg>
--- a/src/assets/icons/github.svg
+++ b/src/assets/icons/github.svg
@ -0,0 +1,3 @@
 <svg viewBox="0 0 98 96" xmlns="http://www.w3.org/2000/svg">
  <path fill="currentcolor" fill-rule="evenodd" clip-rule="evenodd" d="M48.854 0C21.839 0 0 22 0 49.217c0 21.756 13.993 40.172 33.405 46.69 2.427.49 3.316-1.059 3.316-2.362 0-1.141-.08-5.052-.08-9.127-13.59 2.934-16.42-5.867-16.42-5.867-2.184-5.704-5.42-7.17-5.42-7.17-4.448-3.015.324-3.015.324-3.015 4.934.326 7.523 5.052 7.523 5.052 4.367 7.496 11.404 5.378 14.235 4.074.404-3.178 1.699-5.378 3.074-6.6-10.839-1.141-22.243-5.378-22.243-24.283 0-5.378 1.94-9.778 5.014-13.2-.485-1.222-2.184-6.275.486-13.038 0 0 4.125-1.304 13.426 5.052a46.97 46.97 0 0 1 12.214-1.63c4.125 0 8.33.571 12.213 1.63 9.302-6.356 13.427-5.052 13.427-5.052 2.67 6.763.97 11.816.485 13.038 3.155 3.422 5.015 7.822 5.015 13.2 0 18.905-11.404 23.06-22.324 24.283 1.78 1.548 3.316 4.481 3.316 9.126 0 6.6-.08 11.897-.08 13.526 0 1.304.89 2.853 3.316 2.364 19.412-6.52 33.405-24.935 33.405-46.691C97.707 22 75.788 0 48.854 0z"/>
 </svg>
--- a/src/assets/icons/hns.svg
+++ b/src/assets/icons/hns.svg
@ -0,0 +1,3 @@
 <svg version="1.1" viewBox="0 0 2000 2088.9" xmlns="http://www.w3.org/2000/svg">
  <path fill="currentColor" clip="evenodd" d="M1726.6,681.4l-129.8-230.6l251.5,0.1c6.7,0,14.6,4.5,18.2,10.5c4,6.6,24.4,40.3,49,80.7 c29.4,48.4,64.5,106.3,84.6,139.3H1726.6z M1261.4,2078c-6.1,10.9-14,10.9-16.6,10.9h-102.8c-54.4,0-117.1-0.1-154.5-0.1 l399.6-717.4c10.4-18.5,3.7-42-14.8-52.3c-5.7-3.2-12.1-4.9-18.6-4.9l0,0l-681,0.9l-135.5-234.5h992c0.1,0,0.2,0,0.3,0s0.2,0,0.3,0 c0.6,0,1.1-0.2,1.6-0.2c2.2-0.1,4.4-0.4,6.6-0.9c1.6-0.4,3.3-0.9,4.8-1.5c0.8-0.3,1.7-0.7,2.5-1c7.7-3.3,14.1-9.1,18.2-16.5 L1727,758.2h270L1261.4,2078z M921.1,2050.7c-8.7-14.3-20-32.9-32.3-53.1c-41.3-68.2-94.2-155.5-100.2-165.1 c-2-3.2-2.9-11.1,1.3-18.7c9.6-17.2,190.4-343,234.5-422.4l264.1-0.3L921.1,2050.7z M470.8,1601.8l-131.3-233.2l132.3-248 l132.7,229.7C563.3,1428,498.9,1549.1,470.8,1601.8z M294.6,1638.1c-66.8,0-133.3,0-143,0l0,0c-6.5,0-14.4-4.6-18-10.5l-42.7-70.4 C60.4,1507,21.5,1442.9,0,1407.5h273.4l129.8,230.6C374.9,1638.1,334.8,1638.1,294.6,1638.1L294.6,1638.1z M738.6,11 c6.1-11,14-11,16.5-11h258.3L612.7,717.4c-0.3,0.6-0.5,1.2-0.8,1.9c-0.6,1.2-1.1,2.4-1.6,3.7c-0.4,1.2-0.8,2.4-1.1,3.7 s-0.6,2.3-0.8,3.5c-0.2,1.4-0.4,2.8-0.4,4.3c0,0.6-0.2,1.2-0.2,1.9c0,0.5,0.1,0.9,0.2,1.4c0,1.4,0.2,2.8,0.4,4.2 c0.1,1.2,0.3,2.3,0.6,3.5c0.3,1.2,0.7,2.4,1.1,3.6c0.4,1.2,0.8,2.3,1.3,3.5s1.1,2.2,1.7,3.2s1.2,2.1,2,3.1c0.7,1,1.5,2,2.4,2.9 c0.8,0.9,1.6,1.8,2.5,2.7s1.8,1.5,2.8,2.3c1.1,0.8,2.2,1.6,3.3,2.3c0.4,0.3,0.8,0.6,1.2,0.9s0.9,0.3,1.4,0.6c2,1,4.1,1.9,6.2,2.5 c0.8,0.2,1.5,0.5,2.3,0.7c2.8,0.7,5.7,1.1,8.7,1.1c0,0,0,0,0.1,0h0.1h17c0.1,0,0.2,0,0.2,0l0,0l663.9-0.9 c17.6,30.5,50.4,88,78.3,136.9c21.4,37.6,39.2,68.6,53.2,93h-988c-0.4,0-0.8,0.1-1.3,0.2c-13.9,0.1-26.6,7.9-33.2,20.1l-163.6,306.6 H3.1C120.8,1119.3,730.7,25,738.6,11z M1079.4,39.1l24,39.5c42.1,69.5,101.6,167.6,107.9,177.8c2,3.2,2.9,11.1-1.3,18.7L975.6,697.3 l-264,0.3L1079.4,39.1z M1529.1,486.9l131.3,233.3l-133.9,247.5c-16-27.8-35.8-62.6-54.4-95.2c-36.8-64.4-63.6-111.3-78.7-137.5 C1422.1,682.8,1497.5,544.5,1529.1,486.9z"/>
 </svg>
--- a/src/assets/icons/osi.svg
+++ b/src/assets/icons/osi.svg
@ -0,0 +1,26 @@
 <svg version="1.2" viewBox="0 0 468.1909 614.0127" xmlns="http://www.w3.org/2000/svg">
 <path d="m262.006 307.1224c32.25781-11.98047 49.09765-35.05078 49.09765-74.75781s-33.46093-74.69531-75.26953-74.76563c-44.12109-0.0703-77.40234 34.91407-76.87109 74.76563s19.53906 66.36328 49.95703 75.94922l-53.88672 132.5703c-72.12109-18.67187-145.4727-103.7539-145.4727-208.5195 0-124.0859 99.70313-224.6797 224.6719-224.6797s226.2734 100.5937 226.2734 224.6797c0 106.3945-72.65625 190.293-146.3164 208.8906zm0 0" style="fill:currentcolor;stroke-linecap:round;stroke-linejoin:round;stroke-width:15.3697;stroke:currentcolor"/>
 <g id="text" transform="matrix(1.082924 0 0 1.148944 -55.53372 -162.9183)" style="fill:currentcolor;stroke-width:.75px">
  <path id="o1" d="m91.04297 583.3072q0 9.77344-5.273438 15.25781-5.238281 5.44922-14.69531 5.44922-9.070313 0-14.44922-5.58984-5.34375-5.58985-5.34375-15.11719 0-9.73828 5.238281-15.11719 5.273438-5.41406 14.76562-5.41406 5.871094 0 10.37109 2.49609 4.5 2.4961 6.925781 7.17188 2.460938 4.64062 2.460938 10.86328zm-25.80469 0q0 5.13281 1.371094 7.83984 1.371094 2.67188 4.605469 2.67188 3.199218 0 4.5-2.67188 1.335937-2.70703 1.335937-7.83984 0-5.09766-1.335937-7.69922-1.335938-2.60156-4.570313-2.60156-3.164062 0-4.535156 2.60156-1.371094 2.56641-1.371094 7.69922z" style="font-feature-settings:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal"/>
  <path id="p" d="m122.7539 604.0143q-3.02344 0-5.41407-0.98437-2.39062-1.01953-4.74609-3.6211h-0.63281q0.63281 4.1836 0.63281 5.20313v15.99609h-13.74609v-57.1289h11.17968l1.9336 5.0625h0.63281q3.83203-5.76563 10.58203-5.76563 6.60938 0 10.37109 5.48438 3.76172 5.48437 3.76172 15.04687 0 9.63281-3.9375 15.1875-3.90234 5.51953-10.61718 5.51953zm-4.60547-30.44531q-3.02344 0-4.25391 2.17969-1.19531 2.14453-1.30078 6.39843v1.08985q0 5.13281 1.37109 7.41797 1.3711 2.28515 4.32422 2.28515 2.63672 0 3.83203-2.25 1.19532-2.28515 1.19532-7.52343 0-5.13282-1.19532-7.34766-1.19531-2.25-3.97265-2.25z" style="font-feature-settings:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal"/>
  <path id="e1" d="m164.3438 604.0143q-9.94922 0-15.46875-5.27344-5.48438-5.30859-5.48438-15.08203 0-10.08984 5.09766-15.46875 5.09766-5.41406 14.55469-5.41406 9 0 13.88672 4.71094 4.92187 4.67578 4.92187 13.5v6.11719h-24.57422q0.14063 3.33984 2.42578 5.23828 2.32032 1.89843 6.29297 1.89843 3.6211 0 6.64453-0.66796 3.0586-0.70313 6.60938-2.35547v9.8789q-3.23438 1.65235-6.67969 2.28516t-8.22656 0.63281zm-0.80859-31.88672q-2.42579 0-4.07813 1.54688-1.61719 1.51172-1.89844 4.78125h11.8125q-0.0703-2.88281-1.65234-4.60547-1.54688-1.72266-4.18359-1.72266z" style="font-feature-settings:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal"/>
  <path id="n1" d="m214.8281 603.3112v-21.72657q0-3.97265-1.16015-5.97656-1.125-2.03906-3.65625-2.03906-3.48047 0-5.02735 2.77734-1.54687 2.77735-1.54687 9.52735v17.4375h-13.74609v-39.83203h10.37109l1.72266 4.92187h0.80859q1.75781-2.8125 4.85156-4.21875 3.12891-1.40625 7.17188-1.40625 6.60937 0 10.26562 3.83203 3.69141 3.83203 3.69141 10.79297v25.91016z" style="font-feature-settings:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal"/>
  <path id="s" d="m283.9102 592.2369q0 5.69531-4.14844 8.7539-4.14844 3.02344-11.88281 3.02344-7.76954 0-12.48047-2.35547v-7.13672q6.85547 3.16407 12.76172 3.16407 7.6289 0 7.6289-4.60547 0-1.47656-0.84375-2.46094-0.84375-0.98437-2.77734-2.03906-1.9336-1.05469-5.37891-2.39063-6.71484-2.60156-9.10547-5.20312-2.35547-2.60156-2.35547-6.75 0-4.99219 4.00782-7.73438 4.04297-2.77734 10.96875-2.77734 6.85547 0 12.97265 2.77734l-2.67187 6.22266q-6.29297-2.60156-10.58203-2.60156-6.53907 0-6.53907 3.72656 0 1.82812 1.6875 3.09375 1.72266 1.26562 7.45313 3.48047 4.81641 1.86328 6.99609 3.41015 2.17969 1.54688 3.23438 3.58594 1.05469 2.00391 1.05469 4.81641z" style="font-feature-settings:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal"/>
  <path id="o2" d="m327.293 583.7994q0 9.52734-4.88672 14.87109t-13.60547 5.34375q-5.44922 0-9.63281-2.46094-4.1836-2.46093-6.4336-7.0664t-2.25-10.6875q0-9.45703 4.85157-14.76563 4.85156-5.30859 13.67578-5.30859 8.4375 0 13.35937 5.44922 4.92188 5.41406 4.92188 14.625zm-28.30078 0q0 13.46484 9.94922 13.46484 9.84375 0 9.84375-13.46484 0-13.32422-9.91407-13.32422-5.20312 0-7.55859 3.44531-2.32031 3.44531-2.32031 9.87891z" style="font-feature-settings:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal"/>
  <path id="u" d="m364.2422 603.3112-1.16016-5.09766h-0.42187q-1.72266 2.70703-4.92188 4.25391-3.16406 1.54687-7.24219 1.54687-7.0664 0-10.54687-3.51562-3.48047-3.51563-3.48047-10.65235v-25.41797h8.33203v23.97657q0 4.46484 1.82813 6.71484 1.82812 2.21484 5.73046 2.21484 5.20313 0 7.62891-3.09375 2.46094-3.1289 2.46094-10.4414v-19.3711h8.29687v38.88282z" style="font-feature-settings:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal"/>
  <path id="r" d="m402.2461 563.7252q2.4961 0 4.11328 0.35156l-0.80859 7.69922q-1.75781-0.42187-3.65625-0.42187-4.95703 0-8.05078 3.23437-3.05859 3.23438-3.05859 8.40234v20.32032h-8.26172v-38.88282h6.46875l1.08984 6.85547h0.42188q1.93359-3.48047 5.02734-5.51953 3.12891-2.03906 6.71484-2.03906z" style="font-feature-settings:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal"/>
  <path id="c" d="m429.2812 604.0143q-8.82422 0-13.42969-5.13281-4.57031-5.16797-4.57031-14.80078 0-9.8086 4.78125-15.08203 4.81641-5.27344 13.88672-5.27344 6.15234 0 11.07422 2.28516l-2.4961 6.64453q-5.23828-2.03907-8.64843-2.03907-10.08985 0-10.08985 13.39454 0 6.53906 2.4961 9.84375 2.53125 3.26953 7.38281 3.26953 5.51953 0 10.4414-2.74219v7.20703q-2.21484 1.30078-4.74609 1.86328-2.49609 0.5625-6.08203 0.5625z" style="font-feature-settings:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal"/>
  <path id="e2" d="m466.3008 604.0143q-9.07031 0-14.20312-5.27344-5.09766-5.30859-5.09766-14.58984 0-9.52734 4.74609-14.97656 4.7461-5.44922 13.04297-5.44922 7.69922 0 12.16406 4.67578 4.46485 4.67578 4.46485 12.86719v4.46484h-25.91016q0.17578 5.66016 3.0586 8.71875 2.88281 3.02344 8.12109 3.02344 3.44531 0 6.39844-0.63281 2.98828-0.66797 6.39843-2.17969v6.71484q-3.02343 1.44141-6.11718 2.03907-3.09375 0.59765-7.06641 0.59765zm-1.51172-34.03125q-3.9375 0-6.32812 2.4961-2.35547 2.49609-2.8125 7.27734h17.64843q-0.0703-4.81641-2.32031-7.27734-2.25-2.4961-6.1875-2.4961z" style="font-feature-settings:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal"/>
  <path id="i1" d="m128.5195 675.51h-8.26172v-38.88281h8.26172zm-8.7539-49.18359q0-2.21485 1.19531-3.41016 1.23047-1.19531 3.48047-1.19531 2.17968 0 3.375 1.19531 1.23046 1.19531 1.23046 3.41016 0 2.10937-1.23046 3.33984-1.19532 1.19531-3.375 1.19531-2.25 0-3.48047-1.19531-1.19531-1.23047-1.19531-3.33984z" style="font-feature-settings:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal;stroke-width:.75px"/>
  <path id="n2" d="m174.5742 675.51h-8.29688v-23.90625q0-4.5-1.82812-6.71484-1.79297-2.21485-5.73047-2.21485-5.23828 0-7.66406 3.09375t-2.42578 10.3711v19.37109h-8.26172v-38.88281h6.46875l1.16015 5.09765h0.42188q1.75781-2.77734 4.99219-4.28906 3.23437-1.51172 7.17187-1.51172 13.99219 0 13.99219 14.23828z" style="font-feature-settings:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal;stroke-width:.75px"/>
  <path id="i2" d="m194.332 675.51h-8.26172v-38.88281h8.26172zm-8.75391-49.18359q0-2.21485 1.19532-3.41016 1.23047-1.19531 3.48047-1.19531 2.17968 0 3.375 1.19531 1.23046 1.19531 1.23046 3.41016 0 2.10937-1.23046 3.33984-1.19532 1.19531-3.375 1.19531-2.25 0-3.48047-1.19531-1.19532-1.23047-1.19532-3.33984z" style="font-feature-settings:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal;stroke-width:.75px"/>
  <path id="t1" d="m220.6641 669.5334q3.02344 0 6.04688-0.94922v6.22265q-1.3711 0.59766-3.55078 0.98438-2.14454 0.42187-4.46485 0.42187-11.74219 0-11.74219-12.375v-20.95312h-5.30859v-3.65625l5.69531-3.02344 2.8125-8.22656h5.09766v8.64844h11.07422v6.25781h-11.07422v20.8125q0 2.98828 1.47656 4.42969 1.51172 1.40625 3.9375 1.40625z" style="font-feature-settings:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal;stroke-width:.75px"/>
  <path id="i3" d="m242.707 675.51h-8.26172v-38.88281h8.26172zm-8.75391-49.18359q0-2.21485 1.19532-3.41016 1.23047-1.19531 3.48047-1.19531 2.17968 0 3.375 1.19531 1.23046 1.19531 1.23046 3.41016 0 2.10937-1.23046 3.33984-1.19532 1.19531-3.375 1.19531-2.25 0-3.48047-1.19531-1.19532-1.23047-1.19532-3.33984z" style="font-feature-settings:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal;stroke-width:.75px"/>
  <path id="a" d="m278.8828 675.51-1.65234-5.41406h-0.28125q-2.8125 3.55078-5.66016 4.85156-2.84765 1.26562-7.3125 1.26562-5.73047 0-8.96484-3.09375-3.19922-3.09375-3.19922-8.7539 0-6.01172 4.46484-9.07031 4.46485-3.0586 13.60547-3.33985l6.71485-0.21094v-2.07421q0-3.72657-1.75782-5.55469-1.72265-1.86328-5.3789-1.86328-2.98828 0-5.73047 0.8789-2.74219 0.87891-5.27344 2.07422l-2.67187-5.90625q3.16406-1.65234 6.92578-2.49609 3.76172-0.87891 7.10156-0.87891 7.41797 0 11.17969 3.23438 3.79687 3.23437 3.79687 10.16015v26.19141zm-12.30469-5.625q4.5 0 7.20704-2.49609 2.74218-2.53125 2.74218-7.06641v-3.375l-4.99218 0.21094q-5.83594 0.21093-8.50782 1.96875-2.63672 1.72265-2.63672 5.30859 0 2.60156 1.54688 4.04297 1.54687 1.40625 4.64062 1.40625z" style="font-feature-settings:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal;stroke-width:.75px"/>
  <path id="t2" d="m310.8047 669.5334q3.02343 0 6.04687-0.94922v6.22265q-1.37109 0.59766-3.55078 0.98438-2.14453 0.42187-4.46484 0.42187-11.74219 0-11.74219-12.375v-20.95312h-5.30859v-3.65625l5.69531-3.02344 2.8125-8.22656h5.09765v8.64844h11.07422v6.25781h-11.07422v20.8125q0 2.98828 1.47657 4.42969 1.51172 1.40625 3.9375 1.40625z" style="font-feature-settings:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal;stroke-width:.75px"/>
  <path id="i4" d="m332.8477 675.51h-8.26172v-38.88281h8.26172zm-8.75391-49.18359q0-2.21485 1.19531-3.41016 1.23047-1.19531 3.48047-1.19531 2.17969 0 3.375 1.19531 1.23047 1.19531 1.23047 3.41016 0 2.10937-1.23047 3.33984-1.19531 1.19531-3.375 1.19531-2.25 0-3.48047-1.19531-1.19531-1.23047-1.19531-3.33984z" style="font-feature-settings:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal;stroke-width:.75px"/>
  <path id="v" d="m353.5547 675.51-14.76563-38.88281h8.71875l7.91016 22.60547q2.03906 5.69531 2.46094 9.21093h0.28125q0.3164-2.53125 2.46093-9.21093l7.91016-22.60547h8.78906l-14.83594 38.88281z" style="font-feature-settings:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal;stroke-width:.75px"/>
  <path id="e3" d="m400.207 676.2131q-9.07031 0-14.20312-5.27343-5.09766-5.3086-5.09766-14.58985 0-9.52734 4.74609-14.97656 4.7461-5.44922 13.04297-5.44922 7.69922 0 12.16406 4.67578 4.46485 4.67578 4.46485 12.86719v4.46484h-25.91016q0.17578 5.66016 3.0586 8.71875 2.88281 3.02344 8.12109 3.02344 3.44531 0 6.39844-0.63281 2.98828-0.66797 6.39843-2.17969v6.71485q-3.02343 1.4414-6.11718 2.03906-3.09375 0.59765-7.06641 0.59765zm-1.51172-34.03125q-3.9375 0-6.32812 2.4961-2.35547 2.49609-2.8125 7.27734h17.64843q-0.0703-4.8164-2.32031-7.27734-2.25-2.4961-6.1875-2.4961z" style="font-feature-settings:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal;stroke-width:.75px"/>
  <path id="registered_tm" d="m431.7151 631.1344h1.75306q1.29857 0 2.07771-0.62727 0.79537-0.64258 0.79537-1.62174 0-1.14745-0.69798-1.63703-0.69798-0.50488-2.20756-0.50488h-1.7206zm7.04472-2.31021q0 1.22395-0.69798 2.17252-0.68174 0.93326-1.93162 1.39224l3.86324 6.04325h-2.72699l-3.36004-5.41597h-2.19133v5.41597h-2.40235v-13.63174h4.23657q2.69453 0 3.9444 0.99446 1.2661 0.99446 1.2661 3.02927zm-17.15731 2.78449q0-3.05987 1.62321-5.73727 1.6232-2.67739 4.46382-4.22262 2.84061-1.54524 6.1195-1.54524 3.24641 0 6.08703 1.52994 2.84061 1.52994 4.48005 4.20733 1.63945 2.67739 1.63945 5.76786 0 3.01398-1.57452 5.66077-1.57451 2.64679-4.41512 4.23793-2.84062 1.59113-6.21689 1.59113-3.36005 0-6.20066-1.57583-2.84062-1.59114-4.43136-4.23793-1.57451-2.64679-1.57451-5.67607zm1.70437 0q0 2.64679 1.41219 4.957 1.41219 2.2949 3.847 3.62595 2.45105 1.31575 5.24297 1.31575 2.82438 0 5.24296-1.33105t3.83077-3.59535q1.42843-2.27961 1.42843-4.9723 0-2.66209-1.4122-4.9417-1.41219-2.2796-3.83077-3.61065-2.40235-1.34635-5.25919-1.34635-2.82439 0-5.24297 1.33105t-3.847 3.61066q-1.41219 2.2643-1.41219 4.95699z" style="fill:currentcolor;font-feature-settings:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal"/>
 </g>
 </svg>
--- a/src/assets/icons/sia.svg
+++ b/src/assets/icons/sia.svg
@ -0,0 +1,5 @@
 <svg viewBox="0 0 65 39" fill="none" xmlns="http://www.w3.org/2000/svg">
  <path d="M0 33.1034C2.44131 36.5305 6.36863 39 12.0473 39C18.2567 39 22.3963 35.6233 22.3963 31.1379C22.3963 27.7613 20.1673 24.8886 14.9132 23.2759L10.7736 22.0159C9.28758 21.5623 8.27922 20.8064 8.27922 19.5968C8.27922 18.3873 9.49987 17.3793 11.5697 17.3793C13.9048 17.3793 15.8685 18.8408 16.8238 20.0504L21.2818 16.5225C19.5835 14.3554 16.0277 12.0371 11.4105 12.0371C5.67869 12.0371 1.75137 15.6154 1.75137 19.5968C1.75137 22.7719 3.98039 25.695 8.4915 27.1565L12.2065 28.366C15.0193 29.2732 15.8685 30.1804 15.8685 31.3395C15.8685 32.7003 14.4886 33.6578 12.0473 33.6578C9.0753 33.6578 6.84628 32.4987 4.7234 29.8276L0 33.1034Z" fill="currentColor"/>
  <path d="M26.519 4.77984C26.519 6.84615 28.2703 8.61008 30.4993 8.61008C32.6753 8.61008 34.4797 6.84615 34.4797 4.77984C34.4797 2.71353 32.6753 1 30.4993 1C28.2703 1 26.519 2.71353 26.519 4.77984ZM27.1558 38.244H33.8429V12.7931H27.1558V38.244Z" fill="currentColor"/>
  <path d="M62.025 26.5L62.025 36.025L51 36.025C45.4633 36.025 40.975 31.5367 40.975 26C40.975 20.4633 45.4633 15.975 51 15.975L51.5 15.975C57.3128 15.975 62.025 20.6872 62.025 26.5Z" stroke="currentColor" stroke-width="5.95"/>
 </svg>
--- a/src/assets/icons/twitter.svg
+++ b/src/assets/icons/twitter.svg
@ -0,0 +1,3 @@
 <svg version="1.1" viewBox="0 0 400 400" xmlns="http://www.w3.org/2000/svg">
  <path fill="currentcolor" d="M400,200c0,110.5-89.5,200-200,200S0,310.5,0,200S89.5,0,200,0S400,89.5,400,200z M163.4,305.5 c88.7,0,137.2-73.5,137.2-137.2c0-2.1,0-4.2-0.1-6.2c9.4-6.8,17.6-15.3,24.1-25c-8.6,3.8-17.9,6.4-27.7,7.6 c10-6,17.6-15.4,21.2-26.7c-9.3,5.5-19.6,9.5-30.6,11.7c-8.8-9.4-21.3-15.2-35.2-15.2c-26.6,0-48.2,21.6-48.2,48.2 c0,3.8,0.4,7.5,1.3,11c-40.1-2-75.6-21.2-99.4-50.4c-4.1,7.1-6.5,15.4-6.5,24.2c0,16.7,8.5,31.5,21.5,40.1c-7.9-0.2-15.3-2.4-21.8-6 c0,0.2,0,0.4,0,0.6c0,23.4,16.6,42.8,38.7,47.3c-4,1.1-8.3,1.7-12.7,1.7c-3.1,0-6.1-0.3-9.1-0.9c6.1,19.2,23.9,33.1,45,33.5 c-16.5,12.9-37.3,20.6-59.9,20.6c-3.9,0-7.7-0.2-11.5-0.7C110.8,297.5,136.2,305.5,163.4,305.5"/>
 </svg>
--- a/src/assets/lume-logo.png
+++ b/src/assets/lume-logo.png
--- a/src/assets/main-donate-bg.png
+++ b/src/assets/main-donate-bg.png
--- a/src/assets/main-vision-bg.png
+++ b/src/assets/main-vision-bg.png
--- a/src/assets/main-what-bg.png
+++ b/src/assets/main-what-bg.png
--- a/src/assets/mario-level-up.gif
+++ b/src/assets/mario-level-up.gif
--- a/src/assets/meme-1-small.png
+++ b/src/assets/meme-1-small.png
--- a/src/assets/meme-1.png
+++ b/src/assets/meme-1.png
--- a/src/assets/meme-2-small.png
+++ b/src/assets/meme-2-small.png
--- a/src/assets/meme-2.png
+++ b/src/assets/meme-2.png
--- a/src/assets/meme-3-small.png
+++ b/src/assets/meme-3-small.png
--- a/src/assets/meme-3.png
+++ b/src/assets/meme-3.png
--- a/src/assets/meme-4-small.png
+++ b/src/assets/meme-4-small.png
--- a/src/assets/meme-4.png
+++ b/src/assets/meme-4.png
--- a/src/assets/mullet-meme.jpg
+++ b/src/assets/mullet-meme.jpg
--- a/src/assets/new-world-bg.png
+++ b/src/assets/new-world-bg.png
--- a/src/assets/single-brand-bg-1.png
+++ b/src/assets/single-brand-bg-1.png
--- a/src/assets/single-brand-bg-2.png
+++ b/src/assets/single-brand-bg-2.png
--- a/src/assets/unifying-bg.png
+++ b/src/assets/unifying-bg.png
--- a/src/components/Donate/How/How.astro
+++ b/src/components/Donate/How/How.astro
@ -0,0 +1,18 @@
 ---
 import './How.scss';
 ---
 <section id="how">
    <div class="custom-bg"></div>
    <div class="feature-group">
        <h2>How should I donate?</h2>
        <h3>Donate via Gitcoin during funding rounds</h3>
        <p>
            When Gitcoin is doing funding rounds, donating through their website will give a matching bonus of up to
            150%. This means that your donation will have a bigger impact on the project during this time period.
        </p>
        <div>
            <a href="https://gitcoin.co/grants/4722/lume-web-web3-accessibility-freedom-and-education" class="btn-main">Gitcoin</a>
        </div>
    </div>
 </section>
--- a/src/components/Donate/How/How.scss
+++ b/src/components/Donate/How/How.scss
@ -0,0 +1,50 @@
@import "/src/styles/vars.scss";
 #how {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-top: 8em;
  padding: 14em 7.5% 16em;
  .custom-bg {
    position: absolute;
    top: 0;
    right: -12.5%;
    bottom: 0;
    left: -12.5%;
    margin: 2% 0;
    background: $color-blue-charcoal;
    transform: matrix(1, 0.04, -0.04, 1, 0, 0);
    z-index: -1;
    overflow: hidden;
    &::after {
      content: "";
      position: absolute;
      top: 3%;
      bottom: -9%;
      left: 10%;
      right: 10%;
      background-image: url("/src/assets/donate-gfx-right.png");
      background-position: 100% 100%;
      background-repeat: no-repeat;
      background-size: contain;
      transform: rotate(-2.25deg);
    }
  }
  .feature-group {
    max-width: 64em;
  }
  @media screen and (max-width: 80rem) {
    p {
      background: rgba($color-blue-charcoal, 0.75);
      border-radius: 0.5em;
      padding: 0.3em 0.5em;
      margin: -0.3em -0.5em;
    }
  }
 }
--- a/src/components/Donate/Jumbotron/Jumbotron.astro
+++ b/src/components/Donate/Jumbotron/Jumbotron.astro
@ -0,0 +1,9 @@
 ---
 import '../../../styles/jumbotron.scss';
 ---
 <section id="jumbotron">
  <h1>
    Lume is people-powered.
  </h1>
 </section>
--- a/src/components/Donate/Legal/Legal.astro
+++ b/src/components/Donate/Legal/Legal.astro
@ -0,0 +1,18 @@
 ---
 import './Legal.scss';
 ---
 <section id="legal" class="tilted-bg-r">
  <div>
    <h2>Tax and Legal</h2>
    <p>
      <strong>Please understand that, according to United States regulations for our present incorporation status, donations are not currently tax-deductible.</strong>
    </p>
    <p>
      If you are a corporation or business, planning to make a large donation, we recommend that you consult a CPA to ensure you understand the tax implications of your donated funds first.
    </p>
    <p>
      All payments are nondeductible donations (unless you get consulted otherwise) and do not create any implied service contract or obligation for Hammer Technologies LLC to render any services.
    </p>
  </div>
 </section>
--- a/src/components/Donate/Legal/Legal.scss
+++ b/src/components/Donate/Legal/Legal.scss
@ -0,0 +1,31 @@
@import "/src/styles/mixins.scss";
@import "/src/styles/vars.scss";
 #legal {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 11em 7.5% 9em;
  h2 {
    margin-bottom: 1em;
    @include fluid-font-size(2.8125rem);
    line-height: 122%;
  }
  p {
    margin-top: 1.5em;
    font-family: $font-family-jaldi;
    @include fluid-font-size(1.375rem);
    line-height: 157%;
    color: $color-cloud;
  }
  strong {
    @include fluid-font-size(1.625rem);
  }
  &::before {
    bottom: -12%;
  }
 }
--- a/src/components/Donate/Methods/Methods.astro
+++ b/src/components/Donate/Methods/Methods.astro
@ -0,0 +1,150 @@
 ---
 import './Methods.scss';
 import QRCode from 'qrcode';
 const currencies = [];
 const addCurrency = async (id, title, address) => {
  currencies.push({
    id: id,
    title: title,
    address: address,
    svgLogo: await import(`./icons/${id}.svg?raw`),
    qrSmall: await QRCode.toDataURL(address, { version: 6, scale: 1, margin: 1 }),
    qrLarge: await QRCode.toDataURL(address, { version: 6, scale: 7, margin: 2 })
  });
 };
 await addCurrency('bitcoin', 'Bitcoin (BTC)', 'bc1q9xq2w4w2hjc240rs6mf0g8gpzz3rmcz4h77a2a');
 await addCurrency('litecoin', 'Litecoin (LTC)', 'ltc1qgk6fc4u6grqyhfzw208477ze35vrr5tcwhq8zq');
 await addCurrency('ethereum', 'Ethereum (ETH, USDT/USDC, ERC20)', '0x63cd2C691632720Ff2ABDD0b6AABA2466D3Fe468');
 await addCurrency('polygon', 'Polygon (MATIC)', '0x63cd2C691632720Ff2ABDD0b6AABA2466D3Fe468');
 await addCurrency('solana', 'Solana (SOL)', '4nMRucCuqttipwQXm31vBgoaxDW6o25TnD8fj1imviCu');
 await addCurrency('cardano', 'Cardano (ADA)', 'addr1q9jd69s53pdy9j567a27ac6uvc2966x0rjz2l9sxy4y5w8383jl87mrdf6uuk9ja7lmagm2p4vw30sa42kjylxxrdufqucgst6');
 await addCurrency('siacoin', 'Siacoin (SC)', '7506caa950cdddbaec8f465937b50324e942ac6f5280a053662e58e3cc8bdb543ab88ccd5c23');
 await addCurrency('monero', 'Monero (XMR)', '48A33fSyFo9YAiux3KHKVBagPGvqmcr2h4oy5pufJn6NUWyZsPF6PAufmrET3gLJjsLwxfU7HU9xe8mEeCqtHqvZN3Ly12h');
 await addCurrency('handshake', 'Handshake (HNS)', 'hs1qe67ak3j2u4yrq0qnfs2hmycxqdvaf9v5rjsxzy');
 await addCurrency('cosmos', 'Cosmos (ATOM)', 'cosmos1pvy8zyzqwz2r2jl9j9d3zrfmg6dqc5hyhj6d5z');
 await addCurrency('secret', 'Secret (SCRT)', 'secret18377vc3af588ggauhrpuyfd954lmmu05xqhf0y');
 await addCurrency('algorand', 'Algorand (ALGO)', '3QBE5TZ63TF5W7V2QRJWRB72M7INQLA3RZW4XHD3ISRE7CRYCVNU4EEVAE');
 ---
 <section id="methods">
  <div>
    <h2>Donate Cryptocurrency</h2>
    <div class="method-grid">
      {currencies.map(currency => (
        <div id={'donate-' + currency.id}>
          <div>
            <Fragment set:html={currency.svgLogo.default} />
            <h3>{currency.title}</h3>
            <img onclick={"openDialog('" + currency.qrLarge + "')"} src={currency.qrSmall}/>
          </div>
          <div class="address">
            <button onclick="copyToClipboard(this)"></button>
            <div>{currency.address}</div>
          </div>
        </div>
      ))}
    </div>
    <h2>Donate Fiat</h2>
    <div class="method-grid">
      <div id="donate-paypal">
        <div>
          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 154.728 190.5">
            <g transform="translate(898.192 276.071)">
              <path clip-path="none" d="M-837.663-237.968a5.49 5.49 0 0 0-5.423 4.633l-9.013 57.15-8.281 52.514-.005.044.01-.044 8.281-52.514c.421-2.669 2.719-4.633 5.42-4.633h26.404c26.573 0 49.127-19.387 53.246-45.658.314-1.996.482-3.973.52-5.924v-.003h-.003c-6.753-3.543-14.683-5.565-23.372-5.565z" fill="#001c64"/>
              <path clip-path="none" d="M-766.506-232.402c-.037 1.951-.207 3.93-.52 5.926-4.119 26.271-26.673 45.658-53.246 45.658h-26.404c-2.701 0-4.999 1.964-5.42 4.633l-8.281 52.514-5.197 32.947a4.46 4.46 0 0 0 4.405 5.153h28.66a5.49 5.49 0 0 0 5.423-4.633l7.55-47.881c.423-2.669 2.722-4.636 5.423-4.636h16.876c26.573 0 49.124-19.386 53.243-45.655 2.924-18.649-6.46-35.614-22.511-44.026z" fill="#0070e0"/>
              <path clip-path="none" d="M-870.225-276.071a5.49 5.49 0 0 0-5.423 4.636l-22.489 142.608a4.46 4.46 0 0 0 4.405 5.156h33.351l8.281-52.514 9.013-57.15a5.49 5.49 0 0 1 5.423-4.633h47.782c8.691 0 16.621 2.025 23.375 5.563.46-23.917-19.275-43.666-46.412-43.666z" fill="#003087"/>
            </g>
          </svg>
          <h3>PayPal</h3>
          <form action="https://www.paypal.com/donate" method="post" target="_top">
            <input type="hidden" name="hosted_button_id" value="LKDLTQQRQV2U8">
            <button class="btn-main">Donate</a>
          </form>
        </div>
      </div>
      <div id="donate-patreon">
        <div>
          <svg version="1.1" viewBox="0 -4.5 256 256" xmlns="http://www.w3.org/2000/svg">
            <path d="M45.1355837,0 L45.1355837,246.35001 L0,246.35001 L0,0 L45.1355837,0 Z M163.657111,0 C214.65668,0 256,41.3433196 256,92.3428889 C256,143.342458 214.65668,184.685778 163.657111,184.685778 C112.657542,184.685778 71.3142222,143.342458 71.3142222,92.3428889 C71.3142222,41.3433196 112.657542,0 163.657111,0 Z" fill="#FF424D"/>
          </svg>
          <h3>Patreon</h3>
          <a class="btn-main" href="https://www.patreon.com/bePatron?u=71702133">Become a Patron!</a>
        </div>
      </div>
      <div id="donate-liberapay">
        <div>
          <svg viewBox="0 0 80 80" xmlns="http://www.w3.org/2000/svg">
            <rect fill="#f6c915" width="80" height="80" rx="8"/>
            <path fill="#FFF" d="M32.73 56.2651c-2.5867 0-4.6175-.3376-6.0925-1.0107s-2.5308-1.5936-3.1708-2.7611-.9458-2.4933-.9275-4.015.2267-3.1234.6284-4.8357l6.9391-29.0143 8.47-1.3108-7.595 31.4733c-.1458.655-.2275 1.2567-.2458 1.8025s.0817 1.0292.3 1.4475.5917.7566 1.12 1.0108 1.2658.42 2.2133.4925zM40.5333 28.0209c1.46-.4367 3.1267-.8284 5.0025-1.175s3.9075-.5183 6.0933-.5183 3.7985.3092 5.2726.9283 2.6864 1.4667 3.6341 2.5409 1.6475 2.3316 2.1024 3.77.6832 2.9783.6832 4.6183c0 2.6583-.4373 5.09-1.3214 7.2942s-2.076 4.1075-3.6237 5.71-3.4059 2.851-5.5763 3.7475-4.5235 1.3344-7.0718 1.3344c-1.2391 0-2.4775-.1104-3.7158-.3296l-2.4592 9.8912h-8.0865zM43.4867 49.3867c.6192.1458 1.3842.2133 2.295.2133 1.42 0 2.7133-.2583 3.8792-.7875s2.1583-1.265 2.9783-2.2125 1.4557-2.0842 1.9117-3.415.6827-2.795.6827-4.3983-.3467-2.8958-1.0379-3.9892-1.894-1.6391-3.6057-1.6391c-1.1667 0-2.2592.1092-3.2792.3283z"/>
          </svg>
          <h3>Liberapay</h3>
          <a class="btn-main" href="https://liberapay.com/lumeweb/donate">Donate</a>
        </div>
      </div>
      <div id="donate-github">
        <div>
          <svg viewBox="0 0 98 96" xmlns="http://www.w3.org/2000/svg">
            <path fill-rule="evenodd" clip-rule="evenodd" d="M48.854 0C21.839 0 0 22 0 49.217c0 21.756 13.993 40.172 33.405 46.69 2.427.49 3.316-1.059 3.316-2.362 0-1.141-.08-5.052-.08-9.127-13.59 2.934-16.42-5.867-16.42-5.867-2.184-5.704-5.42-7.17-5.42-7.17-4.448-3.015.324-3.015.324-3.015 4.934.326 7.523 5.052 7.523 5.052 4.367 7.496 11.404 5.378 14.235 4.074.404-3.178 1.699-5.378 3.074-6.6-10.839-1.141-22.243-5.378-22.243-24.283 0-5.378 1.94-9.778 5.014-13.2-.485-1.222-2.184-6.275.486-13.038 0 0 4.125-1.304 13.426 5.052a46.97 46.97 0 0 1 12.214-1.63c4.125 0 8.33.571 12.213 1.63 9.302-6.356 13.427-5.052 13.427-5.052 2.67 6.763.97 11.816.485 13.038 3.155 3.422 5.015 7.822 5.015 13.2 0 18.905-11.404 23.06-22.324 24.283 1.78 1.548 3.316 4.481 3.316 9.126 0 6.6-.08 11.897-.08 13.526 0 1.304.89 2.853 3.316 2.364 19.412-6.52 33.405-24.935 33.405-46.691C97.707 22 75.788 0 48.854 0z" fill="#fff"/>
          </svg>
          <h3>GitHub Sponsors</h3>
          <a class="btn-main" href="https://github.com/sponsors/LumeWeb">Donate</a>
        </div>
      </div>
    </div>
    <p>
      If you are interested in donating through other means, please get in touch with us to discuss. If there is a cryptocurrency you wish to contribute with that we have not listed, please let me know!
    </p>
  </div>
  <dialog id="qr-dialog"></dialog>
  <script is:inline>
    var
      msgCallback,
      msgTimeout,
      qrDialog = document.getElementById('qr-dialog');
    function copyToClipboard(element) {
      var
        range = document.createRange(),
        selection = window.getSelection();
      if(msgCallback) {
        clearTimeout(msgTimeout);
        msgCallback();
      }
      range.selectNode(element.nextElementSibling); // select address container
      selection.removeAllRanges();                  // clear current selection
      selection.addRange(range);                    // select address
      document.execCommand('copy');                 // copy
      selection.removeAllRanges();                  // deselect
      element.classList.add('success');
      msgCallback = function() {
        element.classList.remove('success');
        msgCallback = undefined;
      }
      msgTimeout = window.setTimeout(msgCallback, 5000);
    }
    function openDialog(qrLarge) {
      document.body.classList.add('scroll-lock');
      qrDialog.innerHTML = '<img src="' + qrLarge + '"/>';
      qrDialog.showModal();
    }
    qrDialog.addEventListener('close', function() {
      document.body.classList.remove('scroll-lock');
    });
    qrDialog.addEventListener('click', function(event) {
      if (event.target === this) {
        this.close();
      }
    });
  </script>
 </section>
--- a/src/components/Donate/Methods/Methods.scss
+++ b/src/components/Donate/Methods/Methods.scss
@ -0,0 +1,291 @@
@import "/src/styles/mixins.scss";
@import "/src/styles/vars.scss";
 #methods {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 2em 7.5% 6em;
    padding-top: 3em;
    font-family: $font-family-jaldi;
    h2 {
        margin: 1.25em 0 1em;
        @include fluid-font-size(2.8125rem);
        line-height: 122%;
        &:first-child {
            margin-top: 0;
        }
    }
    .method-grid {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        gap: 2em;
        margin-bottom: 4em;
        @media screen and (min-width: 48rem) {
            grid-template-columns: repeat(2, 1fr);
        }
        > div {
            display: flex;
            flex-direction: column;
            padding: 4em 4em 1em;
            background: $color-blue-charcoal;
            border: 0.1em solid transparent;
            border-radius: 1em;
            transition: border-color 200ms;
            &:hover {
                border-color: $color-aquamarine;
            }
            > div:first-child {
                display: flex;
                align-items: center;
                gap: 2em;
                margin-bottom: 3em;
                svg {
                    flex-shrink: 0;
                    @include fluid-max-width-height(3.4375rem, 3.4375rem);
                }
                h3 {
                    flex-grow: 1;
                    font-family: $font-family-jetbrains-mono;
                    @include fluid-font-size(1.5rem);
                }
                img {
                    @include fluid-width-height(3.4375rem, 3.4375rem);
                    image-rendering: pixelated;
                    cursor: zoom-in;
                }
            }
        }
        .address {
            display: flex;
            margin-bottom: 3em;
            color: $color-cloud;
            div {
                order: 1;
                flex-grow: 1;
                position: relative;
                @include fluid-font-size(1.375rem);
                word-break: break-all;
                user-select: all;
            }
            button {
                order: 2;
                flex-shrink: 0;
                @include fluid-width-height(1.875rem, 1.875rem);
                @include fluid-margin-lr-rem(0.78125rem);
                mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M15.75 17.25v3.375c0 .621-.504 1.125-1.125 1.125h-9.75a1.125 1.125 0 01-1.125-1.125V7.875c0-.621.504-1.125 1.125-1.125H6.75a9.06 9.06 0 011.5.124m7.5 10.376h3.375c.621 0 1.125-.504 1.125-1.125V11.25c0-4.46-3.243-8.161-7.5-8.876a9.06 9.06 0 00-1.5-.124H9.375c-.621 0-1.125.504-1.125 1.125v3.5m7.5 10.375H9.375a1.125 1.125 0 01-1.125-1.125v-9.25m12 6.625v-1.875a3.375 3.375 0 00-3.375-3.375h-1.5a1.125 1.125 0 01-1.125-1.125v-1.5a3.375 3.375 0 00-3.375-3.375H9.75" /></svg>');
                background: $color-cloud;
                transition: background $transition-duration;
                &:hover {
                    background: $color-white;
                }
                &.success {
                    mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M9 12.75L11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0z" /></svg>');
                    background: $color-aquamarine;
                }
            }
            button:hover + div, button.success + div {
                &::before {
                    content: "";
                    position: absolute;
                    inset: -0.5em;
                    padding: 0.5em;
                    background: $color-blue-charcoal;
                    animation: $transition-duration overlay-opacity forwards;
                }
                &::after {
                    content: "Copy to Clipboard";
                    position: absolute;
                    top: 0;
                    right: -0.5em;
                    padding: 0 0.5em;
                    background: rgba($color-blue-charcoal, 0.75);
                    text-align: center;
                    white-space: nowrap;
                    color: $color-white;
                    border-radius: 0.5em 0 0 0.5em;
                    animation: $transition-duration hint-opacity forwards;
                    transition: color $transition-duration;
                }
            }
            button.success + div {
                &::after {
                    content: "Copied to Clipboard";
                    color: $color-aquamarine;
                }
            }
        }
    }
    p {
        margin-top: 1em;
        @include fluid-font-size(1.25rem);
        font-style: italic;
        line-height: 157%;
        color: $color-cloud;
    }
    .btn-main {
        @include fluid-font-size(1.5rem);
    }
    #donate-bitcoin:hover {
        border-color: #f7931a;
    }
    #donate-litecoin:hover {
        border-color: #345d9d;
    }
    #donate-ethereum:hover {
        border-color: #8c8c8c;
    }
    #donate-polygon:hover {
        border-color: #8247e5;
    }
    #donate-solana:hover {
        border-color: #dc1fff;
    }
    #donate-cardano:hover {
        border-color: #0033ad;
    }
    #donate-siacoin:hover {
        border-color: #20ee82;
    }
    #donate-monero:hover {
        border-color: #f26822;
    }
    #donate-handshake:hover {
        border-color: #fff;
    }
    #donate-cosmos:hover {
        border-color: #6f7390;
    }
    #donate-secret:hover {
        border-color: #fff;
    }
    #donate-algorand:hover {
        border-color: #fff;
    }
    #donate-paypal {
        &:hover {
            border-color: #0070e0;
        }
        .btn-main {
            color: #fff;
            background: #0070e0;
            border-color: #0070e0;
            &:hover {
                background: inherit;
            }
        }
    }
    #donate-patreon {
        &:hover {
            border-color: #ff424d;
        }
        .btn-main {
            color: #fff;
            background: #ff424d;
            border-color: #ff424d;
            &:hover {
                background: inherit;
            }
        }
    }
    #donate-liberapay {
        &:hover {
            border-color: #f6c915;
        }
        .btn-main {
            color: #000;
            background: #f6c915;
            border-color: #f6c915;
            &:hover {
                color: inherit;
                background: inherit;
            }
        }
    }
    #donate-github {
        &:hover {
            border-color: #fff;
        }
        .btn-main {
            color: #000;
            background: #fff;
            border-color: #fff;
            &:hover {
                color: inherit;
                background: inherit;
            }
        }
    }
 }
 #qr-dialog {
    padding: 0;
    &::backdrop {
        background: rgba($color-black, 0.85);
    }
 }
@keyframes overlay-opacity {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 0.75;
    }
 }
@keyframes hint-opacity {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
 }
--- a/src/components/Donate/Methods/icons/algorand.svg
+++ b/src/components/Donate/Methods/icons/algorand.svg
@ -0,0 +1,3 @@
 <svg viewBox="0 0 113 113.4" xmlns="http://www.w3.org/2000/svg">
  <polygon fill="#fff" points="19.6 113.4 36 85 52.4 56.7 68.7 28.3 71.4 23.8 72.6 28.3 77.6 47 72 56.7 55.6 85 39.3 113.4 58.9 113.4 75.3 85 83.8 70.3 87.8 85 95.4 113.4 113 113.4 105.4 85 97.8 56.7 95.8 49.4 108 28.3 90.2 28.3 89.6 26.2 83.4 3 82.6 0 65.5 0 65.1 0.6 49.1 28.3 32.7 56.7 16.4 85 0 113.4 19.6 113.4"/>
 </svg>
--- a/src/components/Donate/Methods/icons/bitcoin.svg
+++ b/src/components/Donate/Methods/icons/bitcoin.svg
@ -0,0 +1,4 @@
 <svg viewBox="0 0 4091.27 4091.73" fill-rule="evenodd" clip-rule="evenodd" xmlns="http://www.w3.org/2000/svg">
  <path fill="#F7931A" fill-rule="nonzero" d="M4030.06 2540.77c-273.24,1096.01 -1383.32,1763.02 -2479.46,1489.71 -1095.68,-273.24 -1762.69,-1383.39 -1489.33,-2479.31 273.12,-1096.13 1383.2,-1763.19 2479,-1489.95 1096.06,273.24 1763.03,1383.51 1489.76,2479.57l0.02 -0.02z"/>
  <path fill="white" fill-rule="nonzero" d="M2947.77 1754.38c40.72,-272.26 -166.56,-418.61 -450,-516.24l91.95 -368.8 -224.5 -55.94 -89.51 359.09c-59.02,-14.72 -119.63,-28.59 -179.87,-42.34l90.16 -361.46 -224.36 -55.94 -92 368.68c-48.84,-11.12 -96.81,-22.11 -143.35,-33.69l0.26 -1.16 -309.59 -77.31 -59.72 239.78c0,0 166.56,38.18 163.05,40.53 90.91,22.69 107.35,82.87 104.62,130.57l-104.74 420.15c6.26,1.59 14.38,3.89 23.34,7.49 -7.49,-1.86 -15.46,-3.89 -23.73,-5.87l-146.81 588.57c-11.11,27.62 -39.31,69.07 -102.87,53.33 2.25,3.26 -163.17,-40.72 -163.17,-40.72l-111.46 256.98 292.15 72.83c54.35,13.63 107.61,27.89 160.06,41.3l-92.9 373.03 224.24 55.94 92 -369.07c61.26,16.63 120.71,31.97 178.91,46.43l-91.69 367.33 224.51 55.94 92.89 -372.33c382.82,72.45 670.67,43.24 791.83,-303.02 97.63,-278.78 -4.86,-439.58 -206.26,-544.44 146.69,-33.83 257.18,-130.31 286.64,-329.61l-0.07 -0.05zm-512.93 719.26c-69.38,278.78 -538.76,128.08 -690.94,90.29l123.28 -494.2c152.17,37.99 640.17,113.17 567.67,403.91zm69.43 -723.3c-63.29,253.58 -453.96,124.75 -580.69,93.16l111.77 -448.21c126.73,31.59 534.85,90.55 468.94,355.05l-0.02 0z"/>
 </svg>
--- a/src/components/Donate/Methods/icons/cardano.svg
+++ b/src/components/Donate/Methods/icons/cardano.svg
@ -0,0 +1,32 @@
 <svg version="1.1" viewBox="0 0 375 346.5" xmlns="http://www.w3.org/2000/svg">
  <path fill="#0033AD" d="M102.8,172c-0.8,13.9,9.9,25.8,23.8,26.6c0.5,0,1,0,1.5,0c14,0,25.3-11.3,25.2-25.3c0-14-11.3-25.3-25.3-25.2 C114.6,148.1,103.5,158.6,102.8,172z"/>
  <path fill="#0033AD" d="M8.6,165.5c-4.5-0.3-8.4,3.2-8.6,7.7s3.2,8.4,7.7,8.6c4.5,0.3,8.3-3.2,8.6-7.7 C16.6,169.6,13.1,165.8,8.6,165.5C8.6,165.5,8.6,165.5,8.6,165.5z"/>
  <path fill="#0033AD" d="M101.2,25.4c4-2,5.6-7,3.6-11c-2-4-7-5.6-11-3.6c-4,2-5.6,6.9-3.6,10.9C92.2,25.8,97.1,27.5,101.2,25.4 C101.1,25.4,101.2,25.4,101.2,25.4z"/>
  <path fill="#0033AD" d="M126.8,70.1c6.2-3.1,8.7-10.7,5.6-16.9s-10.7-8.7-16.9-5.6c-6.2,3.1-8.7,10.7-5.6,16.9 C113,70.7,120.6,73.2,126.8,70.1z"/>
  <path fill="#0033AD" d="M40.6,100.8c4.8,3.1,11.2,1.8,14.4-3c3.1-4.8,1.8-11.2-3-14.4c-4.8-3.1-11.2-1.8-14.4,3c0,0,0,0,0,0 C34.4,91.2,35.8,97.7,40.6,100.8z"/>
  <path fill="#0033AD" d="M55.9,161c-7-0.4-12.9,4.9-13.3,11.9s4.9,12.9,11.9,13.3c7,0.4,12.9-4.9,13.3-11.9c0,0,0,0,0,0 C68.2,167.4,62.9,161.4,55.9,161z"/>
  <path fill="#0033AD" d="M42,245.7c-5.1,2.6-7.2,8.8-4.6,14c2.6,5.1,8.8,7.2,14,4.6c5.1-2.6,7.2-8.8,4.6-14c0,0,0,0,0,0 C53.4,245.2,47.1,243.1,42,245.7C42,245.7,42,245.7,42,245.7z"/>
  <path fill="#0033AD" d="M91,134.9c6.9,4.5,16.1,2.6,20.5-4.3c4.5-6.9,2.6-16.1-4.3-20.5c-6.9-4.5-16.1-2.6-20.5,4.3 C82.2,121.2,84.1,130.4,91,134.9C91,134.9,91,134.9,91,134.9z"/>
  <path fill="#0033AD" d="M246.5,69.1c5.8,3.8,13.7,2.2,17.5-3.6s2.2-13.7-3.6-17.5c-5.8-3.8-13.7-2.2-17.5,3.6c0,0,0,0,0,0 C239,57.5,240.6,65.3,246.5,69.1C246.5,69.1,246.5,69.1,246.5,69.1z"/>
  <path fill="#0033AD" d="M272.3,24.6c3.8,2.5,8.8,1.4,11.3-2.4s1.4-8.8-2.4-11.3c-3.8-2.5-8.8-1.4-11.3,2.3 C267.5,17,268.6,22.1,272.3,24.6C272.3,24.6,272.3,24.6,272.3,24.6z"/>
  <path fill="#0033AD" d="M248.4,147.9c-13.9-0.8-25.9,9.9-26.6,23.8c-0.8,13.9,9.9,25.9,23.8,26.6c0.5,0,1,0,1.4,0 c13.9,0,25.2-11.3,25.2-25.3C272.3,159.7,261.8,148.6,248.4,147.9L248.4,147.9z"/>
  <path fill="#0033AD" d="M135.1,133.1c4.3,8.5,13,13.9,22.6,13.9c13.9,0,25.2-11.3,25.2-25.3c0-3.9-0.9-7.8-2.7-11.4 c-6.3-12.5-21.5-17.5-33.9-11.2C133.8,105.5,128.8,120.7,135.1,133.1L135.1,133.1z"/>
  <path fill="#0033AD" d="M333,100.8c5.1-2.6,7.1-8.9,4.5-14c-2.6-5.1-8.9-7.1-14-4.5c-5.1,2.6-7.1,8.8-4.6,13.9 C321.6,101.3,327.8,103.4,333,100.8C333,100.8,333,100.8,333,100.8z"/>
  <path fill="#0033AD" d="M269,108.8c-7.3,3.7-10.3,12.6-6.6,19.9c3.7,7.3,12.6,10.3,19.9,6.6c7.3-3.7,10.3-12.6,6.6-19.9 C285.2,108.1,276.3,105.2,269,108.8z"/>
  <path fill="#0033AD" d="M186.5,20.8c5.7,0.3,10.6-4.1,11-9.8s-4.1-10.6-9.8-11c-5.7-0.3-10.6,4-11,9.7 C176.4,15.5,180.8,20.4,186.5,20.8C186.5,20.8,186.5,20.8,186.5,20.8z"/>
  <path fill="#0033AD" d="M186.4,86.1c8.2,0.5,15.2-5.8,15.6-14c0.5-8.2-5.8-15.2-14-15.6c-8.2-0.5-15.2,5.8-15.6,14 C172,78.7,178.2,85.7,186.4,86.1C186.4,86.1,186.4,86.1,186.4,86.1z"/>
  <path fill="#0033AD" d="M106,237.7c7.3-3.7,10.3-12.6,6.6-19.9c-3.7-7.3-12.6-10.3-19.9-6.6c-7.3,3.7-10.3,12.6-6.6,19.9 C89.8,238.4,98.7,241.4,106,237.7z"/>
  <path fill="#0033AD" d="M196,107.8c-7.6,11.7-4.4,27.3,7.3,34.9c11.7,7.6,27.3,4.4,34.9-7.3c7.6-11.7,4.4-27.3-7.3-34.9 c-4.1-2.7-8.9-4.1-13.8-4.1C208.6,96.4,200.7,100.7,196,107.8z"/>
  <path fill="#0033AD" d="M239.9,213.4c-6.3-12.5-21.5-17.5-33.9-11.2c-12.5,6.3-17.5,21.5-11.2,33.9c6.3,12.5,21.5,17.5,33.9,11.2 c0,0,0,0,0,0c12.4-6.2,17.5-21.2,11.3-33.7C240,213.5,240,213.5,239.9,213.4z"/>
  <path fill="#0033AD" d="M284,211.6c-6.9-4.5-16.1-2.6-20.5,4.3c-4.5,6.9-2.6,16.1,4.3,20.5c6.9,4.5,16.1,2.6,20.5-4.3 C292.8,225.3,290.9,216.1,284,211.6C284,211.6,284,211.6,284,211.6z"/>
  <path fill="#0033AD" d="M332.4,173.7c0.4-7-4.9-12.9-11.9-13.3c-7-0.4-12.9,4.9-13.3,11.9c-0.4,7,4.9,12.9,11.9,13.3c0,0,0,0,0,0 C326,186,332,180.6,332.4,173.7z"/>
  <path fill="#0033AD" d="M367.3,164.7c-4.5-0.3-8.4,3.2-8.6,7.7s3.2,8.4,7.7,8.6c4.5,0.3,8.3-3.2,8.6-7.7 C375.2,168.8,371.8,165,367.3,164.7z"/>
  <path fill="#0033AD" d="M334.4,245.7c-4.8-3.1-11.2-1.8-14.4,3c-3.1,4.8-1.8,11.2,3,14.4c4.8,3.1,11.2,1.8,14.4-3 C340.6,255.3,339.2,248.8,334.4,245.7C334.4,245.7,334.4,245.7,334.4,245.7z"/>
  <path fill="#0033AD" d="M102.6,321.9c-3.8-2.5-8.8-1.4-11.3,2.3c-2.5,3.8-1.4,8.8,2.3,11.3c3.8,2.5,8.8,1.4,11.3-2.3c0,0,0,0,0,0 C107.5,329.5,106.4,324.4,102.6,321.9z"/>
  <path fill="#0033AD" d="M273.8,321.1c-4,2-5.6,7-3.6,11c2,4,7,5.6,11,3.6c4-2,5.6-6.9,3.6-10.9C282.8,320.7,277.9,319,273.8,321.1 C273.9,321.1,273.8,321.1,273.8,321.1z"/>
  <path fill="#0033AD" d="M179,238.7c7.6-11.7,4.4-27.3-7.3-35c-11.7-7.6-27.3-4.4-35,7.3s-4.4,27.3,7.3,35c4.1,2.7,8.9,4.1,13.8,4.1 C166.4,250.2,174.3,245.9,179,238.7z"/>
  <path fill="#0033AD" d="M128.5,277.4c-5.8-3.8-13.7-2.2-17.5,3.6c-3.8,5.8-2.2,13.7,3.6,17.5s13.7,2.2,17.5-3.6c0,0,0,0,0,0 C136,289.1,134.4,281.2,128.5,277.4z"/>
  <path fill="#0033AD" d="M187.4,325.7c-5.7-0.3-10.6,4.1-11,9.8s4.1,10.6,9.8,11c5.7,0.3,10.6-4,11-9.7 C197.5,331,193.1,326.1,187.4,325.7C187.4,325.7,187.4,325.7,187.4,325.7z"/>
  <path fill="#0033AD" d="M187.5,260.4c-8.2-0.5-15.2,5.8-15.6,14c-0.5,8.2,5.8,15.2,14,15.6c8.2,0.4,15.2-5.8,15.6-14 C202,267.9,195.7,260.8,187.5,260.4C187.5,260.4,187.5,260.4,187.5,260.4z"/>
  <path fill="#0033AD" d="M248.2,276.4c-6.2,3.2-8.7,10.8-5.5,17c3.2,6.2,10.8,8.7,17,5.5c6.2-3.1,8.7-10.7,5.6-16.9 C262.1,275.8,254.5,273.2,248.2,276.4C248.2,276.4,248.2,276.4,248.2,276.4z"/>
 </svg>
--- a/src/components/Donate/Methods/icons/cosmos.svg
+++ b/src/components/Donate/Methods/icons/cosmos.svg
@ -0,0 +1,11 @@
 <svg viewBox="0 0 2500 2500" xmlns="http://www.w3.org/2000/svg">
  <circle cx="1250" cy="1250" r="1250" style="fill:#2e3148"/>
  <circle cx="1250" cy="1250" r="725.31" style="fill:#1b1e36"/>
  <path d="M1252.57,159.47c-134.93,0-244.34,489.4-244.34,1093.11s109.41,1093.11,244.34,1093.11,244.34-489.4,244.34-1093.11S1387.5,159.47,1252.57,159.47ZM1269.44,2284c-15.43,20.58-30.86,5.14-30.86,5.14-62.14-72-93.21-205.76-93.21-205.76-108.69-349.79-82.82-1100.82-82.82-1100.82,51.08-596.24,144-737.09,175.62-768.36a19.29,19.29,0,0,1,24.74-2c45.88,32.51,84.36,168.47,84.36,168.47,113.63,421.81,103.34,817.9,103.34,817.9,10.29,344.65-56.94,730.45-56.94,730.45C1341.92,2222.22,1269.44,2284,1269.44,2284Z" style="fill:#6f7390"/>
  <path d="M2200.72,708.59c-67.18-117.08-546.09,31.58-1070,332s-893.47,638.89-826.34,755.92,546.09-31.58,1070-332,893.47-638.89,826.34-755.92h0ZM366.36,1780.45c-25.72-3.24-19.91-24.38-19.91-24.38C378,1666.36,478.4,1572.84,478.4,1572.84c249.43-268.36,913.79-619.65,913.79-619.65,542.54-252.42,711.06-241.77,753.81-230a19.29,19.29,0,0,1,14,20.58c-5.14,56-104.17,157-104.17,157C1746.71,1209.36,1398,1397.58,1398,1397.58c-293.83,180.5-661.93,314.09-661.93,314.09-280.09,100.93-369.7,68.78-369.7,68.78h0Z" style="fill:#6f7390"/>
  <path d="M2198.35,1800.41c67.7-116.77-300.93-456.79-823-759.47S374.43,587.76,306.79,704.73s300.93,456.79,823.3,759.47S2130.71,1917.39,2198.35,1800.41ZM351.65,749.85c-10-23.71,11.11-29.42,11.11-29.42C456.22,702.78,587.5,743,587.5,743c357.15,81.33,994,480.25,994,480.25,490.33,343.11,565.53,494.24,576.8,537.14a19.29,19.29,0,0,1-10.7,22.43c-51.13,23.41-188.07-11.47-188.07-11.47-422.07-113.17-759.62-320.52-759.62-320.52-303.29-163.58-603.19-415.28-603.19-415.28-227.88-191.87-245-285.44-245-285.44Z" style="fill:#6f7390"/>
  <circle cx="1250" cy="1250" r="128.6" style="fill:#b7b9c8"/>
  <ellipse cx="1777.26" cy="756.17" rx="74.59" ry="77.16" style="fill:#b7b9c8"/>
  <ellipse cx="552.98" cy="1018.52" rx="74.59" ry="77.16" style="fill:#b7b9c8"/>
  <ellipse cx="1098.25" cy="1965.02" rx="74.59" ry="77.16" style="fill:#b7b9c8"/>
 </svg>
--- a/src/components/Donate/Methods/icons/ethereum.svg
+++ b/src/components/Donate/Methods/icons/ethereum.svg
@ -0,0 +1,8 @@
 <svg version="1.1" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 784.37 1277.39" xmlns="http://www.w3.org/2000/svg">
  <polygon fill="#343434" fill-rule="nonzero" points="392.07,0 383.5,29.11 383.5,873.74 392.07,882.29 784.13,650.54"/>
  <polygon fill="#8C8C8C" fill-rule="nonzero" points="392.07,0 -0,650.54 392.07,882.29 392.07,472.33"/>
  <polygon fill="#3C3C3B" fill-rule="nonzero" points="392.07,956.52 387.24,962.41 387.24,1263.28 392.07,1277.38 784.37,724.89"/>
  <polygon fill="#8C8C8C" fill-rule="nonzero" points="392.07,1277.38 392.07,956.52 -0,724.89"/>
  <polygon fill="#141414" fill-rule="nonzero" points="392.07,882.29 784.13,650.54 392.07,472.33"/>
  <polygon fill="#393939" fill-rule="nonzero" points="0,650.54 392.07,882.29 392.07,472.33"/>
 </svg>
--- a/src/components/Donate/Methods/icons/handshake.svg
+++ b/src/components/Donate/Methods/icons/handshake.svg
@ -0,0 +1,3 @@
 <svg version="1.1" viewBox="0 0 2000 2088.9" xmlns="http://www.w3.org/2000/svg">
  <path fill="currentColor" clip="evenodd" d="M1726.6,681.4l-129.8-230.6l251.5,0.1c6.7,0,14.6,4.5,18.2,10.5c4,6.6,24.4,40.3,49,80.7 c29.4,48.4,64.5,106.3,84.6,139.3H1726.6z M1261.4,2078c-6.1,10.9-14,10.9-16.6,10.9h-102.8c-54.4,0-117.1-0.1-154.5-0.1 l399.6-717.4c10.4-18.5,3.7-42-14.8-52.3c-5.7-3.2-12.1-4.9-18.6-4.9l0,0l-681,0.9l-135.5-234.5h992c0.1,0,0.2,0,0.3,0s0.2,0,0.3,0 c0.6,0,1.1-0.2,1.6-0.2c2.2-0.1,4.4-0.4,6.6-0.9c1.6-0.4,3.3-0.9,4.8-1.5c0.8-0.3,1.7-0.7,2.5-1c7.7-3.3,14.1-9.1,18.2-16.5 L1727,758.2h270L1261.4,2078z M921.1,2050.7c-8.7-14.3-20-32.9-32.3-53.1c-41.3-68.2-94.2-155.5-100.2-165.1 c-2-3.2-2.9-11.1,1.3-18.7c9.6-17.2,190.4-343,234.5-422.4l264.1-0.3L921.1,2050.7z M470.8,1601.8l-131.3-233.2l132.3-248 l132.7,229.7C563.3,1428,498.9,1549.1,470.8,1601.8z M294.6,1638.1c-66.8,0-133.3,0-143,0l0,0c-6.5,0-14.4-4.6-18-10.5l-42.7-70.4 C60.4,1507,21.5,1442.9,0,1407.5h273.4l129.8,230.6C374.9,1638.1,334.8,1638.1,294.6,1638.1L294.6,1638.1z M738.6,11 c6.1-11,14-11,16.5-11h258.3L612.7,717.4c-0.3,0.6-0.5,1.2-0.8,1.9c-0.6,1.2-1.1,2.4-1.6,3.7c-0.4,1.2-0.8,2.4-1.1,3.7 s-0.6,2.3-0.8,3.5c-0.2,1.4-0.4,2.8-0.4,4.3c0,0.6-0.2,1.2-0.2,1.9c0,0.5,0.1,0.9,0.2,1.4c0,1.4,0.2,2.8,0.4,4.2 c0.1,1.2,0.3,2.3,0.6,3.5c0.3,1.2,0.7,2.4,1.1,3.6c0.4,1.2,0.8,2.3,1.3,3.5s1.1,2.2,1.7,3.2s1.2,2.1,2,3.1c0.7,1,1.5,2,2.4,2.9 c0.8,0.9,1.6,1.8,2.5,2.7s1.8,1.5,2.8,2.3c1.1,0.8,2.2,1.6,3.3,2.3c0.4,0.3,0.8,0.6,1.2,0.9s0.9,0.3,1.4,0.6c2,1,4.1,1.9,6.2,2.5 c0.8,0.2,1.5,0.5,2.3,0.7c2.8,0.7,5.7,1.1,8.7,1.1c0,0,0,0,0.1,0h0.1h17c0.1,0,0.2,0,0.2,0l0,0l663.9-0.9 c17.6,30.5,50.4,88,78.3,136.9c21.4,37.6,39.2,68.6,53.2,93h-988c-0.4,0-0.8,0.1-1.3,0.2c-13.9,0.1-26.6,7.9-33.2,20.1l-163.6,306.6 H3.1C120.8,1119.3,730.7,25,738.6,11z M1079.4,39.1l24,39.5c42.1,69.5,101.6,167.6,107.9,177.8c2,3.2,2.9,11.1-1.3,18.7L975.6,697.3 l-264,0.3L1079.4,39.1z M1529.1,486.9l131.3,233.3l-133.9,247.5c-16-27.8-35.8-62.6-54.4-95.2c-36.8-64.4-63.6-111.3-78.7-137.5 C1422.1,682.8,1497.5,544.5,1529.1,486.9z"/>
 </svg>
--- a/src/components/Donate/Methods/icons/litecoin.svg
+++ b/src/components/Donate/Methods/icons/litecoin.svg
@ -0,0 +1,4 @@
 <svg viewBox="0 0 82.6 82.6" xmlns="http://www.w3.org/2000/svg">
  <circle cx="41.3" cy="41.3" r="36.83" style="fill:#fff"/>
  <path d="M41.3,0A41.3,41.3,0,1,0,82.6,41.3h0A41.18,41.18,0,0,0,41.54,0ZM42,42.7,37.7,57.2h23a1.16,1.16,0,0,1,1.2,1.12v.38l-2,6.9a1.49,1.49,0,0,1-1.5,1.1H23.2l5.9-20.1-6.6,2L24,44l6.6-2,8.3-28.2a1.51,1.51,0,0,1,1.5-1.1h8.9a1.16,1.16,0,0,1,1.2,1.12v.38L43.5,38l6.6-2-1.4,4.8Z" style="fill:#345d9d"/>
 </svg>
--- a/src/components/Donate/Methods/icons/monero.svg
+++ b/src/components/Donate/Methods/icons/monero.svg
@ -0,0 +1,5 @@
 <svg viewBox="0 0 3756.09 3756.49" xmlns="http://www.w3.org/2000/svg">
  <path d="M4128,2249.81C4128,3287,3287.26,4127.86,2250,4127.86S372,3287,372,2249.81,1212.76,371.75,2250,371.75,4128,1212.54,4128,2249.81Z" transform="translate(-371.96 -371.75)" style="fill:#fff"/>
  <path d="M2250,371.75c-1036.89,0-1879.12,842.06-1877.8,1878,0.26,207.26,33.31,406.63,95.34,593.12h561.88V1263L2250,2483.57,3470.52,1263v1579.9h562c62.12-186.48,95-385.85,95.37-593.12C4129.66,1212.76,3287,372,2250,372Z" transform="translate(-371.96 -371.75)" style="fill:#f26822"/>
  <path d="M1969.3,2764.17l-532.67-532.7v994.14H1029.38l-384.29.07c329.63,540.8,925.35,902.56,1604.91,902.56S3525.31,3766.4,3855,3225.6H3063.25V2231.47l-532.7,532.7-280.61,280.61-280.62-280.61h0Z" transform="translate(-371.96 -371.75)" style="fill:#4d4d4d"/>
 </svg>
--- a/src/components/Donate/Methods/icons/polygon.svg
+++ b/src/components/Donate/Methods/icons/polygon.svg
@ -0,0 +1,3 @@
 <svg version="1.1" viewBox="0 0 38.4 33.5" xmlns="http://www.w3.org/2000/svg">
  <path fill="#8247E5" d="M29,10.2c-0.7-0.4-1.6-0.4-2.4,0L21,13.5l-3.8,2.1l-5.5,3.3c-0.7,0.4-1.6,0.4-2.4,0L5,16.3 c-0.7-0.4-1.2-1.2-1.2-2.1v-5c0-0.8,0.4-1.6,1.2-2.1l4.3-2.5c0.7-0.4,1.6-0.4,2.4,0L16,7.2c0.7,0.4,1.2,1.2,1.2,2.1v3.3l3.8-2.2V7 c0-0.8-0.4-1.6-1.2-2.1l-8-4.7c-0.7-0.4-1.6-0.4-2.4,0L1.2,5C0.4,5.4,0,6.2,0,7v9.4c0,0.8,0.4,1.6,1.2,2.1l8.1,4.7 c0.7,0.4,1.6,0.4,2.4,0l5.5-3.2l3.8-2.2l5.5-3.2c0.7-0.4,1.6-0.4,2.4,0l4.3,2.5c0.7,0.4,1.2,1.2,1.2,2.1v5c0,0.8-0.4,1.6-1.2,2.1 L29,28.8c-0.7,0.4-1.6,0.4-2.4,0l-4.3-2.5c-0.7-0.4-1.2-1.2-1.2-2.1V21l-3.8,2.2v3.3c0,0.8,0.4,1.6,1.2,2.1l8.1,4.7 c0.7,0.4,1.6,0.4,2.4,0l8.1-4.7c0.7-0.4,1.2-1.2,1.2-2.1V17c0-0.8-0.4-1.6-1.2-2.1L29,10.2z"/>
 </svg>
--- a/src/components/Donate/Methods/icons/secret.svg
+++ b/src/components/Donate/Methods/icons/secret.svg
@ -0,0 +1,10 @@
 <svg version="1.1" viewBox="0 0 122 122" xmlns="http://www.w3.org/2000/svg">
  <style type="text/css">
    .st0{fill:#1B1B1B;stroke:#FFFFFF;stroke-width:4;}
    .st1{fill-rule:evenodd;clip-rule:evenodd;fill:#FFFFFF;}
    .st2{fill:none;stroke:#FFFFFF;stroke-width:2;stroke-linecap:round;}
  </style>
  <circle class="st0" cx="61" cy="61" r="59"/>
  <path class="st1" d="M78.3,43.7c0.8,0.8,2.1,0.7,2.7-0.2c0.6-0.7,0.5-1.8-0.2-2.4c-6.6-6.3-12.5-9.5-22.3-9 C48.2,32.6,39.1,38,39.7,49.4C40.2,59.5,50,63.2,58.6,66.5c6.6,2.5,12.4,4.7,12.7,9.4c0.3,5.2-5,8.3-9.6,8.6 c-8.7,0.5-13.8-2.6-19.5-8.1c-0.7-0.7-1.8-0.7-2.5-0.1c-0.8,0.7-0.8,1.9-0.1,2.7c6.4,6.4,13,9.6,22.6,9.1C71.8,87.4,83.6,82,83,70.6 c-0.5-9.9-9.9-13.6-18.4-16.8c-7-2.7-13.5-5.2-13.8-10.9c-0.2-4.1,4.7-7.1,8.2-7.3C67.5,35.2,72.8,38.2,78.3,43.7z M79.4,70.8 c0,4.4-2.4,8.2-6,10.4l-0.2-0.1c1.3-1.8,1.5-4.1,1.5-6.3c0-6.5-7.1-9-14.6-11.7c-8.3-3-17-6.1-17-14.9c0-4,1.8-8.3,5.3-10.3l0.1,0.2 c-0.9,1.9-1.3,4-1.3,6.1c0,7.2,7.9,10.1,15.9,13.1C71.3,60.3,79.4,63.3,79.4,70.8z"/>
  <path class="st2" d="M60.5,108c26.2,0,47.5-21.3,47.5-47.5S86.7,13,60.5,13S13,34.3,13,60.5S34.3,108,60.5,108z"/>
 </svg>
--- a/src/components/Donate/Methods/icons/siacoin.svg
+++ b/src/components/Donate/Methods/icons/siacoin.svg
@ -0,0 +1,5 @@
 <svg viewBox="0 0 404.03 404.04" xmlns="http://www.w3.org/2000/svg">
  <path fill="#20ee82" d="M262.65,202v60.6H202a60.6,60.6,0,1,1,60.6-60.6m-59.8-101a101,101,0,1,0-6,202H303v-99.8c0-55.7-44.5-101.8-100.2-102.2"/>
  <path fill="#7f8c8d" d="M344.85,59.17a202,202,0,0,0-254.2-25.7,40.5,40.5,0,0,1,5.8,8.3,192.2,192.2,0,0,1,241.2,24.6c74.8,74.7,74.8,196.4,0,271.2s-196.5,74.8-271.3,0a192.2,192.2,0,0,1-24.5-241.2,40.1,40.1,0,0,1-8.3-5.8c-61.55,93-36,218.37,57,279.92s218.37,36,279.92-57A202,202,0,0,0,344.85,59.17"/>
  <path fill="#20ee82" d="M46.45,46.37a20.2,20.2,0,1,1,.07,28.57l-0.07-.07a20.2,20.2,0,0,1,0-28.5"/>
 </svg>
--- a/src/components/Donate/Methods/icons/solana.svg
+++ b/src/components/Donate/Methods/icons/solana.svg
@ -0,0 +1,17 @@
 <svg version="1.1" viewBox="0 0 397.7 311.7" xmlns="http://www.w3.org/2000/svg">
  <linearGradient id="solana_gr1" gradientUnits="userSpaceOnUse" x1="360.8791" y1="351.4553" x2="141.213" y2="-69.2936" gradientTransform="matrix(1 0 0 -1 0 314)">
    <stop offset="0" style="stop-color:#00FFA3"/>
    <stop offset="1" style="stop-color:#DC1FFF"/>
  </linearGradient>
  <path fill="url('#solana_gr1')" d="M64.6,237.9c2.4-2.4,5.7-3.8,9.2-3.8h317.4c5.8,0,8.7,7,4.6,11.1l-62.7,62.7c-2.4,2.4-5.7,3.8-9.2,3.8H6.5 c-5.8,0-8.7-7-4.6-11.1L64.6,237.9z"/>
  <linearGradient id="solana_gr2" gradientUnits="userSpaceOnUse" x1="264.8291" y1="401.6014" x2="45.163" y2="-19.1475" gradientTransform="matrix(1 0 0 -1 0 314)">
    <stop offset="0" style="stop-color:#00FFA3"/>
    <stop offset="1" style="stop-color:#DC1FFF"/>
  </linearGradient>
  <path fill="url('#solana_gr2')" d="M64.6,3.8C67.1,1.4,70.4,0,73.8,0h317.4c5.8,0,8.7,7,4.6,11.1l-62.7,62.7c-2.4,2.4-5.7,3.8-9.2,3.8H6.5 c-5.8,0-8.7-7-4.6-11.1L64.6,3.8z"/>
  <linearGradient id="solana_gr3" gradientUnits="userSpaceOnUse" x1="312.5484" y1="376.688" x2="92.8822" y2="-44.061" gradientTransform="matrix(1 0 0 -1 0 314)">
    <stop offset="0" style="stop-color:#00FFA3"/>
    <stop offset="1" style="stop-color:#DC1FFF"/>
  </linearGradient>
  <path fill="url('#solana_gr3')" d="M333.1,120.1c-2.4-2.4-5.7-3.8-9.2-3.8H6.5c-5.8,0-8.7,7-4.6,11.1l62.7,62.7c2.4,2.4,5.7,3.8,9.2,3.8h317.4 c5.8,0,8.7-7,4.6-11.1L333.1,120.1z"/>
 </svg>
--- a/src/components/Donate/Why/Why.astro
+++ b/src/components/Donate/Why/Why.astro
@ -0,0 +1,24 @@
 ---
 import './Why.scss';
 ---
 <section id="why">
  <div class="feature-group">
    <h2>Help us break the pattern</h2>
    <h3>Why should I donate to Lume?</h3>
    <ul>
      <li>You believe the internet should be free and open for everyone, regardless of political beliefs.</li>
      <li>You want a neutral web accessible to everyday people.</li>
      <li>You believe your data should be private and secure unless you choose to share it.</li>
      <li>You want to ensure that you or someone else can’t be censored or “de-platformed.”</li>
      <li>You think people should have free access to information no matter how they choose to access it.</li>
      <li>You believe in handling web abuse using legal and social means instead of censorship and restriction.</li>
    </ul>
    <p>
      Every single day you use the Internet, your data is sold to companies to pay for your usage. Help us break the pattern by funding the creation of free and open-source Web3 tools.
    </p>
    <div>
      <a href="#methods" class="btn-main">Donate</a>
    </div>
  </div>
 </section>
--- a/src/components/Donate/Why/Why.scss
+++ b/src/components/Donate/Why/Why.scss
@ -0,0 +1,50 @@
@import "/src/styles/vars.scss";
 #why {
  position: relative;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  max-width: 185.6em;
  min-height: 58.8em;
  margin: 0 auto;
  &::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: min(0em, calc((100% - 92.2em) / 2));
    width: calc(100% - 64em - 7.5%);
    min-width: 92.2em;
    background-image: url("/src/assets/single-brand-bg-2.png");
    background-position: 50% 0;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: -1;
  }
  .feature-group {
    box-sizing: content-box;
    margin: 2em 7.5%;
    max-width: 64em;
  }
  @media screen and (max-width: 80rem) {
    ul, p {
      background: rgba($color-blue-charcoal-2, 0.75);
    }
    ul {
      border-radius: 0.5em 0.5em 0 0;
      padding: 0.3em 0.5em 0.3em 1.5em;
      margin: -0.3em -0.5em 0.28em;
    }
    p {
      border-radius: 0 0 0.5em 0.5em;
      padding: 0.3em 0.5em;
      margin: -0.3em -0.5em;
    }
  }
 }
--- a/src/components/Home/CTO/CTO.astro
+++ b/src/components/Home/CTO/CTO.astro
@ -0,0 +1,32 @@
 ---
 import avatar from "/src/assets/cto-avatar.png";
 import abstractBg from "/src/assets/single-brand-bg-1.png";
 ---
 <section id="cto" class="w-full my-24 flex flex-row">
  <div class="flex flex-col mx-10 sm:mx-20 xl:mx-40 lg:max-w-xl gap-y-10">
    <h2
      class="font-display text-primary font-bold text-xl md:text-2xl uppercase"
    >
      Community-Powered
    </h2>
    <h3 class="font-display text-4xl md:text-6xl font-bold">
      Building a new world for your data
    </h3>
    <p class="font-body text-xl md:text-3xl text-body">
      Right now, Lume has only one full-time developer and limited helper staff!
      We need help from developers, fundraisers, funders, and contributors to
      bring the new internet to the masses.
    </p>
    <div class="flex flex-row items-center gap-6">
      <img src={avatar.src} class="w-20 h-20" />
      <div class="flex flex-col font-body">
        <h6 class="text-xl">Derrick Hammer</h6>
        <p class="text-lg text-body">CTO</p>
      </div>
    </div>
  </div>
  <div class="float-right w-1/2 -z-10 max-w-7xl">
    <img src={abstractBg.src} class="absolute max-xl:right-0 w-[800px]" />
  </div>
 </section>
--- a/src/components/Home/Meme/Meme.astro
+++ b/src/components/Home/Meme/Meme.astro
@ -0,0 +1,38 @@
 ---
 import mulletMeme from "/src/assets/centralized-mullet-meme.png";
 ---
 <section id="meme" class="tilted-bg">
  <div class="flex flex-col-reverse lg:flex-row gap-10 mx-10 sm:mx-20 xl:mx-40">
    <div class="space-y-10">
      <h2
        class="font-display text-primary font-bold text-xl md:text-2xl uppercase"
      >
        BUSTING THE DECENTERALIZED WEB3 MYTH
      </h2>
      <h3 class="font-display text-4xl md:text-6xl font-bold">
        The Centralized Mullet
      </h3>
      <p class="font-body text-xl md:text-3xl text-body">
        Right now, despite many claims, a majority, if not all, the services
        that build the legos of Web3 are actually centralized, both with what
        you can see and what you can't.
      </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">
        So consider this a call to action for our community to go back to ethos
        and make Web3 real.
      </p>
    </div>
    <img
      src={mulletMeme.src}
      class="w-[500px] xl:w-[550px] max-h-[650px] self-center"
      alt="Web 1"
      style="padding-bottom: 3em"
    />
  </div>
 </section>
--- a/src/components/Home/Message/Message.astro
+++ b/src/components/Home/Message/Message.astro
@ -0,0 +1,12 @@
 ---
 import './Message.scss';
 ---
 <section id="message">
  <h2>
    A message from Derrick
  </h2>
  <p>
    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>
 </section>
--- a/src/components/Home/Message/Message.scss
+++ b/src/components/Home/Message/Message.scss
@ -0,0 +1,27 @@
@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%;
  }
 }
--- a/src/components/Home/PoweredBy/PoweredBy.astro
+++ b/src/components/Home/PoweredBy/PoweredBy.astro
@ -0,0 +1,22 @@
 ---
 import './PoweredBy.scss';
 import svgSia from '/src/assets/icons/sia.svg?raw';
 import svgHns from '/src/assets/icons/hns.svg?raw';
 import svgOsi from '/src/assets/icons/osi.svg?raw';
 ---
 <section id="powered-by">
  <h2>Powered By</h2>
  <div>
    <a href="https://sia.tech" title="Sia" class="sia-logo">
      <Fragment set:html={svgSia} />
    </a>
    <a href="https://handshake.org" title="Handshake" class="hns-logo">
      <Fragment set:html={svgHns} />
    </a>
    <a href="https://opensource.org/osd/" title="Open Source Initiative" class="osi-logo">
      <Fragment set:html={svgOsi} />
    </a>
  </div>
 </section>
--- a/src/components/Home/PoweredBy/PoweredBy.scss
+++ b/src/components/Home/PoweredBy/PoweredBy.scss
@ -0,0 +1,54 @@
@import "/src/styles/mixins.scss";
@import "/src/styles/vars.scss";
 #powered-by {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4em;
  margin: 12em 7.5%;
  @media screen and (max-width: 47.99999rem) {
    flex-direction: column;
    gap: 2.5em;
  }
  div {
    display: flex;
    align-items: center;
    gap: 2.5em;
  }
  h2 {
    @include fluid-font-size(1.5625rem);
    font-weight: 700;
    line-height: 100%;
    text-transform: uppercase;
    color: $color-aquamarine;
    @media screen and (min-width: 48rem) {
      margin-top: 0.75em;
    }
  }
  a {
    padding: 0.5em;
    color: $color-alto;
    &:hover {
      color: $color-white;
    }
  }
  .sia-logo svg {
    @include fluid-width(5.5rem);
  }
  .hns-logo svg {
    @include fluid-width(4.5rem);
  }
  .osi-logo svg {
    @include fluid-width(4.5rem);
  }
 }
--- a/src/components/Home/Socials/Socials.astro
+++ b/src/components/Home/Socials/Socials.astro
@ -0,0 +1,26 @@
 ---
 import './Socials.scss';
 import svgGit from '/src/assets/icons/git.svg?raw';
 import svgGithub from '/src/assets/icons/github.svg?raw';
 import svgDiscord from '/src/assets/icons/discord.svg?raw';
 import svgTwitter from '/src/assets/icons/twitter.svg?raw';
 ---
 <section id="socials">
    <h2>Get in touch</h2>
    <div>
        <a href="https://git.lumeweb.com" title="Git" class="git-logo">
            <Fragment set:html={svgGit} />
        </a>
        <a href="https://github.com/LumeWeb" title="GitHub" class="github-logo">
            <Fragment set:html={svgGithub} />
        </a>
        <a href="https://discord.gg/qpC8ADp3rS" title="Discord" class="discord-logo">
            <Fragment set:html={svgDiscord} />
        </a>
        <a href="https://twitter.com/lumeweb3" title="Twitter" class="twitter-logo">
            <Fragment set:html={svgTwitter} />
        </a>
    </div>
 </section>
--- a/src/components/Home/Socials/Socials.scss
+++ b/src/components/Home/Socials/Socials.scss
@ -0,0 +1,50 @@
@import "/src/styles/mixins.scss";
@import "/src/styles/vars.scss";
 #socials {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3em;
    margin: 12em 7.5% 8em;
    div {
        display: flex;
        align-items: center;
        gap: 2.5em;
    }
    h2 {
        @include fluid-font-size(1.5625rem);
        font-weight: 700;
        line-height: 100%;
        text-transform: uppercase;
        color: $color-aquamarine;
    }
    a {
        padding: 0.5em;
        color: $color-alto;
        &:hover {
            color: $color-white;
        }
    }
    .github-logo svg {
        @include fluid-width(3.5rem);
    }
    .git-logo svg {
        @include fluid-width(3.5rem);
    }
    .discord-logo svg {
        @include fluid-width(3.5rem);
    }
    .twitter-logo svg {
        @include fluid-width(3.5rem);
    }
 }
--- a/src/components/Home/Typewriter/Typewriter.astro
+++ b/src/components/Home/Typewriter/Typewriter.astro
@ -0,0 +1,22 @@
 ---
 import bg from "../../../assets/home-hero-bg.webp"
 import TypewriterContent from "./TypewriterContent.jsx";
 ---
 <div class="absolute -z-10 -right-[250px] top-[250px] w-[1250px]">
  <img
    class="object-contain w-[1250px]"
    src={bg.src}
  />
 </div>
 <section
  id="typewriter"
  class="w-full overflow-hidden flex flex-row items-center justify-center"
 >
  <h1
    class="text-7xl md:text-9xl mt-10 mb-10 min-h-[375px] max-w-full px-10 text-center"
  >
    <TypewriterContent client:load />
  </h1>
 </section>
--- a/src/components/Home/Typewriter/TypewriterContent.jsx
+++ b/src/components/Home/Typewriter/TypewriterContent.jsx
@ -0,0 +1,26 @@
 import Typewriter from "typewriter-effect";
 const HeaderContent = () => {
  var
    headerStrings = [
      'Access to the web <br /> for the masses',
      'An open web for business',
      'Web3 for the masses',
      'Web3 for you'
    ],
    randomString = headerStrings[Math.floor(Math.random() * headerStrings.length)],
    words = randomString.split(' ');
  return (
    <Typewriter options={{ cursor: '<span class="text-primary">_</span>' }} onInit={(typewriter) => {
      typewriter
        .changeDelay(50)
        .typeString(randomString.substring(0, randomString.lastIndexOf(' ')) + ' ')
        .start();
      typewriter
        .typeString('<span class="text-primary">' + words[words.length - 1] + '</span>')
    }} />
  );
 };
 export default HeaderContent;
--- a/src/components/Home/Vision/Vision.astro
+++ b/src/components/Home/Vision/Vision.astro
@ -0,0 +1,23 @@
 <section
  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"
 >
  <h2 class="font-display text-primary font-bold text-xl md:text-2xl uppercase">
    Our Vision
  </h2>
  <h3 class="font-display text-4xl md:text-6xl font-bold">
    Make Web3 easy for everyone
  </h3>
  <p class="font-body text-xl md:text-3xl text-body">
    Web3 offers freedom of speech, data sovereignty, and privacy. We simplify
    Web3 by bridging the gap between the two webs, enabling easy usage without
    censorship or backdoors over your personal web.
  </p>
  <div class="pt-10 w-full">
    <a
      href="#"
      class="text-2xl w-full block text-center md:max-w-[350px] rounded-md bg-primary py-3 px-10 text-black font-body"
      >Download Extension</a
    >
  </div>
 </section>
--- a/src/components/Home/Web3/Web3.astro
+++ b/src/components/Home/Web3/Web3.astro
@ -0,0 +1,33 @@
 ---
 import gfxLeft from "../../../assets/home-gfx-left.png"
 ---
 <section
  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"
 >
  <div class="flex-1 -ml-10 -mr-20 lg:-ml-40 lg:mr-0">
    <img src={gfxLeft.src} class="w-full" />
  </div>
  <div class="flex-1 -mt-40 space-y-10 flex flex-col justify-center">
    <h2
      class="font-display text-primary font-bold text-xl md:text-2xl uppercase"
    >
      What is the Web?
    </h2>
    <h3 class="font-display text-4xl md:text-6xl font-bold">
      Why Web3 matters
    </h3>
    <p class="font-body text-xl md:text-3xl text-body">
      Web3 gives people control over their data, privacy, and ownership. Lume's
      affordable Web3 tech aims to speed up the transition from Web2 to Web3,
      which matters for privacy and security.
    </p>
    <div class="pt-10 w-full">
      <a
        href="#"
        class="text-2xl w-full block text-center md:max-w-[250px] rounded-md bg-primary py-3 px-10 text-[black] font-body"
        >Learn More</a
      >
    </div>
  </div>
 </section>
--- a/src/components/Home/WebComparison/WebComparison.astro
+++ b/src/components/Home/WebComparison/WebComparison.astro
@ -0,0 +1,135 @@
 ---
 import meme1 from "/src/assets/meme-1.png";
 import meme2 from "/src/assets/meme-2.png";
 import meme3 from "/src/assets/meme-3.png";
 import meme4 from "/src/assets/meme-4.png";
 import meme1Small from "/src/assets/meme-1-small.png";
 import meme2Small from "/src/assets/meme-2-small.png";
 import meme3Small from "/src/assets/meme-3-small.png";
 import meme4Small from "/src/assets/meme-4-small.png";
 ---
 <section
  class="flex flex-col w-full border-y border-dark-aquamarine divide-y divide-dark-aquamarine lg:h-[1200px]"
 >
  <!-- MEME GRID BIG -->
  <div
    class="hidden lg:flex flex-1 flex-row w-full divide-x divide-dark-aquamarine"
  >
    <div class="relative flex-1 w-1/2 h-full max-w-full overflow-hidden">
      <img
        src={meme1.src}
        alt=""
        class="absolute bottom-0 -left-[100px] object-contain xl:-left-5 float-left"
      />
      <span class="float-right mt-16 w-[300px] space-y-10 mr-5">
        <h3 class="font-display text-6xl">Web1</h3>
        <p class="font-body text-2xl text-body">
          Nostalgically recalled for chat rooms and IRC by tech enthusiasts,
          signifies the era of integrated services like AOL dial-up, providing
          web access, email, shopping, and chat for mainstream users.
        </p>
      </span>
    </div>
    <div class="relative flex-1 max-w-full overflow-hidden">
      <img
        src={meme2.src}
        alt=""
        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">
        <h3 class="font-display text-6xl">Web2</h3>
        <p class="font-body text-2xl text-body">
          Featuring improved gaming, online apps, and video streaming, was
          swiftly monopolized by Silicon Valley, creating a top-down system
          controlled by a few tech elites. Despite innovations, this system,
          including the broader internet infrastructure like ISPs and domains,
          regulates your web experience, often citing "safety".
        </p>
      </span>
    </div>
  </div>
  <div
    class="hidden lg:flex flex-1 flex-row w-full divide-x divide-dark-aquamarine"
  >
    <div class="relative flex-1">
      <img
        src={meme3.src}
        alt=""
        class="absolute bottom-0 -left-[110px] xl:-left-5 float-left"
      />
      <span class="float-right mt-16 w-[300px] space-y-10 mr-1 xl:mr-5">
        <h3 class="font-display text-6xl">Crypto/<br />DeFi</h3>
        <p class="font-body text-2xl text-body">
          The advent of Bitcoin sparked innovation, but over time,
          centralization increased. Factors such as the influx of big money,
          greed, hype, and FOMO contributed to this trend. The introduction of
          many money legos worsened the situation, leading to boom and bust
          cycles.
        </p>
      </span>
    </div>
    <div class="relative flex-1 max-w-full overflow-hidden">
      <img
        src={meme4.src}
        alt=""
        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">
        <h3 class="font-display text-6xl">Web3</h3>
        <p class="font-body text-2xl text-body">
          Web3 emerged as a buzzword to replace DeFi, but its meaning varies.
          Despite aiming for decentralization, Web3 relies on centralized
          crypto/DeFi infrastructure. Money dominates over ideology, driven by
          funders. A balance is necessary between free markets and public goods
          to address the current imbalance.
        </p>
      </span>
    </div>
  </div>
  <!-- MEME GRID BIG -->
  <!-- MEME GRID SMALL -->
  <div class="lg:hidden flex flex-col gap-8 py-10 px-8">
    <h3 class="font-display text-3xl">Web1</h3>
    <p class="font-body text-body text-xl">
      Nostalgically recalled for chat rooms and IRC by tech enthusiasts,
      signifies the era of integrated services like AOL dial-up, providing web
      access, email, shopping, and chat for mainstream users.
    </p>
    <img src={meme1Small.src} class="-mb-10 w-60 self-center" />
  </div>
  <div class="lg:hidden flex flex-col gap-8 py-10 px-8">
    <h3 class="font-display text-3xl">Web2</h3>
    <p class="font-body text-body text-xl">
      Featuring improved gaming, online apps, and video streaming, was swiftly
      monopolized by Silicon Valley, creating a top-down system controlled by a
      few tech elites. Despite innovations, this system, including the broader
      internet infrastructure like ISPs and domains, regulates your web
      experience, often citing "safety".
    </p>
    <img src={meme2Small.src} class="-mb-10 w-60 self-center" />
  </div>
  <div class="lg:hidden flex flex-col gap-8 py-10 px-8">
    <h3 class="font-display text-3xl">Crypto/DeFi</h3>
    <p class="font-body text-body text-xl">
      The advent of Bitcoin sparked innovation, but over time, centralization
      increased. Factors such as the influx of big money, greed, hype, and FOMO
      contributed to this trend. The introduction of many money legos worsened
      the situation, leading to boom and bust cycles.
    </p>
    <img src={meme3Small.src} class="-mb-10 w-60 self-center" />
  </div>
  <div class="lg:hidden flex flex-col gap-8 py-10 px-8">
    <h3 class="font-display text-3xl">Web3</h3>
    <p class="font-body text-body text-xl">
      Web3 emerged as a buzzword to replace DeFi, but its meaning varies.
      Despite aiming for decentralization, Web3 relies on centralized
      crypto/DeFi infrastructure. Money dominates over ideology, driven by
      funders. A balance is necessary between free markets and public goods to
      address the current imbalance.
    </p>
    <img src={meme4Small.src} class="-mb-10 w-60 self-center" />
  </div>
  <!-- MEME GRID SMALL -->
 </section>
--- a/src/components/Layout/Footer/Footer.astro
+++ b/src/components/Layout/Footer/Footer.astro
@ -0,0 +1,64 @@
 ---
 import "./Footer.scss";
 import logo from "/src/assets/lume-logo.png";
 ---
 <footer>
  <div>
    <div class="footer-logo">
      <a href="/">
        <img src={logo.src} alt="Lume">
      </a>
    </div>
    <div class="footer-contact">
      <a href="mailto:contact@lumeweb.com">
        <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>
        contact@lumeweb.com
      </a>
    </div>
    <div class="footer-phrase">Freedom. Privacy. Ownership.</div>
  </div>
  <div>
    <h5>General</h5>
    <ul>
      <li>
        <a href="/">Home</a>
      </li>
        <li>
            <a href="https://git.lumeweb.com">Git</a>
        </li>
    </ul>
  </div>
  <div>
    <h5>Community</h5>
    <ul>
      <li>
        <a href="https://github.com/LumeWeb">GitHub</a>
      </li>
      <li>
        <a href="https://discord.gg/qpC8ADp3rS">Discord</a>
      </li>
      <li>
        <a href="https://twitter.com/lumeweb3">Twitter</a>
      </li>
    </ul>
  </div>
  <div>
    <h5>Ecosystem</h5>
    <ul>
      <li>
        <a href="https://web3extension.io">Extension</a>
      </li>
    </ul>
  </div>
  <div>
    <h5>Support Us</h5>
    <ul>
      <li>
        <a href="/donate">Donate</a>
      </li>
    </ul>
  </div>
 </footer>
--- a/src/components/Layout/Footer/Footer.scss
+++ b/src/components/Layout/Footer/Footer.scss
@ -0,0 +1,132 @@
@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;
    }
  }
 }
--- a/src/components/Layout/JoinCommunity/JoinCommunity.astro
+++ b/src/components/Layout/JoinCommunity/JoinCommunity.astro
@ -0,0 +1,39 @@
 ---
 import './JoinCommunity.scss';
 import svgGit from '/src/assets/icons/git.svg?raw';
 import svgGithub from '/src/assets/icons/github.svg?raw';
 import svgDiscord from '/src/assets/icons/discord.svg?raw';
 import svgTwitter from '/src/assets/icons/twitter.svg?raw';
 ---
 <section id="join-community">
  <div>
    <h2>
      Join our community, lend a hand.
    </h2>
    <p>
      Web3 gives people control over their data, privacy, and ownership.
    </p>
  </div>
    <div>
      <a href="https://git.lumeweb.com" title="Git" class="git-logo">
        <Fragment set:html={svgGit} />
      </a>
    </div>
  <div>
    <a href="https://github.com/LumeWeb" title="GitHub" class="github-logo">
      <Fragment set:html={svgGithub} />
    </a>
  </div>
  <div>
    <a href="#" title="Discord" class="discord-logo">
      <Fragment set:html={svgDiscord} />
    </a>
  </div>
  <div>
    <a href="#" title="Twitter" class="twitter-logo">
      <Fragment set:html={svgTwitter} />
    </a>
  </div>
 </section>
--- a/src/components/Layout/JoinCommunity/JoinCommunity.scss
+++ b/src/components/Layout/JoinCommunity/JoinCommunity.scss
@ -0,0 +1,80 @@
@import "/src/styles/mixins.scss";
@import "/src/styles/vars.scss";
 #join-community {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2em;
    padding: 5em 7.5%;
    background: $color-aquamarine;
    color: $color-blue-charcoal-2;
    @include fluid-font-size(0.625rem);
    div {
        flex-grow: 1;
        &:first-child {
            flex-grow: 10;
        }
        &:last-child {
            flex-grow: 0;
        }
    }
    @media screen and (max-width: 56rem) {
        flex-wrap: wrap;
        justify-content: center;
        div:first-child {
            flex-basis: 100%;
            margin-bottom: 2em;
            text-align: center;
        }
        div {
            flex-grow: 0;
        }
    }
    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: 157%;
    }
    a {
        display: block;
        color: #0B3F48;
        &:hover {
            color: inherit;
        }
    }
    .github-logo svg {
        @include fluid-width(3.625rem);
    }
    .git-logo svg {
        @include fluid-width(3.625rem);
    }
    .discord-logo svg {
        @include fluid-width(3.625rem);
    }
    .twitter-logo svg {
        @include fluid-width(3.625rem);
    }
 }
--- a/src/components/Layout/Navbar/Navbar.astro
+++ b/src/components/Layout/Navbar/Navbar.astro
@ -0,0 +1,72 @@
 ---
 import logo from "../../../assets/lume-logo.png";
 const { view } = Astro.props;
 function getActiveClass(linkView) {
  return view === linkView ? "border-b border-white" : "";
 }
 ---
 <nav class="flex flex-row px-[25px] justify-between items-center py-8 md:p-14">
  <div class="logo">
    <!-- TODO: Hide this logo and show simplified when 320 > width -->
    <a href="/">
      <img class="w-44" src={logo.src} alt="Lume Logo" />
    </a>
  </div>
  <menu
    class="hidden flex-col items-center gap-14 z-20 max-sm:absolute max-sm:right-0 max-sm:top-0 max-sm:bottom-0 max-sm:z-20 max-sm:py-20 max-sm:px-10 max-sm:bg-black lg:flex-row lg:flex"
  >
    <li>
      <a href="/" class={getActiveClass("home")}>Home</a>
    </li>
    <li>
      <a href="/vision" class={getActiveClass("vision")}>Vision</a>
    </li>
    <li>
      <a href="/what-is-web3" class={getActiveClass("what")}>What is Web3</a>
    </li>
    <li>
      <a href="/donate" class={getActiveClass("donate")}>Donate</a>
    </li>
    <li>
      <a
        href="#"
        class="text-md rounded-md bg-primary py-3 px-10 mt-14 text-[black] font-body"
        >Download Extension</a
      >
    </li>
  </menu>
  <div
    id="navbar-overlay"
    class="hidden lg:hidden bg-black/40 w-screen h-screen fixed z-10 top-0 botton-0 right-0 left-0"
  >
  </div>
  <button id="hamburger" class="z-30 text-4xl lg:hidden">☰</button>
  <script>
    const navbarOverlayEl = document.getElementById("navbar-overlay");
    const hamburgerEl = document.getElementById("hamburger");
    const menuEl = document.querySelector("menu");
    function handleMenuClick() {
      // Toggle menu open/closed
      ["hidden", "flex"].forEach((className) => {
        menuEl.classList.toggle(className);
      });
      navbarOverlayEl.classList.toggle("hidden");
    }
    function handleOverlayClick() {
      // Close menu on overlay click
      ["hidden", "flex"].forEach((className) => {
        menuEl.classList.toggle(className);
      });
      navbarOverlayEl.classList.toggle("hidden");
    }
    hamburgerEl.addEventListener("click", handleMenuClick);
    navbarOverlayEl.addEventListener("click", handleOverlayClick);
  </script>
 </nav>
--- a/src/components/Vision/Grid/Grid.astro
+++ b/src/components/Vision/Grid/Grid.astro
@ -0,0 +1,29 @@
 ---
 import './Grid.scss';
 ---
 <section id="grid" class="feature-grid">
    <div>
        <h2>Freedom. Privacy. Ownership.</h2>
    </div>
    <div>
        <h3>Decentralized Websites (Goal)</h3>
        <p>You should be able to gain access to any website on any network, in a secure and decentralized way</p>
    </div>
    <div>
        <h3>Decentralized Publishing (Idea)</h3>
        <p>You should be able to easily publish a blog or any other basic website for personal or professional use</p>
    </div>
    <div>
        <h3>Website Building Tools (Idea)</h3>
        <p>You should be able to easily build a website that targets the decentralized web</p>
    </div>
    <div>
        <h3>eCommerce (Idea)</h3>
        <p>You should be be able to buy or sell in a free market without censorship or politics blocking your ability to transact</p>
    </div>
    <div>
        <h3>Earn a Living (Idea)</h3>
        <p>You should be able to monetize your content or skills, without a middleman or gatekeeper. You should be able to be free to live your best life by having access to an open market so that you are never chained down or restricted</p>
    </div>
 </section>
--- a/src/components/Vision/Grid/Grid.scss
+++ b/src/components/Vision/Grid/Grid.scss
@ -0,0 +1,20 @@
@import "/src/styles/mixins.scss";
@import "/src/styles/vars.scss";
 #grid {
  padding-top: 2.05em;
  padding-bottom: 2.05em;
  div:first-child {
    background: inherit;
    border: none
  }
  h2 {
    font-family: $font-family-jetbrains-mono;
    @include fluid-font-size(2.75rem);
    font-weight: 700;
    line-height: 129.55%;
    color: $color-aquamarine;
  }
 }
--- a/src/components/Vision/Jumbotron/Jumbotron.astro
+++ b/src/components/Vision/Jumbotron/Jumbotron.astro
@ -0,0 +1,9 @@
 ---
 import '../../../styles/jumbotron.scss';
 ---
 <section id="jumbotron">
  <h1>
      Easy access to an open, user-owned web.
  </h1>
 </section>
--- a/src/components/Vision/NoVc/NoVc.astro
+++ b/src/components/Vision/NoVc/NoVc.astro
@ -0,0 +1,28 @@
 ---
 import './NoVc.scss';
 ---
 <section id="no-vc">
  <div class="feature-group">
    <h2>Community-Powered</h2>
    <h3>All about the people, no VC here.</h3>
      <p>
          Our vision is completely grass roots, and FOSS. The user needs to have a voice and be in control of their web. Due to our principles, we have not taken any VC money that might be able to strap a jetpack to the project, because the output would compromise the spirit and goals we are setting out to achieve.
      </p>
      <p>
          We are <i>very</i> aware of the projects that have come before us and whom have made similar promises. We are also doing our best to learn from their mistakes and failures.
      </p>
      <p>
          The key difference that we see big picture is you need both an <b>economy</b> and <b>decentralized/P2P</b> networks, because running the internet is not free, and someone <i>always</i> has to foot the bill.
      </p>
      <p>
          Blockchain <b><i>finally</i></b> makes this possible.
      </p>
      <p>
          Having a pragmatic view on mass adoption without compromising on principles is needed to make progress on a user-owned web.
      </p>
    <div>
      <a href="/donate" class="btn-main">Contribute to our cause</a>
    </div>
  </div>
 </section>
--- a/src/components/Vision/NoVc/NoVc.scss
+++ b/src/components/Vision/NoVc/NoVc.scss
@ -0,0 +1,45 @@
@import "/src/styles/vars.scss";
 #no-vc {
  position: relative;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  max-width: 185.6em;
  min-height: 78.4em;
  margin: 0 auto;
  &::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: min(0em, calc((100% - 95em) / 2));
    width: calc(100% - 64em - 7.5%);
    min-width: 95em;
    background-image: url("/src/assets/double-brand-bg.png");
    background-position: 50% 100%;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: -1;
  }
  .feature-group {
    box-sizing: content-box;
    padding: 9em 7.5%;
    max-width: 64em;
  }
  @media screen and (max-width: 80rem) {
    p {
      background: rgba($color-blue-charcoal-2, 0.75);
      border-radius: 0.5em;
      padding: 0.3em 0.5em;
      margin: -0.3em -0.5em;
    }
    p + p {
      margin-top: 0.48em;
    }
  }
 }
--- a/src/components/Vision/Unify/Unify.astro
+++ b/src/components/Vision/Unify/Unify.astro
@ -0,0 +1,23 @@
 ---
 import './Unify.scss';
 ---
 <section id="unify">
    <div class="custom-bg"></div>
    <div class="feature-group">
        <h2>Community-Powered</h2>
        <h3>Unifying all the Networks</h3>
        <p>
            There are many, <i>many</i> "crypto", "defi", "web3", "P2P", and "dWeb" projects that have all taken hundreds
            of different approaches to innovate. However, they all have the same broad ethos in common, and they all
            need an easy means to access them in one place, but in a censorship-resistant way.
        </p>
        <p>
            We have a very ambitious vision, and this requires all "tribes" to work together enough for the benefit of
            the end user.
        </p>
        <p>
            Below are some of the ideas we are aiming for, and some we would like to tackle eventually.
        </p>
    </div>
 </section>
--- a/src/components/Vision/Unify/Unify.scss
+++ b/src/components/Vision/Unify/Unify.scss
@ -0,0 +1,51 @@
@import "/src/styles/vars.scss";
 #unify {
  position: relative;
  padding: 14em 7.5%;
  .custom-bg {
    position: absolute;
    top: 0;
    right: -12.5%;
    bottom: 0;
    left: -12.5%;
    margin: 2% 0;
    background: $color-blue-charcoal;
    transform: matrix(1, 0.04, -0.04, 1, 0, 0);
    z-index: -1;
    overflow: hidden;
    &::after {
      content: "";
      position: absolute;
      top: -1%;
      bottom: -5%;
      left: 10%;
      right: 10%;
      background-image: url("/src/assets/unifying-bg.png");
      background-position: 100% 100%;
      background-repeat: no-repeat;
      background-size: contain;
      transform: rotate(-2.25deg);
    }
  }
  .feature-group {
    display: flex;
    flex-direction: column;
    justify-content: center;
    max-width: 64em;
  }
  p {
    background: rgba($color-blue-charcoal, 0.75);
    border-radius: 0.5em;
    padding: 0.3em 0.5em;
    margin: -0.3em -0.5em;
  }
  p + p {
    margin-top: 0.48em;
  }
 }
--- a/src/components/What/Contribute/Contribute.astro
+++ b/src/components/What/Contribute/Contribute.astro
@ -0,0 +1,34 @@
 ---
 import './Contribute.scss';
 import mario from "/src/assets/mario-level-up.gif"
 ---
 <section id="contribute">
    <div class="feature-group">
        <h2>Web3 is Community</h2>
        <h3>Re-defining Web3, for the users</h3>
        <p>
            Web3 was a term first defined by Gavin Wood when the Ethereum network was starting out. He defined it as a
            "decentralized online ecosystem based on blockchain".
        </p>
        <p>
            However, we view it as much more than that, and definitely more than access to DeFi. We see a ton of more
            potential to what Web3 as an ideal can evolve to, and are setting out to make it a reality.
        </p>
        <p>
            To those that see Web3 as DeFi, we ask this: Do you go on your web browser to access TradingView or other market tools as your homepage, or do you go check your social media, email, and news sites, as <i>well</i> as your money?
        </p>
        <p>
            Blockchain itself is more than just <i>money</i>, and so is Web3, and by extension P2P networks.
        </p>
        <p>
            So help us in our goals to level-up Web3.
        </p>
        <div class="mario">
            <img src={mario.src} alt="Mario Level Up"/>
        </div>
        <div>
            <a href="/donate" class="btn-main">Donate</a>
        </div>
    </div>
 </section>
--- a/src/components/What/Contribute/Contribute.scss
+++ b/src/components/What/Contribute/Contribute.scss
@ -0,0 +1,35 @@
@import "/src/styles/vars.scss";
 #contribute {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 71.1em;
  background: $color-blue-charcoal;
  &::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url("/src/assets/contribute-bg.png");
    background-position: 50%;
    background-size: cover;
  }
  &::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.75);
  }
  .feature-group {
    max-width: 72em;
    margin: 9em 7.5%;
    z-index: 1;
  }
  .mario {
    margin-top: 2.5em;
  }
 }
--- a/src/components/What/Grid/Grid.astro
+++ b/src/components/What/Grid/Grid.astro
@ -0,0 +1,28 @@
 ---
 import './Grid.scss';
 ---
 <section id="grid" class="feature-grid">
    <div>
        <h3>Access the markets, aka DeFi</h3>
        <p>Web3 commonly get mixed up with DeFi, however, while you should be able to access any decentralized website or network, access to DeFi to manage your money is critical as well.</p>
    </div>
    <div>
        <h3>Access any decentralized or P2P network</h3>
        <p>The basics of Web3 is the sum of all the open networks and ecosystems. You should be able to access and visit any of these places.</p>
        <p>You can compare this to accessing things on Google, Facebook, Apple, or other networks/platforms that are generally walled gardens in the current web system.</p>
    </div>
    <div>
        <h3>Publish Freely</h3>
        <p>A core tenant of Web3 is censorship-resistance. You should be able to freely post controversial (or even things others just don't want to hear) information, such as news, blogging, or video. You should be allowed to openly debate, educate, inform, or entertain without getting "de-platformed".</p>
    </div>
    <div>
        <h3>Socialize and Discover Freely</h3>
        <p>While you have the ability to post, you should <i>also</i> have the ability to <i>read</i>.</p>
    </div>
    <div>
        <h3>Own your web. Own your identity.</h3>
        <p>You should be able to have your private data <b>be</b> and <b>stay</b> private unless you choose otherwise. This is achieved with your online web3 account, which serves as your identity and means of encrypting everything you do.</p>
        <p>If you want to share you can, but your data is yours, no one else's.</p>
    </div>
 </section>
--- a/src/components/What/Grid/Grid.scss
+++ b/src/components/What/Grid/Grid.scss
@ -0,0 +1,3 @@
 #grid {
  margin-bottom: 1.2em;
 }
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
semantic-release-bot	c4c206181c	chore(release): 0.1.0-develop.1 [skip ci] # [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`](`a8bbcc19ec`)) * grammer error ([`432be86`](`432be86cc5`)) * responsive is now all over the page :) ([`7c48975`](`7c48975f79`)) * small improvement on 4k screens ([`0bba290`](`0bba290f28`)) * switch to experimental image support and import missing images ([`cd278e3`](`cd278e3a46`)) * typo ([`26b3f5f`](`26b3f5f878`)) ### Features * copy to clipboard, qr code generation, further donation methods ([`20a99a6`](`20a99a65d8`)) * create two remaining components, optimize layout and existing components (wip) ([`b6f8d56`](`b6f8d567ba`)) * finish all new design implementations ([`486bc6a`](`486bc6ae72`)) * local fonts ([`b52911c`](`b52911cb51`)) * meme grid is now responsive ([`3552e8b`](`3552e8bb84`)) * mobile menu, css cleanup, component details ([`0c6391e`](`0c6391e3a1`)) * pure css tilted background ([`05eb109`](`05eb109938`)) * rework several sections on home page, some refactoring ([`4935177`](`4935177908`)) * sass support, mixins for fluid design, refactoring, work on components ([`9701291`](`97012911aa`)) * svg icons, donation methods ([`63e0c57`](`63e0c57b03`))	2023-08-13 04:41:10 +00:00
Derrick Hammer	11fbdbf4ea	refactor: update footer menu links	2023-08-13 00:39:01 -04:00
Derrick Hammer	26b3f5f878	fix: typo	2023-08-13 00:23:41 -04:00
Derrick Hammer	432be86cc5	fix: grammer error	2023-08-13 00:07:12 -04:00
Derrick Hammer	6ae07e68b4	refactor: update seo	2023-08-12 22:43:51 -04:00
Derrick Hammer	a8bbcc19ec	fix: bg image invalid, and update name	2023-08-12 21:59:20 -04:00
Derrick Hammer	cd278e3a46	fix: switch to experimental image support and import missing images	2023-08-12 21:53:49 -04:00
Derrick Hammer	1d37d5b79a	ci: switch to using rclone	2023-08-12 21:24:14 -04:00
Derrick Hammer	c016984aec	ci: remove forward slash	2023-08-12 20:35:56 -04:00
Derrick Hammer	06d2b8a16d	ci: remove stray "	2023-08-12 20:30:40 -04:00
Derrick Hammer	e71584518f	ci: add semantic-release script	2023-08-12 20:27:19 -04:00
Derrick Hammer	db641728aa	ci: add npm-shrinkwrap.json	2023-08-12 20:17:59 -04:00
Derrick Hammer	6695e200f2	ci: add repository to package.json	2023-08-12 19:51:55 -04:00
Derrick Hammer	a5224bb436	chore: update README.md	2023-08-12 19:37:28 -04:00
Derrick Hammer	d9b2cf8d8c	chore: update package name	2023-08-12 19:34:14 -04:00
Derrick Hammer	b38a1b3626	chore: add LICENSE.txt	2023-08-12 19:33:50 -04:00
Derrick Hammer	da67b86367	ci: setup	2023-08-12 19:23:19 -04:00
Derrick Hammer	ceed1b6fc0	ci: add robots for dev deploy	2023-08-12 19:21:56 -04:00
Derrick Hammer	255067f03e	ci: add semantic release	2023-08-12 19:21:08 -04:00
Juan Di Toro	0bba290f28	fix: small improvement on 4k screens	2023-08-12 22:35:59 +02:00
Derrick Hammer	b7e30f8cd6	Merge pull request 'fix: website now is responsive and has the new design' (#1 ) from ditorodev/fix-website into master Reviewed-on: #1	2023-08-12 20:19:18 +00:00
Juan Di Toro	7c48975f79	fix: responsive is now all over the page :)	2023-08-12 21:53:18 +02:00
Juan Di Toro	486bc6ae72	feat: finish all new design implementations	2023-08-12 21:10:54 +02:00
Juan Di Toro	3552e8bb84	feat: meme grid is now responsive	2023-08-12 19:24:26 +02:00
cymon	e3a1e48a83	adopt design changes, fixes and improvements	2023-06-30 09:49:40 +00:00
cymon	b52911cb51	feat: local fonts	2023-06-23 13:38:51 +00:00
cymon	ca92a37bed	remove old files	2023-06-23 12:58:41 +00:00
Derrick Hammer	7883bdc36a	refactor: update donate content	2023-06-17 22:57:29 -04:00
Derrick Hammer	7d184fb7af	refactor: update what is web3 content	2023-06-17 22:47:39 -04:00
Derrick Hammer	9fe05aa832	refactor: update layout community icons	2023-06-17 21:38:56 -04:00
Derrick Hammer	220398093e	refactor: update vision content	2023-06-17 21:38:33 -04:00
Derrick Hammer	dffc26a73c	refactor: update homepage content	2023-06-17 21:30:12 -04:00
Derrick Hammer	752a41ea17	Merge branch 'lume-refactor'	2023-06-17 08:24:06 -04:00
cymon	fed636f78c	code cleanup and some fixes	2023-06-12 17:47:49 +00:00
Derrick Hammer	4d0e991a61	Merge branch 'lume-refactor' # Conflicts: # .gitignore # README.md # package.json # public/robots.txt	2023-06-07 17:55:51 -04:00
cymon	44231a1d99	optimize styles, background positions and fluid types, fix build issues, code refactoring and cleanup	2023-06-07 21:34:40 +00:00
cymon	b6f8d567ba	feat: create two remaining components, optimize layout and existing components (wip)	2023-06-05 22:44:30 +00:00
cymon	20a99a65d8	feat: copy to clipboard, qr code generation, further donation methods	2023-06-02 22:07:57 +00:00
cymon	63e0c57b03	feat: svg icons, donation methods	2023-06-01 22:15:49 +00:00
cymon	0c6391e3a1	feat: mobile menu, css cleanup, component details	2023-05-31 22:30:45 +00:00
cymon	b86e45511e	continue work on components	2023-05-30 22:08:42 +00:00
cymon	076ae962a1	home page rework complete, continue work on further components	2023-05-29 21:53:41 +00:00
cymon	05eb109938	feat: pure css tilted background	2023-05-27 11:31:19 +00:00
cymon	4935177908	feat: rework several sections on home page, some refactoring	2023-05-26 22:05:19 +00:00
cymon	97012911aa	feat: sass support, mixins for fluid design, refactoring, work on components	2023-05-26 00:15:17 +00:00
cymon	966fc14ae4	refactor: revise and restructure css/layout/header/footer/meme/etc (wip)	2023-05-23 21:25:18 +00:00
roryjshelton	c6d06537ae	footer logo/text size increase	2023-05-10 09:16:33 -07:00
roryjshelton	13959ca3b9	pr to footer text	2023-05-10 08:46:56 -07:00
roryjshelton	cf6e8aebed	footer padding	2023-05-10 08:43:14 -07:00
roryjshelton	e8699bf583	ul/li @media + padding fix	2023-05-10 05:17:11 -07:00
roryjshelton	d1032633a4	remove dependency	2023-05-09 17:27:51 -07:00
roryjshelton	59ec0ca3ac	padding fixes	2023-05-09 17:16:21 -07:00
roryjshelton	47dea4cf56	meme bg fix	2023-05-09 15:49:29 -07:00
roryjshelton	44c00b3b42	meme bg fix	2023-05-09 15:38:42 -07:00
roryjshelton	f5524d45a5	padding fix	2023-05-07 20:17:41 +02:00
roryjshelton	e0d507ffa5	padding fix	2023-05-07 20:16:06 +02:00
roryjshelton	2d37d885bb	cursor color	2023-05-07 16:46:18 +02:00
roryjshelton	64a986fef3	padding fix	2023-05-07 16:29:00 +02:00
roryjshelton	8ff7194511	grid fix	2023-05-06 18:59:26 +02:00
roryjshelton	7d41f1240a	grid fix	2023-05-06 18:58:03 +02:00
roryjshelton	3fb257e87c	delete	2023-05-06 18:36:07 +02:00
roryjshelton	152f22ee27	grid fix	2023-05-06 18:35:54 +02:00
roryjshelton	41afba6daf	-> tailwind	2023-05-05 08:45:14 +02:00
roryjshelton	f422b72ffb	-> tailwind	2023-05-05 08:28:04 +02:00
roryjshelton	67d490c385	import components	2023-05-05 08:02:45 +02:00
roryjshelton	db8a30d8f3	css fix	2023-04-29 12:33:15 -07:00
roryjshelton	73d3eddc37	add component	2023-04-28 23:54:23 -07:00
roryjshelton	d09532dbb7	more tailwind	2023-04-28 23:34:08 -07:00
roryjshelton	236a9de21a	remove imports	2023-04-27 23:26:36 -07:00
roryjshelton	8ee8671ead	add components	2023-04-27 23:17:06 -07:00
roryjshelton	c9ae52b5ef	navbar fixes	2023-04-27 18:54:32 -07:00
roryjshelton	80aae172da	text size	2023-04-27 17:44:39 -07:00
roryjshelton	3535cfff78	header -> client:load	2023-04-27 17:40:05 -07:00
roryjshelton	8351654c8c	header css -> tw	2023-04-27 17:05:09 -07:00
roryjshelton	4457f9357e	update	2023-04-27 16:47:53 -07:00
roryjshelton	406c0ff604	initial	2023-04-27 16:33:58 -07:00
roryjshelton	3507a23bda	add	2023-04-27 16:32:15 -07:00
roryjshelton	f3566e26c6	delete cache	2023-04-22 02:22:34 -07:00
roryjshelton	9a4d33bbdb	initial commit	2023-04-22 01:21:49 -07:00
roryjshelton	0f90868ecd	initial commit	2023-04-22 01:19:54 -07:00
		`@ -0,0 +1 @@`
							`{ "extends": ["stylelint-config-standard"] }`