Commit from TeleportHQ

Iwuaa · Jul 27, 2024 · 546ef67 · 546ef67
1 parent 192e5bd
commit 546ef67
Show file tree

Hide file tree

Showing 20 changed files with 1,675 additions and 0 deletions.
diff --git a/craco.config.js b/craco.config.js
@@ -0,0 +1,12 @@
+module.exports = {
+  reactScriptsVersion: "react-scripts",
+  style: {
+    css: {
+      loaderOptions: () => {
+        return {
+          url: false,
+        };
+      },
+    },
+  },
+};
diff --git a/package.json b/package.json
@@ -0,0 +1,37 @@
+{
+  "name": "npcreator",
+  "version": "1.0.0",
+  "private": true,
+  "dependencies": {
+    "@craco/craco": "^7.1.0",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
+    "react-router-dom": "^5.2.0",
+    "react-helmet": "^6.1.0",
+    "prop-types": "15.7.2"
+  },
+  "scripts": {
+    "start": "craco start",
+    "build": "craco build",
+    "test": "craco test --env=jsdom",
+    "eject": "craco eject"
+  },
+  "engines": {
+    "node": ">=18.x"
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  },
+  "devDependencies": {
+    "react-scripts": "^5.0.1"
+  }
+}
diff --git a/public/image_2024-07-27_042305283-1500w.png b/public/image_2024-07-27_042305283-1500w.png
diff --git a/public/index.html b/public/index.html
@@ -0,0 +1,77 @@
+<!DOCTYPE html>
+
+<html lang="en">
+  <head>
+    <title>NPCreator</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta charset="utf-8" />
+    <meta property="twitter:card" content="summary_large_image" />
+    <style data-tag="reset-style-sheet">
+      html {  line-height: 1.15;}body {  margin: 0;}* {  box-sizing: border-box;  border-width: 0;  border-style: solid;}p,li,ul,pre,div,h1,h2,h3,h4,h5,h6,figure,blockquote,figcaption {  margin: 0;  padding: 0;}button {  background-color: transparent;}button,input,optgroup,select,textarea {  font-family: inherit;  font-size: 100%;  line-height: 1.15;  margin: 0;}button,select {  text-transform: none;}button,[type="button"],[type="reset"],[type="submit"] {  -webkit-appearance: button;}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner {  border-style: none;  padding: 0;}button:-moz-focus,[type="button"]:-moz-focus,[type="reset"]:-moz-focus,[type="submit"]:-moz-focus {  outline: 1px dotted ButtonText;}a {  color: inherit;  text-decoration: inherit;}input {  padding: 2px 4px;}img {  display: block;}html { scroll-behavior: smooth  }
+    </style>
+    <style data-tag="default-style-sheet">
+      html {
+        font-family: "Poppins";
+        font-size: 16px;
+      }
+
+      body {
+        font-weight: 400;
+        font-style:normal;
+        text-decoration: none;
+        text-transform: none;
+        letter-spacing: normal;
+        line-height: 1.15;
+        color: var(--dl-color-theme-neutral-dark);
+        background-color: var(--dl-color-theme-neutral-light);
+
+        fill: var(--dl-color-theme-neutral-dark);
+      }
+    </style>
+    <link
+      rel="stylesheet"
+      href="https://unpkg.com/[email protected]/animate.css"
+    />
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&display=swap"
+      data-tag="font"
+    />
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
+      data-tag="font"
+    />
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
+      data-tag="font"
+    />
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css2?family=STIX+Two+Text:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap"
+      data-tag="font"
+    />
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap"
+      data-tag="font"
+    />
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css2?family=Fira+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
+      data-tag="font"
+    />
+    <link
+      rel="stylesheet"
+      href="https://unpkg.com/@teleporthq/teleport-custom-scripts/dist/style.css"
+    />
+  </head>
+  <body>
+    <div id="app"></div>
+    <script
+      defer
+      src="https://unpkg.com/@teleporthq/teleport-custom-scripts"
+    ></script>
+  </body>
+</html>
diff --git a/src/components/banner1.css b/src/components/banner1.css
@@ -0,0 +1,53 @@
+.banner1-container {
+  gap: var(--dl-space-space-unit);
+  display: flex;
+  position: relative;
+  align-items: center;
+}
+.banner1-max-width {
+  gap: var(--dl-space-space-oneandhalfunits);
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+}
+.banner1-container1 {
+  gap: var(--dl-space-space-halfunit);
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+}
+.banner1-title {
+  font-size: 16px;
+  font-family: "Poppins";
+  font-weight: 400;
+  line-height: 1.15;
+  text-transform: none;
+  text-decoration: none;
+}
+.banner1-navlink {
+  width: 230px;
+  height: 64px;
+  text-decoration: none;
+}
+.banner1-text1 {
+  font-style: normal;
+  font-weight: 700;
+}
+.banner1-text2 {
+  display: inline-block;
+  text-align: center;
+  font-family: "Poppins";
+}
+.banner1-text3 {
+  display: inline-block;
+  font-size: 20px;
+  text-align: center;
+  letter-spacing: 1.3px;
+  text-transform: uppercase;
+}
+.banner1-text4 {
+  display: inline-block;
+  text-align: center;
+  font-family: "Poppins";
+}
+
diff --git a/src/components/banner1.js b/src/components/banner1.js
@@ -0,0 +1,60 @@
+import React from 'react'
+import { Link } from 'react-router-dom'
+
+import PropTypes from 'prop-types'
+
+import './banner1.css'
+
+const Banner1 = (props) => {
+  return (
+    <div
+      className={`banner1-container thq-section-padding ${props.rootClassName} `}
+    >
+      <div className="banner1-max-width thq-section-max-width">
+        <div className="banner1-container1">
+          <h2 className="banner1-title">
+            {props.heading1 ?? (
+              <fragment>
+                <span className="banner1-text4 thq-heading-2">NPCreator</span>
+              </fragment>
+            )}
+          </h2>
+          <h3>
+            {props.content1 ?? (
+              <fragment>
+                <span className="banner1-text2 thq-heading-3">
+                  Quick NPC Builder
+                </span>
+              </fragment>
+            )}
+          </h3>
+        </div>
+        <Link to="/builder" className="banner1-navlink thq-button-filled">
+          <span className="banner1-text1">
+            {props.action1 ?? (
+              <fragment>
+                <span className="banner1-text3">Create NPC</span>
+              </fragment>
+            )}
+          </span>
+        </Link>
+      </div>
+    </div>
+  )
+}
+
+Banner1.defaultProps = {
+  content1: undefined,
+  action1: undefined,
+  rootClassName: '',
+  heading1: undefined,
+}
+
+Banner1.propTypes = {
+  content1: PropTypes.element,
+  action1: PropTypes.element,
+  rootClassName: PropTypes.string,
+  heading1: PropTypes.element,
+}
+
+export default Banner1
diff --git a/src/components/navbar2.css b/src/components/navbar2.css
@@ -0,0 +1,145 @@
+.navbar2-container {
+  width: 100%;
+  display: flex;
+  position: relative;
+  justify-content: center;
+  background-color: var(--dl-color-theme-neutral-light);
+}
+.navbar2-navbar-interactive {
+  width: 100%;
+  display: flex;
+  align-items: center;
+  padding-top: var(--dl-space-space-twounits);
+  padding-left: var(--dl-space-space-threeunits);
+  padding-right: var(--dl-space-space-threeunits);
+  padding-bottom: var(--dl-space-space-twounits);
+  justify-content: space-between;
+}
+.navbar2-icon {
+  width: var(--dl-size-size-small);
+  height: var(--dl-size-size-small);
+}
+.navbar2-desktop-menu {
+  flex: 1;
+  display: flex;
+  justify-content: space-between;
+}
+.navbar2-links {
+  gap: var(--dl-space-space-twounits);
+  flex: 1;
+  display: flex;
+  align-items: center;
+  flex-direction: row;
+  justify-content: flex-end;
+}
+.navbar2-link1 {
+  text-decoration: none;
+}
+.navbar2-link2 {
+  text-decoration: none;
+}
+.navbar2-link3 {
+  text-decoration: none;
+}
+.navbar2-burger-menu {
+  display: none;
+}
+.navbar2-icon02 {
+  width: var(--dl-size-size-xsmall);
+  height: var(--dl-size-size-xsmall);
+}
+.navbar2-mobile-menu {
+  top: 0px;
+  left: 0px;
+  width: 100%;
+  height: 100vh;
+  display: flex;
+  padding: var(--dl-space-space-twounits);
+  z-index: 100;
+  position: absolute;
+  transform: translateY(-100%);
+  transition: 0.5s;
+  flex-direction: column;
+  justify-content: space-between;
+  background-color: var(--dl-color-theme-neutral-light);
+}
+.navbar2-nav {
+  display: flex;
+  align-items: flex-start;
+  flex-direction: column;
+}
+.navbar2-top {
+  width: 100%;
+  display: flex;
+  align-items: center;
+  margin-bottom: var(--dl-space-space-threeunits);
+  justify-content: space-between;
+}
+.navbar2-logo {
+  height: 3rem;
+}
+.navbar2-close-menu {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.navbar2-icon04 {
+  width: var(--dl-size-size-xsmall);
+  height: var(--dl-size-size-xsmall);
+}
+.navbar2-links1 {
+  gap: var(--dl-space-space-unit);
+  flex: 0 0 auto;
+  display: flex;
+  align-self: flex-start;
+  align-items: flex-start;
+  flex-direction: column;
+}
+.navbar2-icon-group {
+  gap: var(--dl-space-space-twounits);
+  display: flex;
+}
+.navbar2-text1 {
+  display: inline-block;
+}
+.navbar2-text2 {
+  display: inline-block;
+}
+.navbar2-text3 {
+  display: inline-block;
+}
+.navbar2-text4 {
+  display: inline-block;
+  padding-left: var(--dl-space-space-twounits);
+}
+.navbar2-text5 {
+  display: inline-block;
+}
+.navbar2-text6 {
+  display: inline-block;
+}
+
+
+@media(max-width: 767px) {
+  .navbar2-navbar-interactive {
+    padding-left: var(--dl-space-space-twounits);
+    padding-right: var(--dl-space-space-twounits);
+  }
+  .navbar2-desktop-menu {
+    display: none;
+  }
+  .navbar2-burger-menu {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+}
+@media(max-width: 479px) {
+  .navbar2-navbar-interactive {
+    padding: var(--dl-space-space-unit);
+    padding-right: 16px;
+  }
+  .navbar2-mobile-menu {
+    padding: var(--dl-space-space-unit);
+  }
+}