mirror of
https://github.com/MetaFam/TheGame.git
synced 2026-01-25 06:08:03 -05:00
Remove old frontend
This commit is contained in:
Hammad Jutt
2
frontend/.gitignore
vendored
2
frontend/.gitignore
vendored
@@ -1,2 +0,0 @@
|
||||
node_modules
|
||||
.env
|
||||
@@ -1,44 +0,0 @@
|
||||
{
|
||||
"name": "frontend",
|
||||
"version": "0.1.0",
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"@material-ui/core": "^4.9.12",
|
||||
"@material-ui/icons": "^4.9.1",
|
||||
"@testing-library/jest-dom": "^4.2.4",
|
||||
"@testing-library/react": "^9.3.2",
|
||||
"@testing-library/user-event": "^7.1.2",
|
||||
"@walletconnect/web3-provider": "^1.0.0-beta.47",
|
||||
"bulma": "^0.8.2",
|
||||
"fortmatic": "^2.0.6",
|
||||
"react": "^16.13.1",
|
||||
"react-dom": "^16.13.1",
|
||||
"react-scripts": "3.4.1",
|
||||
"web3": "^1.2.7",
|
||||
"web3modal": "^1.5.0"
|
||||
},
|
||||
"scripts": {
|
||||
"start": "react-scripts start",
|
||||
"build": "react-scripts build",
|
||||
"test": "react-scripts test",
|
||||
"eject": "react-scripts eject"
|
||||
},
|
||||
"eslintConfig": {
|
||||
"extends": "react-app"
|
||||
},
|
||||
"browserslist": {
|
||||
"production": [
|
||||
">0.2%",
|
||||
"not dead",
|
||||
"not op_mini all"
|
||||
],
|
||||
"development": [
|
||||
"last 1 chrome version",
|
||||
"last 1 firefox version",
|
||||
"last 1 safari version"
|
||||
]
|
||||
},
|
||||
"devDependencies": {
|
||||
"node-sass": "^4.14.0"
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 3.1 KiB |
@@ -1,48 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<meta name="theme-color" content="#000000" />
|
||||
<meta
|
||||
name="description"
|
||||
content="Web site created using create-react-app"
|
||||
/>
|
||||
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
|
||||
<!--
|
||||
manifest.json provides metadata used when your web app is installed on a
|
||||
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
|
||||
-->
|
||||
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
|
||||
<!--
|
||||
Notice the use of %PUBLIC_URL% in the tags above.
|
||||
It will be replaced with the URL of the `public` folder during the build.
|
||||
Only files inside the `public` folder can be referenced from the HTML.
|
||||
|
||||
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
|
||||
work correctly both with client-side routing and a non-root public URL.
|
||||
Learn how to configure a non-root public URL by running `npm run build`.
|
||||
-->
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/css/all.min.css"
|
||||
integrity="sha256-h20CPZ0QyXlBuAw7A+KluUYx/3pK+c7lYEpqLTlxjYQ="
|
||||
crossorigin="anonymous"
|
||||
/>
|
||||
<title>React App</title>
|
||||
</head>
|
||||
<body>
|
||||
<noscript>You need to enable JavaScript to run this app.</noscript>
|
||||
<div id="root"></div>
|
||||
<!--
|
||||
This HTML file is a template.
|
||||
If you open it directly in the browser, you will see an empty page.
|
||||
|
||||
You can add webfonts, meta tags, or analytics to this file.
|
||||
The build step will place the bundled scripts into the <body> tag.
|
||||
|
||||
To begin the development, run `npm start` or `yarn start`.
|
||||
To create a production bundle, use `npm run build` or `yarn build`.
|
||||
--></body>
|
||||
</html>
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 5.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 9.4 KiB |
@@ -1,25 +0,0 @@
|
||||
{
|
||||
"short_name": "React App",
|
||||
"name": "Create React App Sample",
|
||||
"icons": [
|
||||
{
|
||||
"src": "favicon.ico",
|
||||
"sizes": "64x64 32x32 24x24 16x16",
|
||||
"type": "image/x-icon"
|
||||
},
|
||||
{
|
||||
"src": "logo192.png",
|
||||
"type": "image/png",
|
||||
"sizes": "192x192"
|
||||
},
|
||||
{
|
||||
"src": "logo512.png",
|
||||
"type": "image/png",
|
||||
"sizes": "512x512"
|
||||
}
|
||||
],
|
||||
"start_url": ".",
|
||||
"display": "standalone",
|
||||
"theme_color": "#000000",
|
||||
"background_color": "#ffffff"
|
||||
}
|
||||
@@ -1,3 +0,0 @@
|
||||
# https://www.robotstxt.org/robotstxt.html
|
||||
User-agent: *
|
||||
Disallow:
|
||||
@@ -1,18 +0,0 @@
|
||||
.main {
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.connect {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 770px) {
|
||||
.main {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
@@ -1,77 +0,0 @@
|
||||
import React from 'react';
|
||||
|
||||
import Web3 from 'web3';
|
||||
import Web3Modal from 'web3modal';
|
||||
import WalletConnectProvider from '@walletconnect/web3-provider';
|
||||
import Fortmatic from 'fortmatic';
|
||||
|
||||
import 'bulma';
|
||||
import { ThemeProvider, createMuiTheme } from '@material-ui/core/styles';
|
||||
|
||||
import './App.css';
|
||||
|
||||
import Profile from './pages/profile/profile';
|
||||
|
||||
const THEME = createMuiTheme({
|
||||
typography: {
|
||||
fontFamily: "'Manrope', sans-serif;",
|
||||
},
|
||||
});
|
||||
|
||||
const providerOptions = {
|
||||
walletconnect: {
|
||||
package: WalletConnectProvider,
|
||||
options: {
|
||||
infuraId: process.env.REACT_APP_INFURA_ID,
|
||||
},
|
||||
},
|
||||
fortmatic: {
|
||||
package: Fortmatic,
|
||||
options: {
|
||||
key: process.env.REACT_APP_FORTMATIC_ID,
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const web3Modal = new Web3Modal({
|
||||
network: 'ropsten',
|
||||
cacheProvider: false,
|
||||
providerOptions,
|
||||
});
|
||||
|
||||
class App extends React.Component {
|
||||
constructor() {
|
||||
super();
|
||||
this.state = {};
|
||||
}
|
||||
|
||||
loginHandler = async () => {
|
||||
web3Modal.clearCachedProvider();
|
||||
const provider = await web3Modal.connect();
|
||||
const web3 = new Web3(provider);
|
||||
const accounts = await web3.eth.getAccounts();
|
||||
|
||||
this.setState({ provider, web3, account: accounts[0] });
|
||||
};
|
||||
|
||||
render() {
|
||||
return (
|
||||
<ThemeProvider theme={THEME}>
|
||||
<div className="main">
|
||||
{this.state.account ? (
|
||||
<Profile account={this.state.account} />
|
||||
) : (
|
||||
<button
|
||||
className="button is-primary is-medium is-rounded connect"
|
||||
onClick={this.loginHandler}
|
||||
>
|
||||
Connect
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default App;
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 658 B |
Binary file not shown.
|
Before Width: | Height: | Size: 2.5 KiB |
@@ -1,10 +0,0 @@
|
||||
.achievements {
|
||||
max-height: 48.5vh;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
.achievements-panel {
|
||||
height: 100%;
|
||||
max-height: 100%;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
@@ -1,72 +0,0 @@
|
||||
import React from 'react';
|
||||
|
||||
import 'bulma';
|
||||
|
||||
import { makeStyles } from '@material-ui/core/styles';
|
||||
import ListItem from '@material-ui/core/ListItem';
|
||||
import ListItemText from '@material-ui/core/ListItemText';
|
||||
import ListItemAvatar from '@material-ui/core/ListItemAvatar';
|
||||
import Avatar from '@material-ui/core/Avatar';
|
||||
|
||||
import Star from '../../assets/star.png';
|
||||
|
||||
import './achievements.css';
|
||||
|
||||
const useStyles = makeStyles((theme) => ({
|
||||
root: {
|
||||
width: '100%',
|
||||
maxWidth: '100%',
|
||||
},
|
||||
heading: {
|
||||
color: '#fe346e',
|
||||
fontFamily: "'Share Tech Mono', monospace",
|
||||
fontSize: 15,
|
||||
flexShrink: 0,
|
||||
maxWidth: '100%',
|
||||
},
|
||||
description: {
|
||||
fontFamily: "'Share Tech Mono', monospace",
|
||||
fontSize: 13,
|
||||
},
|
||||
}));
|
||||
|
||||
const dummy = [
|
||||
{
|
||||
title:
|
||||
'sunt aut facere repellat provident occaecati excepturi optio reprehenderit',
|
||||
},
|
||||
{
|
||||
title: 'qui est esse',
|
||||
},
|
||||
{
|
||||
title: 'ea molestias quasi exercitationem repellat qui ipsa sit aut',
|
||||
},
|
||||
{
|
||||
title: 'eum et est occaecati',
|
||||
},
|
||||
{
|
||||
title: 'nesciunt quas odio',
|
||||
},
|
||||
];
|
||||
|
||||
const Achievements = () => {
|
||||
const classes = useStyles();
|
||||
return (
|
||||
<div className="tile is-child box achievements">
|
||||
<div className={`${classes.root} achievements-panel`}>
|
||||
<p>Honors & Achievemnts</p>
|
||||
<br></br>
|
||||
{dummy.map((item, index) => (
|
||||
<ListItem key={index}>
|
||||
<ListItemAvatar>
|
||||
<Avatar src={Star}></Avatar>
|
||||
</ListItemAvatar>
|
||||
<ListItemText primary={item.title} secondary="20-04-2020" />
|
||||
</ListItem>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default Achievements;
|
||||
@@ -1,10 +0,0 @@
|
||||
.activities {
|
||||
max-height: 45vh;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
.activities-panel {
|
||||
height: 100%;
|
||||
max-height: 100%;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
@@ -1,107 +0,0 @@
|
||||
import React from 'react';
|
||||
|
||||
import 'bulma';
|
||||
|
||||
import { makeStyles } from '@material-ui/core/styles';
|
||||
import ExpansionPanel from '@material-ui/core/ExpansionPanel';
|
||||
import ExpansionPanelDetails from '@material-ui/core/ExpansionPanelDetails';
|
||||
import ExpansionPanelSummary from '@material-ui/core/ExpansionPanelSummary';
|
||||
import Typography from '@material-ui/core/Typography';
|
||||
|
||||
import './activities.css';
|
||||
|
||||
const useStyles = makeStyles((theme) => ({
|
||||
root: {
|
||||
width: '100%',
|
||||
maxWidth: '100%',
|
||||
},
|
||||
heading: {
|
||||
color: '#fe346e',
|
||||
fontFamily: "'Share Tech Mono', monospace",
|
||||
fontSize: 15,
|
||||
flexShrink: 0,
|
||||
maxWidth: '100%',
|
||||
},
|
||||
description: {
|
||||
fontFamily: "'Share Tech Mono', monospace",
|
||||
fontSize: 13,
|
||||
},
|
||||
}));
|
||||
|
||||
const dummy = [
|
||||
{
|
||||
userId: 1,
|
||||
id: 1,
|
||||
title:
|
||||
'sunt aut facere repellat provident occaecati excepturi optio reprehenderit',
|
||||
body:
|
||||
'quia et suscipit\nsuscipit recusandae consequuntur expedita et cum\nreprehenderit molestiae ut ut quas totam\nnostrum rerum est autem sunt rem eveniet architecto',
|
||||
},
|
||||
{
|
||||
userId: 1,
|
||||
id: 2,
|
||||
title: 'qui est esse',
|
||||
body:
|
||||
'est rerum tempore vitae\nsequi sint nihil reprehenderit dolor beatae ea dolores neque\nfugiat blanditiis voluptate porro vel nihil molestiae ut reiciendis\nqui aperiam non debitis possimus qui neque nisi nulla',
|
||||
},
|
||||
{
|
||||
userId: 1,
|
||||
id: 3,
|
||||
title: 'ea molestias quasi exercitationem repellat qui ipsa sit aut',
|
||||
body:
|
||||
'et iusto sed quo iure\nvoluptatem occaecati omnis eligendi aut ad\nvoluptatem doloribus vel accusantium quis pariatur\nmolestiae porro eius odio et labore et velit aut',
|
||||
},
|
||||
{
|
||||
userId: 1,
|
||||
id: 4,
|
||||
title: 'eum et est occaecati',
|
||||
body:
|
||||
'ullam et saepe reiciendis voluptatem adipisci\nsit amet autem assumenda provident rerum culpa\nquis hic commodi nesciunt rem tenetur doloremque ipsam iure\nquis sunt voluptatem rerum illo velit',
|
||||
},
|
||||
{
|
||||
userId: 1,
|
||||
id: 5,
|
||||
title: 'nesciunt quas odio',
|
||||
body:
|
||||
'repudiandae veniam quaerat sunt sed\nalias aut fugiat sit autem sed est\nvoluptatem omnis possimus esse voluptatibus quis\nest aut tenetur dolor neque',
|
||||
},
|
||||
];
|
||||
|
||||
const Activities = () => {
|
||||
const classes = useStyles();
|
||||
const [expanded, setExpanded] = React.useState(false);
|
||||
|
||||
const handleChange = (panel) => (event, isExpanded) => {
|
||||
setExpanded(isExpanded ? panel : false);
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="tile is-child box activities">
|
||||
<div className={`${classes.root} activities-panel`}>
|
||||
<p>Recent Activities</p>
|
||||
<br></br>
|
||||
{dummy.map((item, index) => (
|
||||
<ExpansionPanel
|
||||
key={index}
|
||||
expanded={expanded === index}
|
||||
onChange={handleChange(index)}
|
||||
>
|
||||
<ExpansionPanelSummary
|
||||
aria-controls="panel1bh-content"
|
||||
id="panel1bh-header"
|
||||
>
|
||||
<Typography className={classes.heading}>{item.title}</Typography>
|
||||
</ExpansionPanelSummary>
|
||||
<ExpansionPanelDetails>
|
||||
<Typography className={classes.description}>
|
||||
{item.body}
|
||||
</Typography>
|
||||
</ExpansionPanelDetails>
|
||||
</ExpansionPanel>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default Activities;
|
||||
@@ -1,5 +0,0 @@
|
||||
.bio {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
@@ -1,36 +0,0 @@
|
||||
import React from 'react';
|
||||
|
||||
import 'bulma';
|
||||
import { TextField } from '@material-ui/core';
|
||||
|
||||
import './bio.css';
|
||||
|
||||
class Bio extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div className="tile is-child box bio">
|
||||
<figure className="image is-128x128">
|
||||
<img
|
||||
className="is-rounded"
|
||||
src="https://bulma.io/images/placeholders/128x128.png"
|
||||
alt=""
|
||||
/>
|
||||
</figure>
|
||||
<TextField id="standard-required" label="Name" defaultValue="Saimano" />
|
||||
<br></br>
|
||||
<TextField
|
||||
id="outlined-multiline-static"
|
||||
label="Bio"
|
||||
multiline
|
||||
rows={3}
|
||||
defaultValue="Am Awesome!"
|
||||
variant="outlined"
|
||||
/>
|
||||
<br></br>
|
||||
<button className="button is-rounded is-small">Save</button>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default Bio;
|
||||
@@ -1,39 +0,0 @@
|
||||
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@300;400&display=swap');
|
||||
|
||||
.game {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
font-family: 'Manrope', sans-serif;
|
||||
}
|
||||
|
||||
.game .role-stat {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.game .role {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.game .player-stat {
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.game .skills {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.game .buttons {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-top: 25px;
|
||||
}
|
||||
|
||||
.skills .tag {
|
||||
margin: 2px;
|
||||
}
|
||||
@@ -1,69 +0,0 @@
|
||||
import React from 'react';
|
||||
|
||||
import 'bulma';
|
||||
|
||||
import ListItem from '@material-ui/core/ListItem';
|
||||
import ListItemText from '@material-ui/core/ListItemText';
|
||||
import Badge from '@material-ui/core/Badge';
|
||||
|
||||
import './game.css';
|
||||
|
||||
class Game extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div className="tile is-child box game">
|
||||
<div className="role-stat">
|
||||
<div className="role">
|
||||
<figure className="image is-128x128">
|
||||
<img
|
||||
src="https://github.com/gemwise-invests/Meta-Skill/raw/master/asset/img/mage.png"
|
||||
alt=""
|
||||
/>
|
||||
</figure>
|
||||
|
||||
<Badge badgeContent={4} color="primary">
|
||||
<span className="tag is-primary is-light medium">Developer</span>
|
||||
</Badge>
|
||||
</div>
|
||||
<div className="player-stat">
|
||||
<ListItem>
|
||||
<ListItemText primary="Experience" secondary="2012 XP" />
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<ListItemText primary="Reputation" secondary="Diamond" />
|
||||
</ListItem>
|
||||
</div>
|
||||
</div>
|
||||
<div className="skills">
|
||||
<span className="tag is-success">
|
||||
ReactJs
|
||||
<button className="delete is-small"></button>
|
||||
</span>
|
||||
<span className="tag is-success">
|
||||
NodeJs
|
||||
<button className="delete is-small"></button>
|
||||
</span>
|
||||
<span className="tag is-success">
|
||||
Web3
|
||||
<button className="delete is-small"></button>
|
||||
</span>
|
||||
<span className="tag is-success">
|
||||
ExpressJs
|
||||
<button className="delete is-small"></button>
|
||||
</span>
|
||||
<span className="tag is-danger">
|
||||
Solidity
|
||||
<button className="delete is-small"></button>
|
||||
</span>
|
||||
</div>
|
||||
<div className="buttons">
|
||||
<button className="button is-small is-rounded">Trust</button>
|
||||
<button className="button is-small is-rounded">Message</button>
|
||||
<button className="button is-small is-rounded">Contract</button>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default Game;
|
||||
@@ -1,20 +0,0 @@
|
||||
.nft {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.nft .image {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 770px) {
|
||||
.nft {
|
||||
flex-direction: row;
|
||||
overflow-x: scroll;
|
||||
}
|
||||
.nft .image {
|
||||
margin-bottom: 0;
|
||||
margin-right: 15px;
|
||||
}
|
||||
}
|
||||
@@ -1,44 +0,0 @@
|
||||
import React from 'react';
|
||||
|
||||
import 'bulma';
|
||||
|
||||
import Tooltip from '@material-ui/core/Tooltip';
|
||||
|
||||
import './nft.css';
|
||||
|
||||
const dummy = [
|
||||
{
|
||||
url: 'https://gitcoin.co/dynamic/kudos/60/collaboration_machine',
|
||||
title: 'Collaboration Machine',
|
||||
},
|
||||
{
|
||||
url: 'https://gitcoin.co/dynamic/kudos/10864/sustain_web3_winner',
|
||||
title: 'Sustain Web3 Winner',
|
||||
},
|
||||
{
|
||||
url: 'https://gitcoin.co/dynamic/kudos/17049/stop_covid_winner',
|
||||
title: 'Stop Covid Winner',
|
||||
},
|
||||
{
|
||||
url: 'https://gitcoin.co/dynamic/kudos/17033/cosmos',
|
||||
title: 'Cosmos',
|
||||
},
|
||||
];
|
||||
|
||||
class NFT extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div className="tile is-child box nft">
|
||||
{dummy.map((item, index) => (
|
||||
<Tooltip title={item.title} placement="left" key={index}>
|
||||
<figure className="image is-32x32">
|
||||
<img className="is-rounded" src={item.url} alt="" />
|
||||
</figure>
|
||||
</Tooltip>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default NFT;
|
||||
@@ -1,20 +0,0 @@
|
||||
.quick {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
#add {
|
||||
margin-top: auto;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 770px) {
|
||||
.quick {
|
||||
flex-direction: row;
|
||||
overflow-x: scroll;
|
||||
}
|
||||
#add {
|
||||
margin-left: auto;
|
||||
max-height: 25px;
|
||||
max-width: 25px;
|
||||
}
|
||||
}
|
||||
@@ -1,45 +0,0 @@
|
||||
import React from 'react';
|
||||
|
||||
import 'bulma';
|
||||
|
||||
import './quick.css';
|
||||
|
||||
import PushPin from '../../assets/pushpin.png';
|
||||
import { IconButton } from '@material-ui/core';
|
||||
import AddIcon from '@material-ui/icons/Add';
|
||||
|
||||
class Quick extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div className="tile is-child box quick">
|
||||
<span className="tag is-light">
|
||||
<img src={PushPin} alt="" />
|
||||
<button className="delete is-small"></button>
|
||||
</span>
|
||||
<span className="tag is-light">
|
||||
<img src={PushPin} alt="" />
|
||||
<button className="delete is-small"></button>
|
||||
</span>
|
||||
<span className="tag is-light">
|
||||
<img src={PushPin} alt="" />
|
||||
<button className="delete is-small"></button>
|
||||
</span>
|
||||
<span className="tag is-light">
|
||||
<img src={PushPin} alt="" />
|
||||
<button className="delete is-small"></button>
|
||||
</span>
|
||||
<span className="tag is-light">
|
||||
<img src={PushPin} alt="" />
|
||||
<button className="delete is-small"></button>
|
||||
</span>
|
||||
<div id="add">
|
||||
<IconButton aria-label="Add">
|
||||
<AddIcon fontSize="small" />
|
||||
</IconButton>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default Quick;
|
||||
@@ -1,23 +0,0 @@
|
||||
.container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-evenly;
|
||||
}
|
||||
|
||||
.token {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.social {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.social a {
|
||||
margin: 5px;
|
||||
}
|
||||
@@ -1,72 +0,0 @@
|
||||
import React from 'react';
|
||||
|
||||
import 'bulma';
|
||||
|
||||
import { TextField } from '@material-ui/core';
|
||||
import ListItem from '@material-ui/core/ListItem';
|
||||
import ListItemText from '@material-ui/core/ListItemText';
|
||||
import ListItemAvatar from '@material-ui/core/ListItemAvatar';
|
||||
import Avatar from '@material-ui/core/Avatar';
|
||||
|
||||
import './social.css';
|
||||
|
||||
class Token extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div className="tile is-child container box">
|
||||
<div className="dao">
|
||||
<ListItem>
|
||||
<ListItemAvatar>
|
||||
<Avatar src="https://handbook.raidguild.org/img/rg-icon.png"></Avatar>
|
||||
</ListItemAvatar>
|
||||
<ListItemText primary="RaidGuild" secondary="20 Shares" />
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<ListItemAvatar>
|
||||
<Avatar src="https://cdn-images-1.medium.com/max/326/1*1rMv9dd9Rk7F7U8mLlovyQ@2x.jpeg"></Avatar>
|
||||
</ListItemAvatar>
|
||||
<ListItemText primary="MetaCartel" secondary="10 Shares" />
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<ListItemAvatar>
|
||||
<Avatar src="https://avatars3.githubusercontent.com/u/58242757?s=200&v=4"></Avatar>
|
||||
</ListItemAvatar>
|
||||
<ListItemText primary="MetaGame" secondary="20 Seeds" />
|
||||
</ListItem>
|
||||
</div>
|
||||
<div className="token">
|
||||
<span className="tag">$SAIMANO</span>
|
||||
<br></br>
|
||||
<TextField
|
||||
id="outlined-number"
|
||||
label="0.012 ETH/$SAIMANO"
|
||||
type="number"
|
||||
InputLabelProps={{
|
||||
shrink: true,
|
||||
}}
|
||||
variant="outlined"
|
||||
/>
|
||||
<br></br>
|
||||
<button className="button is-small is-rounded">Buy</button>
|
||||
<br></br>
|
||||
<div className="social">
|
||||
<a href="#" target="_blank">
|
||||
<i className="fab fa-twitter fa-2x"></i>
|
||||
</a>
|
||||
<a href="#" target="_blank">
|
||||
<i className="fab fa-facebook fa-2x"></i>
|
||||
</a>
|
||||
<a href="#" target="_blank">
|
||||
<i className="fab fa-github fa-2x"></i>
|
||||
</a>
|
||||
<a href="#" target="_blank">
|
||||
<i className="fab fa-linkedin fa-2x"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default Token;
|
||||
@@ -1,11 +0,0 @@
|
||||
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@300;400&display=swap');
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: 'Manrope', sans-serif;
|
||||
}
|
||||
@@ -1,11 +0,0 @@
|
||||
import React from 'react';
|
||||
import ReactDOM from 'react-dom';
|
||||
import './index.css';
|
||||
import App from './App';
|
||||
|
||||
ReactDOM.render(
|
||||
<React.StrictMode>
|
||||
<App />
|
||||
</React.StrictMode>,
|
||||
document.getElementById('root'),
|
||||
);
|
||||
@@ -1,16 +0,0 @@
|
||||
.is-ancestor {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.chips {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-evenly;
|
||||
margin: 20px 0 0 0;
|
||||
}
|
||||
|
||||
.dashboard {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
@@ -1,63 +0,0 @@
|
||||
import React from 'react';
|
||||
|
||||
import 'bulma';
|
||||
import { Chip, Badge } from '@material-ui/core';
|
||||
|
||||
import Bio from '../../components/bio/bio';
|
||||
import Game from '../../components/game/game';
|
||||
import Quick from '../../components/quick/quick';
|
||||
import Activities from '../../components/activities/activities';
|
||||
import Achievements from '../../components/achievements/achievements';
|
||||
import NFT from '../../components/nft/nft';
|
||||
import Social from '../../components/social/social';
|
||||
|
||||
import './profile.css';
|
||||
|
||||
class Profile extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div class="tile is-ancestor">
|
||||
<div class="tile is-1 is-vertical is-parent">
|
||||
<Quick />
|
||||
</div>
|
||||
<div class="tile is-3 is-vertical is-parent">
|
||||
<Bio account={this.props.account} />
|
||||
<Game />
|
||||
</div>
|
||||
|
||||
<div class="tile is-7 is-vertical">
|
||||
<div className="chips">
|
||||
<Badge color="secondary" variant="dot">
|
||||
<Chip label="Quests" clickable color="primary" />
|
||||
</Badge>
|
||||
<Chip label="Skill Tree" clickable color="primary" />
|
||||
<Chip label="Raids" clickable color="primary" />
|
||||
</div>
|
||||
|
||||
<div className="tile">
|
||||
{/* <div class='tile is-parent'>
|
||||
<Dao />
|
||||
</div> */}
|
||||
<div class="tile is-parent">
|
||||
<Social />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="tile">
|
||||
<div class="tile is-parent">
|
||||
<Achievements />
|
||||
</div>
|
||||
<div class="tile is-parent">
|
||||
<Activities />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tile is-1 is-vertical is-parent">
|
||||
<NFT />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default Profile;
|
||||
13162
frontend/yarn.lock
13162
frontend/yarn.lock
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user