diff --git a/README.md b/README.md index 41e52a8..cb3f246 100644 --- a/README.md +++ b/README.md @@ -7,12 +7,12 @@

"A Decentralised Encrypted File Storing and Sharing App which is back-boned by Ethereum Smart Contracts and is preparing its launch to the moon 🚀"

- Browse CryptoDrive + Browse CryptoDrive

What is Decentralization · - Live + Live . Report Bug · @@ -72,9 +72,9 @@ To use CryptoDrive , Metamask browser extension is required. Y ## Project Architecture -```js -Architecture and Figma need to be added here -``` +Explained on Figma [here](https://www.figma.com/proto/DihWjVshe5rKgssA7aauCM/CryptoDrive?node-id=46%3A399&scaling=min-zoom) + + @@ -140,4 +140,4 @@ Important decisions regarding the project are taken by the following maintainer. ## Deployment - + diff --git a/public/cd.png b/public/cd.png new file mode 100644 index 0000000..3d87b8b Binary files /dev/null and b/public/cd.png differ diff --git a/public/index.html b/public/index.html index b0ad515..dff8420 100644 --- a/public/index.html +++ b/public/index.html @@ -2,7 +2,7 @@ - + diff --git a/public/manifest.json b/public/manifest.json index 080d6c7..78a711c 100644 --- a/public/manifest.json +++ b/public/manifest.json @@ -1,19 +1,19 @@ { - "short_name": "React App", - "name": "Create React App Sample", + "short_name": "CryptoDrive", + "name": "A decentralized storage and sharing solution.", "icons": [ { - "src": "favicon.ico", + "src": "cd.png", "sizes": "64x64 32x32 24x24 16x16", "type": "image/x-icon" }, { - "src": "logo192.png", + "src": "cd.png", "type": "image/png", "sizes": "192x192" }, { - "src": "logo512.png", + "src": "cd.png", "type": "image/png", "sizes": "512x512" } diff --git a/src/App.js b/src/App.js index 89a787d..44a2330 100644 --- a/src/App.js +++ b/src/App.js @@ -1,6 +1,7 @@ import React from "react"; import LoginUI from "./pages/Login/"; import SignUpUI from "./pages/SignUp"; +import MtmskHelp from "./pages/Metamask" import * as ROUTES from "./constants/routes"; import { Route, Switch, useLocation } from "react-router-dom"; import { HashRouter as Router } from 'react-router-dom' @@ -26,6 +27,9 @@ export default function App() { + + + ); diff --git a/src/Web3/index.js b/src/Web3/index.js index 9d362e5..e7bfbb8 100644 --- a/src/Web3/index.js +++ b/src/Web3/index.js @@ -1,6 +1,7 @@ import Web3 from "web3"; import data from "./contractABI"; - +import {Redirect }from "react-router-dom" +import * as ROUTES from './../constants/routes' // Function LoadWeb3 used to laod the web3 in the browser and checking whether the web3 has etheruem access or not // If not it returns a alert stating the metamask is not present @@ -12,7 +13,8 @@ const loadWeb3=async ()=> { if (window.web3) { window.web3 = new Web3(window.web3.currentProvider); } else { - window.alert("please use metamask"); + window.location.replace(`https://www.cryptodrive.tech/#/help`) + return } }; @@ -30,8 +32,9 @@ const ContractConnect = async () => { return CryptoDrive; } catch(error){ - window.alert("Please install metamask to connect with the contract"); - return; + // window.alert("Please install metamask to connect with the contract"); + window.location.replace(`https://www.cryptodrive.tech/#/help`) + return } }; diff --git a/src/constants/routes.js b/src/constants/routes.js index d78a3cd..34904d0 100644 --- a/src/constants/routes.js +++ b/src/constants/routes.js @@ -4,3 +4,4 @@ export const BROWSE_FILES = "/browse-files"; export const SIGN_UP = "/signup"; export const SIGN_IN = "/signin"; export const DASHBOARD = "/dashboard" +export const HELP = "/help" \ No newline at end of file diff --git a/src/pages/Landing/src/assets/images/video-placeholder.jpg b/src/pages/Landing/src/assets/images/video-placeholder.jpg index f648451..4aa1d34 100644 Binary files a/src/pages/Landing/src/assets/images/video-placeholder.jpg and b/src/pages/Landing/src/assets/images/video-placeholder.jpg differ diff --git a/src/pages/Landing/src/components/layout/partials/FooterNav.js b/src/pages/Landing/src/components/layout/partials/FooterNav.js index b88e64e..80d262e 100644 --- a/src/pages/Landing/src/components/layout/partials/FooterNav.js +++ b/src/pages/Landing/src/components/layout/partials/FooterNav.js @@ -17,7 +17,7 @@ const FooterNav = ({ {...props} className={classes} > -

*/} ); } diff --git a/src/pages/Landing/src/components/sections/Hero.js b/src/pages/Landing/src/components/sections/Hero.js index 8f657c7..1ef6e2c 100644 --- a/src/pages/Landing/src/components/sections/Hero.js +++ b/src/pages/Landing/src/components/sections/Hero.js @@ -99,7 +99,7 @@ const Hero = ({ data-reveal-delay="800" > diff --git a/src/pages/Metamask/index.jsx b/src/pages/Metamask/index.jsx new file mode 100644 index 0000000..d91c35d --- /dev/null +++ b/src/pages/Metamask/index.jsx @@ -0,0 +1,85 @@ +import React from "react"; +import { Grid } from "@material-ui/core"; + +const Mtmsk = () => { + return ( +
+
+
+

+ Please Install Metamask Extension, in order to proceed with + Cryptodrive. +

+
+ Dont worry we will help you out if you are just getting started. +

+
+ + {" "} + Click on the metamask icon (orange fox) below to install metamask + extension. + +

+
+
+ MetamaskIcon + +
+

+
+
Step 1: Make an Account on Metamask Extension
+
+ Step 2: Copy your Account Address It looks like this:{" "} + ox0C0D.....60A +
+
+ Step 3: You do need some ethers, to start Cryptodrive, lets have + faucet ethers from Rinkeby Testnet +
+
Step 4: You need tweet your address, dont worry its safe.
+
+ Step 5: You need paste that tweet link, here{" "} + + https://faucet.rinkeby.io/ + {" "} +
+
+ Step 6: Now you have your ethers, in Metamask, you can check on to + extension +
+
+ Note: If you are not able see ethers, just click on Rinkeby Test + Network, just above your Account Address, from the drop down menu.{" "} +
+
+

+ Hurray!! You did it. +
+ Head over to{" "} + + Cryptodrive.tech + {" "} + and be the owner of your own data. +

+
+
+ ); +}; +export default Mtmsk;