-
-
-
diff --git a/src/styles.css b/src/styles.css
deleted file mode 100644
index 8fc71d2..0000000
--- a/src/styles.css
+++ /dev/null
@@ -1,258 +0,0 @@
-#root {
- height: 100vh;
-}
-
-.section {
- height: 100vh;
- text-align: center;
- /* scroll-snap-align: start; */
-}
-
-.sec2Text {
- width: 75%;
- margin: 0 auto;
- padding-bottom: 1em;
-}
-
-.subtext {
- font-size: .8em;
-}
-
-.scrollContainer {
- height: 100vh;
- /* overflow-y: scroll; */
- /* scroll-snap-type: y mandatory; */
-}
-
-
-.mainPanel {
- backdrop-filter: blur(3px);
- background-color: rgba(255,255,255,0.6);
- height: 60%;
- width: 60%;
- border-radius: 10px;
- margin: 0 auto;
- margin-top: 10%;
- padding-top: 5%;
- padding-bottom: 5%;
- left: 0;
- right: 0;
- position: absolute;
-}
-
-#heroText {
- padding-top: 20vh;
- font-size: 4em;
- width: 80%;
- text-align: center;
- margin: 2em auto .5em auto;
-}
-
-.wrap {
- word-break: break-word;
-}
-
-.buttons {
- position: absolute;
- right: 1em;
- top: 1em;
-}
-
-.aws-btn {
- --button-default-height: 55px;
- --button-default-font-size: 14px;
- --button-default-border-radius: 6px;
- --button-horizontal-padding: 20px;
- --button-raise-level: 6px;
- --button-hover-pressure: 1;
- --transform-speed: 0.185s;
- --button-primary-color: #3a3a3a;
- --button-primary-color-dark: #141414;
- --button-primary-color-light: #fbfbfb;
- --button-primary-color-hover: #2d2d2d;
- --button-primary-color-active: #212121;
- --button-primary-border: 2px solid #3a3a3a;
- --button-secondary-color: #fbfbfb;
- --button-secondary-color-dark: #3a3a3a;
- --button-secondary-color-light: #3a3a3a;
- --button-secondary-color-hover: #eeeeee;
- --button-secondary-color-active: #e2e2e2;
- --button-secondary-border: 2px solid #3a3a3a;
- --button-anchor-color: #ffe727;
- --button-anchor-color-dark: #212121;
- --button-anchor-color-light: #97735d;
- --button-anchor-color-hover: #ffe727;
- --button-anchor-color-active: #ffe727;
- --button-anchor-border: 2px solid #876753;
- --button-danger-color: #733086;
- --button-danger-color-dark: #431c4e;
- --button-danger-color-light: #77cd38;
- --button-danger-color-hover: #6d2d7e;
- --button-danger-color-active: #632973;
- --button-danger-border: none;
-}
-
-body {
- --black: #000000;
- --ash-black: #222;
- --white: #fafafa;
- --sky: #00ccff;
- --green: #22dddd;
- --blue: #1300ff;
- --dusk: #6600ff;
- --purple: #9900ff;
- --pink: #ff0066;
- --red: #fe0222;
- --orange: #fd7702;
- --yellow: #ffbb00;
-
- --background: var(--white);
- --accent: var(--black);
-
- margin: 0;
- padding: 0;
- background-color: var(--background);
- color: var(--accent);
- }
-
- .particles-bg-canvas-self {
- height: 90%;
- }
-
- * {
- font-family: input-mono, monospace;
- font-weight: 400;
- font-style: normal;
- }
-
- h1 {
- font-size: 36px;
- font-weight: 700;
- letter-spacing: -1px;
- line-height: 1.2;
- text-align: center;
- margin: 100px 0 40px;
- }
-
- h2 {
- font-weight: 400;
- }
-
- p {
- margin: 0 0 30px 0;
- font-size: 18px;
- }
-
- footer {
- position: fixed;
- bottom: 0;
- left: 0;
- right: 0;
- display: flex;
- justify-content: flex-start;
- align-items: center;
- padding: 20px;
- background-image: radial-gradient(
- rgba(0, 0, 0, 0) 1px,
- var(--background) 1px
- );
- background-size: 4px 4px;
- backdrop-filter: blur(3px);
- -webkit-backdrop-filter: blur(3px);
- -moz-backdrop-filter: blur(3px);
- font-size: 14px;
- line-height: 14px;
- }
-
- footer::before {
- display: block;
- content: "";
- position: absolute;
- top: -1px;
- left: 0;
- right: 0;
- height: 1px;
- background: var(--accent);
- opacity: 0.2;
- }
-
- footer svg {
- margin-right: 20px;
- }
-
- footer a {
- text-decoration: none;
- color: var(--accent);
- }
-
- nav {
- position: fixed;
- top: 0;
- left: 0;
- right: 0;
- display: flex;
- justify-content: flex-start;
- align-items: center;
- padding: 40px;
- background-image: radial-gradient(
- rgba(0, 0, 0, 0) 1px,
- var(--background) 1px
- );
- background-size: 4px 4px;
- backdrop-filter: blur(3px);
- -webkit-backdrop-filter: blur(3px);
- -moz-backdrop-filter: blur(3px);
- font-size: 14px;
- line-height: 14px;
- z-index: 999;
- }
-
- nav::before {
- display: block;
- content: "";
- position: absolute;
- top: -1px;
- left: 0;
- right: 0;
- height: 1px;
- background: var(--accent);
- opacity: 0.2;
- }
-
- code {
- font-family: input-mono, monospace;
- font-weight: 400;
- font-style: normal;
- }
-
- ::-webkit-scrollbar {
- height: 12px;
- width: 5px;
- background: var(--background);
- }
-
- ::-webkit-scrollbar-thumb {
- background: var(--accent);
- -webkit-border-radius: 1ex;
- }
-
- ::-webkit-scrollbar-corner {
- background: var(--background);
- }
-
- .container {
- position: fixed;
- top: 0;
- right: 0;
- bottom: 0;
- left: 0;
- }
-
- canvas {
- image-rendering: -moz-crisp-edges;
- image-rendering: -webkit-optimize-contrast;
- image-rendering: pixelated;
- image-rendering: optimize-contrast;
- position: inherit;
- }
-
\ No newline at end of file
diff --git a/src/styles/buttons.css b/src/styles/buttons.css
new file mode 100644
index 0000000..eb80084
--- /dev/null
+++ b/src/styles/buttons.css
@@ -0,0 +1,39 @@
+.walletButtons {
+ position: absolute;
+ right: 1em;
+ top: 1em;
+}
+
+.aws-btn {
+ --button-default-height: 55px;
+ --button-default-font-size: 14px;
+ --button-default-border-radius: 6px;
+ --button-horizontal-padding: 20px;
+ --button-raise-level: 6px;
+ --button-hover-pressure: 1;
+ --transform-speed: 0.185s;
+ --button-primary-color: #3a3a3a;
+ --button-primary-color-dark: #141414;
+ --button-primary-color-light: #fbfbfb;
+ --button-primary-color-hover: #2d2d2d;
+ --button-primary-color-active: #212121;
+ --button-primary-border: 2px solid #3a3a3a;
+ --button-secondary-color: #fbfbfb;
+ --button-secondary-color-dark: #3a3a3a;
+ --button-secondary-color-light: #3a3a3a;
+ --button-secondary-color-hover: #eeeeee;
+ --button-secondary-color-active: #e2e2e2;
+ --button-secondary-border: 2px solid #3a3a3a;
+ --button-anchor-color: #ffe727;
+ --button-anchor-color-dark: #212121;
+ --button-anchor-color-light: #97735d;
+ --button-anchor-color-hover: #ffe727;
+ --button-anchor-color-active: #ffe727;
+ --button-anchor-border: 2px solid #876753;
+ --button-danger-color: #733086;
+ --button-danger-color-dark: #431c4e;
+ --button-danger-color-light: #77cd38;
+ --button-danger-color-hover: #6d2d7e;
+ --button-danger-color-active: #632973;
+ --button-danger-border: none;
+}
\ No newline at end of file
diff --git a/src/styles/main.css b/src/styles/main.css
new file mode 100644
index 0000000..319e5d9
--- /dev/null
+++ b/src/styles/main.css
@@ -0,0 +1,99 @@
+* {
+ font-family: 'Times New Roman', Times, serif;
+ font-weight: 400;
+ font-style: normal;
+}
+
+body {
+ --black: #000000;
+ --ash-black: #222;
+ --white: #fafafa;
+ --sky: #00ccff;
+ --green: #22dddd;
+ --blue: #1300ff;
+ --dusk: #6600ff;
+ --purple: #9900ff;
+ --pink: #ff0066;
+ --red: #fe0222;
+ --orange: #fd7702;
+ --yellow: #ffbb00;
+
+ --background: var(--white);
+ --accent: var(--black);
+
+ margin: 0;
+ padding: 0;
+ background-color: var(--background);
+ color: var(--accent);
+}
+
+h1 {
+ font-size: 36px;
+ font-weight: 700;
+ letter-spacing: -1px;
+ line-height: 1.2;
+ text-align: center;
+ margin: 100px 0 40px;
+}
+
+h2 {
+ font-weight: 400;
+}
+
+p {
+ margin: 0 0 30px 0;
+ font-size: 18px;
+}
+
+nav {
+ position: fixed;
+ top: 0;
+ left: 0;
+ right: 0;
+ display: flex;
+ justify-content: flex-start;
+ align-items: center;
+ padding: 40px;
+ background-image: radial-gradient(
+ rgba(0, 0, 0, 0) 1px,
+ var(--background) 1px
+ );
+ background-size: 4px 4px;
+ backdrop-filter: blur(3px);
+ -webkit-backdrop-filter: blur(3px);
+ -moz-backdrop-filter: blur(3px);
+ font-size: 14px;
+ line-height: 14px;
+ z-index: 999;
+}
+
+nav::before {
+ display: block;
+ content: "";
+ position: absolute;
+ top: -1px;
+ left: 0;
+ right: 0;
+ height: 1px;
+ background: var(--accent);
+ opacity: 0.2;
+}
+
+::-webkit-scrollbar {
+ height: 12px;
+ width: 5px;
+ background: var(--background);
+}
+
+::-webkit-scrollbar-thumb {
+ background: var(--accent);
+ -webkit-border-radius: 1ex;
+}
+
+::-webkit-scrollbar-corner {
+ background: var(--background);
+}
+
+.wrap {
+ word-break: break-word;
+}
\ No newline at end of file
diff --git a/src/styles/panel.css b/src/styles/panel.css
new file mode 100644
index 0000000..7fc6153
--- /dev/null
+++ b/src/styles/panel.css
@@ -0,0 +1,14 @@
+.mainPanel {
+ backdrop-filter: blur(3px);
+ background-color: rgba(255,255,255,0.6);
+ height: 60%;
+ width: 60%;
+ border-radius: 10px;
+ margin: 0 auto;
+ margin-top: 10%;
+ padding-top: 5%;
+ padding-bottom: 5%;
+ left: 0;
+ right: 0;
+ position: absolute;
+}
\ No newline at end of file
diff --git a/src/styles/sections.css b/src/styles/sections.css
new file mode 100644
index 0000000..6634ccf
--- /dev/null
+++ b/src/styles/sections.css
@@ -0,0 +1,34 @@
+/* #root {
+ height: 100vh;
+} */
+
+.section {
+ height: 100vh;
+ text-align: center;
+ /* scroll-snap-align: start; */
+}
+
+.sec2Text {
+ width: 75%;
+ margin: 0 auto;
+ padding-bottom: 1em;
+}
+
+.subtext {
+ font-size: .8em;
+}
+
+.scrollContainer {
+ height: 100vh;
+ /* overflow-y: scroll; */
+ /* scroll-snap-type: y mandatory; */
+}
+
+#heroText {
+ padding-top: 20vh;
+ font-size: 4em;
+ width: 80%;
+ text-align: center;
+ margin: 2em auto .5em auto;
+}
+
\ No newline at end of file
diff --git a/src/template/Footer.jsx b/src/template/Footer.jsx
deleted file mode 100644
index 458820b..0000000
--- a/src/template/Footer.jsx
+++ /dev/null
@@ -1,24 +0,0 @@
-import Typewriter from 'react-ts-typewriter';
-import { Logo } from "./Logo";
-
-export function Footer() {
- return (
-
- );
-}
diff --git a/src/template/Logo.jsx b/src/template/Logo.jsx
deleted file mode 100644
index dda5ebb..0000000
--- a/src/template/Logo.jsx
+++ /dev/null
@@ -1,16 +0,0 @@
-export function Logo() {
- return (
-
-
- );
- }
-
\ No newline at end of file
diff --git a/src/template/Panel.jsx b/src/template/Panel.jsx
index 64d6897..86be5a1 100644
--- a/src/template/Panel.jsx
+++ b/src/template/Panel.jsx
@@ -3,6 +3,8 @@ import { Card, Elevation } from "@blueprintjs/core";
import { AwesomeButton } from 'react-awesome-button';
import { usePrepareSendTransaction, useSendTransaction, useAccount } from 'wagmi'
+import '../styles/panel.css';
+
export function Panel({ opacity, panelText, mintButtonText }) {
const { isConnected } = useAccount();
diff --git a/src/template/Sections.jsx b/src/template/Sections.jsx
index e3d70b1..3d1dfe0 100644
--- a/src/template/Sections.jsx
+++ b/src/template/Sections.jsx
@@ -1,41 +1,25 @@
import React from 'react';
+import Typewriter from 'react-ts-typewriter';
import { Panel } from "./Panel";
+import '../styles/sections.css';
export class Section1 extends React.Component {
constructor(props) {
super(props);
- let titles = {
- 0: 'Innovative Web3 and Metaverse experiences',
- 1: 'Immersive and engaging worlds and communities',
- 2: 'We sell useless pictures to fools'
- }
- let subtitles = {
- 0: 'Connecting the ethereal to the real',
- 1: 'Connecting our audience to a larger purpose',
- 2: 'Connecting your money to our bank account'
- }
- this.state = {title: titles[0], iter: 0, subtitle: subtitles[0]};
+ this.state = {title: ''};
setInterval(() => {
- let iter = this.state.iter + 1;
- this.setState({
- title: titles[iter % 3],
- subtitle: subtitles[iter % 3],
- iter: iter
- });
- }, 4500);
+ this.setState({title: 'The Web3 Revolution and it\'s consequences have been a disaster for the human race.'});
+ }, 1200);
}
render() {
return (
- {this.state.title}
+
-
- {this.state.subtitle}
-
)
}
@@ -45,30 +29,8 @@ export function Section2() {
return (
-
- A Web3 company whose goal is to extract as much money as possible from the NFT space.
-
-
- Community is the foundation of our business
-
-
- getting holders of our tokens to convince others to buy it so that we may sell tokens to the next generation of holders.
-
-
- Utility is the main driver of all of our products
-
-
- Holders of our NFTs should be able to get more NFTs which then enables them to get more NFTs which is more gooder.
-
-
- Decentralization is a core tenant of our ethos
-
-
- we have formed a United States Limited Liability Corporation and accepted money from Venture Capital funds, we wish to have a global audience of dummies to fleece.
-
-
- WAGMI!
-
+
The Web3 Revolution and it's consequences have been a disaster for the human race.
+
ok
)