From 924ae3e5ae2ed0d00e305d01276904611c3846f0 Mon Sep 17 00:00:00 2001 From: Edward Date: Tue, 7 Jun 2022 19:22:55 -0400 Subject: [PATCH] update: landing page and add FAQ section --- frontend/components/Landing/FAQ.tsx | 56 +++++++++++++++++++++++++ frontend/components/Landing/Landing.tsx | 4 ++ frontend/package-lock.json | 32 +++++++++++--- frontend/package.json | 1 + 4 files changed, 87 insertions(+), 6 deletions(-) create mode 100644 frontend/components/Landing/FAQ.tsx diff --git a/frontend/components/Landing/FAQ.tsx b/frontend/components/Landing/FAQ.tsx new file mode 100644 index 0000000..1ffccd7 --- /dev/null +++ b/frontend/components/Landing/FAQ.tsx @@ -0,0 +1,56 @@ +import React from 'react'; +import Link from 'next/link'; +import Fade from 'react-reveal'; + +export default function FrequentQuestionSection() { + const [open, setOpen] = React.useState(false); + const [text, setText] = React.useState(''); + + //question answers + const q1 = "R. The first marketplace out of this world, and the easiest to use" + const q2 = "R. You only need to go to the Mint page, fill the form with title, description and all the data related to your token and place your art" + const q3 = "R. Artist, Designers, Ilustrators and all those that wants to take advantage of their talent" + const q4 = "R. The reserve storage deposit is a cover for the space that your NFT will need for be sold within the marketplace, you can always withdraw it" + const q5 = "R. Once created your NFT it will be appear in 'MyNFTs' page and in your NEAR Wallet " + const q6 = "R. The only attributes you would change once mintend your NFT and putted on sale is the price or if ypu want to cancel the token sell" + const q7 = "R. Go to 'Gallery' page explore and click the NFT you want, after click the buy button and accept the transaction within your NEAR Wallet" + const q8 = "R. You can sell all NFTs you want ! There is no limit" + const q9 = "R. Firstly you need to go to 'MyNFTs' page, reserve storage with a small deposit and once minted your NFT click on the 'Put on Sale' button" + const q10 = "R. The minimun deposit you need to do to cover ONE (1) NFT sale is 0.01 NEARs. If you want to cover two sales it would be 0.02 NEARs, and so on" + + return ( +
+

Frequently Asked Questions

+
+ +
    + + + + + +
+ + +
    + + + + + + +
+ +
+ { + open ? ( + +
+

{text}

+
+ + ):(null) + } +
+ ); +} \ No newline at end of file diff --git a/frontend/components/Landing/Landing.tsx b/frontend/components/Landing/Landing.tsx index 223d1ee..309d00d 100644 --- a/frontend/components/Landing/Landing.tsx +++ b/frontend/components/Landing/Landing.tsx @@ -1,5 +1,7 @@ import { ReactTypical } from '@deadcoder0904/react-typical'; import React from 'react'; +import Footer from '../common/Footer'; +import FAQ from './FAQ'; import Steps from './Steps'; export default function Landing() { @@ -43,8 +45,10 @@ export default function Landing() { extra="Sell it!" /> + + ); } diff --git a/frontend/package-lock.json b/frontend/package-lock.json index 37aee53..8a0b88c 100644 --- a/frontend/package-lock.json +++ b/frontend/package-lock.json @@ -21,6 +21,7 @@ "prettier": "^2.6.2", "react": "18.0.0", "react-dom": "18.0.0", + "react-reveal": "^1.2.2", "sitemap": "^7.1.1", "tailwind-scrollbar-hide": "^1.1.7" }, @@ -5246,9 +5247,9 @@ } }, "node_modules/protobufjs": { - "version": "6.11.2", - "resolved": "https://registry.npmjs.org/protobufjs/-/protobufjs-6.11.2.tgz", - "integrity": "sha512-4BQJoPooKJl2G9j3XftkIXjoC9C0Av2NOrWmbLWT1vH32GcSUHjM0Arra6UfTsVyfMAuFzaLucXn1sadxJydAw==", + "version": "6.11.3", + "resolved": "https://registry.npmjs.org/protobufjs/-/protobufjs-6.11.3.tgz", + "integrity": "sha512-xL96WDdCZYdU7Slin569tFX712BxsxslWwAfAhCYjQKGTq7dAU91Lomy6nLLhh/dyGhk/YH4TwTSRxTzhuHyZg==", "hasInstallScript": true, "dependencies": { "@protobufjs/aspromise": "^1.1.2", @@ -5440,6 +5441,17 @@ "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.4.0.tgz", "integrity": "sha512-d6xOpEDfsi2CZVlPQzGeux8XMwLT9hssAsaPYExaQMuYskwb+x1x7J371tWlbBdWHroy99KnVB6qIkUbs5X3UQ==" }, + "node_modules/react-reveal": { + "version": "1.2.2", + "resolved": "https://registry.npmjs.org/react-reveal/-/react-reveal-1.2.2.tgz", + "integrity": "sha512-JCv3fAoU6Z+Lcd8U48bwzm4pMZ79qsedSXYwpwt6lJNtj/v5nKJYZZbw3yhaQPPgYePo3Y0NOCoYOq/jcsisuw==", + "dependencies": { + "prop-types": "^15.5.10" + }, + "peerDependencies": { + "react": "^15.3.0 || ^16.0.0" + } + }, "node_modules/react-style-singleton": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/react-style-singleton/-/react-style-singleton-2.2.0.tgz", @@ -10159,9 +10171,9 @@ } }, "protobufjs": { - "version": "6.11.2", - "resolved": "https://registry.npmjs.org/protobufjs/-/protobufjs-6.11.2.tgz", - "integrity": "sha512-4BQJoPooKJl2G9j3XftkIXjoC9C0Av2NOrWmbLWT1vH32GcSUHjM0Arra6UfTsVyfMAuFzaLucXn1sadxJydAw==", + "version": "6.11.3", + "resolved": "https://registry.npmjs.org/protobufjs/-/protobufjs-6.11.3.tgz", + "integrity": "sha512-xL96WDdCZYdU7Slin569tFX712BxsxslWwAfAhCYjQKGTq7dAU91Lomy6nLLhh/dyGhk/YH4TwTSRxTzhuHyZg==", "requires": { "@protobufjs/aspromise": "^1.1.2", "@protobufjs/base64": "^1.1.2", @@ -10287,6 +10299,14 @@ } } }, + "react-reveal": { + "version": "1.2.2", + "resolved": "https://registry.npmjs.org/react-reveal/-/react-reveal-1.2.2.tgz", + "integrity": "sha512-JCv3fAoU6Z+Lcd8U48bwzm4pMZ79qsedSXYwpwt6lJNtj/v5nKJYZZbw3yhaQPPgYePo3Y0NOCoYOq/jcsisuw==", + "requires": { + "prop-types": "^15.5.10" + } + }, "react-style-singleton": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/react-style-singleton/-/react-style-singleton-2.2.0.tgz", diff --git a/frontend/package.json b/frontend/package.json index 4999f43..268d82f 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -23,6 +23,7 @@ "prettier": "^2.6.2", "react": "18.0.0", "react-dom": "18.0.0", + "react-reveal": "^1.2.2", "sitemap": "^7.1.1", "tailwind-scrollbar-hide": "^1.1.7" },