├── .gitignore
├── LICENSE
├── README.md
├── contracts
    ├── .gitkeep
    └── Example.sol
├── deploy
    ├── .gitignore
    ├── compile.js
    ├── deploy.js
    ├── package-lock.json
    └── package.json
├── package.json
├── pages
    ├── _app.js
    ├── _document.js
    ├── about.js
    └── index.js
├── public
    ├── favicon.ico
    ├── icons
    │   ├── icon-192x192.png
    │   └── icon-512x512.png
    ├── img
    │   └── background.png
    ├── logo.svg
    ├── manifest.json
    └── robots.txt
├── src
    ├── components
    │   ├── ConnectWallet.jsx
    │   └── Navbar.jsx
    ├── contracts
    │   └── Example.js
    ├── hooks
    │   └── web3.js
    └── utils
    │   └── theme.js
└── yarn.lock


/.gitignore:
--------------------------------------------------------------------------------
 1 | # See https://help.github.com/ignore-files/ for more about ignoring files.
 2 | 
 3 | # dependencies
 4 | /node_modules
 5 | 
 6 | # misc
 7 | .DS_Store
 8 | .env.local
 9 | .env.development.local
10 | .env.test.local
11 | .env.production.local
12 | 
13 | npm-debug.log*
14 | yarn-debug.log*
15 | yarn-error.log*
16 | 
17 | # Next.js
18 | /.next
19 | 
20 | .env


--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
 1 | MIT License
 2 | 
 3 | Copyright (c) 2021 Aman Raj
 4 | 
 5 | Permission is hereby granted, free of charge, to any person obtaining a copy
 6 | of this software and associated documentation files (the "Software"), to deal
 7 | in the Software without restriction, including without limitation the rights
 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 | 
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 | 
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | <p align="center"><img src="public/logo.svg" align="center" width="250"></p>
 2 | <h2 align="center">Next.js Web3 template</h2>
 3 | 
 4 | <p align="center"><b>🏗️ Next.js + Material UI + dark mode + web3 starter template ⚡</b></p>
 5 | 
 6 | This is a starter boilerplate Ethereum dapp using Next.js and material UI with dark mode. There are many web3 template available but most of them depends of web3-react. I tried to use minimum dependencies possible.
 7 | 
 8 | ### Quick start
 9 | 
10 | The first things you need to do is clone repo.
11 | 
12 | To compile and deploy contract
13 | 
14 | ```bash
15 | cd deploy
16 | npm i
17 | npm start
18 | ```
19 | 
20 | Run the client on base directory
21 | 
22 | ```bash
23 | yarn install
24 | yarn run dev
25 | ```
26 | 
27 | #### Project Structure
28 | 
29 | ```
30 | ├── contracts          // All solidity files
31 | │    ├── Example.sol
32 | ├── deploy
33 | │    ├── compile.js    // compiles contracts
34 | │    ├── deploy.js     // deploy and get abi and bytecode
35 | │    ├── package.json
36 | ├── pages              // All pages of nextjs
37 | │    ├── _app.js
38 | │    ├── _documesnt.js
39 | ├── public             // contains static files
40 | │    ├── img
41 | │    ├── icons
42 | ├── src
43 | │    ├── contracts     // here we store abi and bytecodes of contracts
44 | │    ├── components    // react components
45 | │    ├── hooks         // web and imp hooks
46 | │    ├── utils         // theme and other lib files
47 | ├── .env
48 | ├── .gitignore
49 | ├── package.json
50 | └── README.md
51 | ```
52 | 


--------------------------------------------------------------------------------
/contracts/.gitkeep:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/AmanRaj1608/nextjs-web3-template/d3b73ea56c7f2c7e54c2df39e11b800fcb72ecd9/contracts/.gitkeep


--------------------------------------------------------------------------------
/contracts/Example.sol:
--------------------------------------------------------------------------------
 1 | // SPDX-License-Identifier: GPL-3.0
 2 | 
 3 | pragma solidity >=0.7.0 <0.8.3;
 4 | 
 5 | contract Example {
 6 |     uint256 number;
 7 | 
 8 |     function store(uint256 num) public {
 9 |         number = num;
10 |     }
11 | 
12 |     function retrieve() public view returns (uint256) {
13 |         return number;
14 |     }
15 | }
16 | 


--------------------------------------------------------------------------------
/deploy/.gitignore:
--------------------------------------------------------------------------------
1 | /node_modules
2 | .env
3 | 


--------------------------------------------------------------------------------
/deploy/compile.js:
--------------------------------------------------------------------------------
 1 | const path = require('path');
 2 | const fs = require('fs');
 3 | const solc = require('solc');
 4 | 
 5 | const contractPath = path.resolve(__dirname, '../contracts', 'Example.sol');
 6 | const source = fs.readFileSync(contractPath, 'utf8');
 7 | // console.log(source);
 8 | 
 9 | const input = {
10 |   language: 'Solidity',
11 |   sources: {
12 |     'Example.sol': {
13 |       content: source
14 |     }
15 |   },
16 |   settings: {
17 |     outputSelection: {
18 |       '*': {
19 |         '*': ['*']
20 |       }
21 |     }
22 |   }
23 | }
24 | const result = JSON.parse(solc.compile(JSON.stringify(input))).contracts['Example.sol'].Example;
25 | // console.log(result);
26 | 
27 | const { abi: interface, evm: { bytecode: { object } } } = result;
28 | // console.log(interface, object);
29 | 
30 | module.exports = { interface, object }; // object is the actual name of the bytecode
31 | 


--------------------------------------------------------------------------------
/deploy/deploy.js:
--------------------------------------------------------------------------------
 1 | const Web3 = require('web3');
 2 | const HDWalletProvider = require('@truffle/hdwallet-provider');
 3 | 
 4 | const { interface, object } = require('./compile');
 5 | 
 6 | const privateKey = '6ad90a424022be35f9a95ae44143db08c894ba44ed0de90b67199288e06924d5';
 7 | const rpcUrl = 'https://rinkeby.infura.io/v3/196440d5d02d41dfa2a8ee5bfd2e96bd';
 8 | 
 9 | const provider = new HDWalletProvider(privateKey, rpcUrl);
10 | const web3 = new Web3(provider);
11 | 
12 | const deploy = async () => {
13 |   const accounts = await web3.eth.getAccounts();
14 | 
15 |   console.log('Attempting to deploy from account', accounts[0]);
16 |   
17 |   const result = await new web3.eth.Contract(interface)
18 |     .deploy({ data: object })
19 |     .send({ gas: '1000000', from: accounts[0] });
20 | 
21 |   console.log('Contract deployed to', result.options.address);
22 | };
23 | 
24 | deploy();
25 | 


--------------------------------------------------------------------------------
/deploy/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "next-web3-deploy",
 3 |   "version": "1.0.0",
 4 |   "description": "",
 5 |   "main": "deploy.js",
 6 |   "scripts": {
 7 |     "start": "node deploy.js"
 8 |   },
 9 |   "repository": {
10 |     "type": "git",
11 |     "url": "git+https://github.com/AmanRaj1608/nextjs-web3-template.git"
12 |   },
13 |   "keywords": [
14 |     "nextjs-web3-starter"
15 |   ],
16 |   "author": "Aman Raj <archanaamanraj@gmail.com>",
17 |   "license": "MIT",
18 |   "bugs": {
19 |     "url": "https://github.com/AmanRaj1608/nextjs-web3-template/issues"
20 |   },
21 |   "homepage": "https://github.com/AmanRaj1608/nextjs-web3-template#readme",
22 |   "dependencies": {
23 |     "@truffle/hdwallet-provider": "^1.2.2",
24 |     "solc": "^0.8.2",
25 |     "web3": "^1.3.4"
26 |   }
27 | }
28 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "nextjs-web3-starter",
 3 |   "version": "1.0.0",
 4 |   "author": "Aman Raj <archanaamanraj@gmail.com>",
 5 |   "scripts": {
 6 |     "dev": "next",
 7 |     "build": "next build",
 8 |     "start": "next start"
 9 |   },
10 |   "homepage": "https://github.com/AmanRaj1608/nextjs-web3-template",
11 |   "license": "MIT",
12 |   "dependencies": {
13 |     "next": "^10.0.6",
14 |     "react": "^17.0.1",
15 |     "react-dom": "^17.0.1",
16 |     "@material-ui/core": "^4.11.0",
17 |     "@material-ui/icons": "^4.9.1",
18 |     "web3": "^1.3.4",
19 |     "ethers": "^5.0.31",
20 |     "web3modal": "^1.9.3",
21 |     "react-blockies": "^1.4.1",
22 |     "@walletconnect/web3-provider": "^1.3.6"
23 |   }
24 | }
25 | 


--------------------------------------------------------------------------------
/pages/_app.js:
--------------------------------------------------------------------------------
 1 | import React, { useState, useEffect } from 'react';
 2 | import Head from 'next/head';
 3 | 
 4 | import { ThemeProvider } from '@material-ui/core/styles';
 5 | import CssBaseline from '@material-ui/core/CssBaseline';
 6 | 
 7 | import { darkTheme, lightTheme } from '../src/utils/theme';
 8 | import Navbar from '../src/components/Navbar';
 9 | 
10 | const App = ({ Component, pageProps }) => {
11 |   const [darkMode, setDarkMode] = useState(0);
12 |   const [isMobile, setIsMobile] = useState(false);
13 | 
14 |   useEffect(() => {
15 |     // Remove the server-side injected CSS.
16 |     const jssStyles = document.querySelector('#jss-server-side');
17 |     if (jssStyles) {
18 |       jssStyles.parentElement.removeChild(jssStyles);
19 |     }
20 |     // Setup darkmode
21 |     setDarkMode(
22 |       localStorage.getItem('mode')
23 |         ? parseInt(localStorage.getItem('mode'))
24 |         : 0
25 |     )
26 |     // Naive check for mobile
27 |     setIsMobile(
28 |       navigator.userAgent.match(
29 |         /(iPad)|(iPhone)|(iPod)|(android)|(webOS)/i
30 |       )
31 |     )
32 |   }, []);
33 | 
34 |   const toggleMode = () => {
35 |     localStorage.setItem('mode', (1 - darkMode).toString())
36 |     setDarkMode(1 - darkMode)
37 |   }
38 | 
39 |   const muiTheme = darkMode ? lightTheme : darkTheme;
40 | 
41 |   return (
42 |     <React.Fragment>
43 |       <Head>
44 |         <title>Nextjs Web3 starter</title>
45 |         <meta name="viewport" content="minimum-scale=1, initial-scale=1, width=device-width" />
46 |       </Head>
47 |       <ThemeProvider theme={muiTheme}>
48 |         {/* CssBaseline kickstart an elegant, consistent, and simple baseline to build upon. */}
49 |         <CssBaseline />
50 |         <Navbar
51 |           {...pageProps}
52 |           darkMode={darkMode}
53 |           toggleMode={toggleMode}
54 |         />
55 |         <Component
56 |           {...pageProps}
57 |           isMobile={isMobile}
58 |         />
59 |       </ThemeProvider>
60 |     </React.Fragment>
61 |   );
62 | }
63 | 
64 | export default App;


--------------------------------------------------------------------------------
/pages/_document.js:
--------------------------------------------------------------------------------
 1 | import * as React from 'react';
 2 | import Document, { Html, Head, Main, NextScript } from 'next/document';
 3 | 
 4 | import { ServerStyleSheets } from '@material-ui/core/styles';
 5 | 
 6 | export default class MyDocument extends Document {
 7 |   render() {
 8 |     return (
 9 |       <Html lang="en">
10 |         {/* SEO Part */}
11 |         <Head>
12 |           <meta name="theme-color" content="#ee6f57" />
13 |           {/* Template by https://amanraj.dev/ */}
14 | 
15 |           <link rel="shortcut icon" href="/favicon.ico" />
16 |           <link rel="apple-touch-icon" href="/icons/logo.png" />
17 |           <meta name="theme-color" content="#000000" />
18 | 
19 |           <meta name="mobile-web-app-capable" content="yes" />
20 |           <meta name="apple-mobile-web-app-capable" content="yes" />
21 |           <link rel="apple-touch-icon" href="/icons/logo.png" />
22 |           <link rel="manifest" href="/manifest.json" />
23 |           <link rel="preconnect" href="https://fonts.gstatic.com" />
24 |           <link
25 |             href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,400;0,500;0,700;1,700;1,900&display=swap"
26 |             rel="stylesheet"
27 |           />
28 |         </Head>
29 |         <body>
30 |           <Main />
31 |           <NextScript />
32 |         </body>
33 |       </Html>
34 |     );
35 |   }
36 | }
37 | 
38 | MyDocument.getInitialProps = async (ctx) => {
39 |   const sheets = new ServerStyleSheets();
40 |   const originalRenderPage = ctx.renderPage;
41 | 
42 |   ctx.renderPage = () =>
43 |     originalRenderPage({
44 |       enhanceApp: (App) => (props) => sheets.collect(<App {...props} />),
45 |     });
46 | 
47 |   const initialProps = await Document.getInitialProps(ctx);
48 | 
49 |   return {
50 |     ...initialProps,
51 |     // Styles fragment is rendered after the app and page rendering finish.
52 |     styles: [
53 |       ...React.Children.toArray(initialProps.styles),
54 |       sheets.getStyleElement(),
55 |     ],
56 |   };
57 | };
58 | 


--------------------------------------------------------------------------------
/pages/about.js:
--------------------------------------------------------------------------------
 1 | import React, { useState, useEffect } from 'react';
 2 | import Link from 'next/link';
 3 | 
 4 | import Typography from '@material-ui/core/Typography';
 5 | import { makeStyles } from '@material-ui/core/styles';
 6 | 
 7 | const Index = () => {
 8 |   const classes = useStyles();
 9 | 
10 |   return (
11 |     <main className={classes.main}>
12 |       <div>
13 |         <Typography variant="h3">
14 |           Web3 starter template
15 |         </Typography>
16 |         <Typography variant="h6">
17 |           Next.js + Material UI + dark mode + web3 starter template. Boilerplate to get starter quickly.
18 |         </Typography>
19 |       </div>
20 |       <Link href="/">
21 |         <a className={classes.text}>Home</a>
22 |       </Link>
23 |     </main>
24 |   );
25 | }
26 | 
27 | const useStyles = makeStyles((theme) => ({
28 |   main: {
29 |     width: '100%',
30 |     margin: '100px auto',
31 |     maxWidth: 1100,
32 |     textAlign: 'center'
33 |   },
34 |   text: {
35 |     fontSize: 18
36 |   }
37 | }));
38 | 
39 | export default Index;
40 | 


--------------------------------------------------------------------------------
/pages/index.js:
--------------------------------------------------------------------------------
 1 | import React, { useState, useEffect } from 'react';
 2 | import Link from 'next/link';
 3 | 
 4 | import Typography from '@material-ui/core/Typography';
 5 | import { makeStyles } from '@material-ui/core/styles';
 6 | 
 7 | const Index = () => {
 8 |   const classes = useStyles();
 9 | 
10 |   return (
11 |     <main className={classes.main}>
12 |       <div>
13 |         <Typography variant="h3">
14 |           Web3 starter template
15 |         </Typography>
16 |         <Typography variant="h6">
17 |           Next.js + Material UI + dark mode + web3 starter template. Boilerplate to get starter quickly.
18 |         </Typography>
19 |       </div>
20 |       <Link href="/about">
21 |         <a className={classes.text}>About</a>
22 |       </Link>
23 |     </main>
24 |   );
25 | }
26 | 
27 | const useStyles = makeStyles((theme) => ({
28 |   main: {
29 |     width: '100%',
30 |     margin: '100px auto',
31 |     maxWidth: 1100,
32 |     textAlign: 'center'
33 |   },
34 |   text: {
35 |     fontSize: 18
36 |   }
37 | }));
38 | 
39 | export default Index;
40 | 


--------------------------------------------------------------------------------
/public/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/AmanRaj1608/nextjs-web3-template/d3b73ea56c7f2c7e54c2df39e11b800fcb72ecd9/public/favicon.ico


--------------------------------------------------------------------------------
/public/icons/icon-192x192.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/AmanRaj1608/nextjs-web3-template/d3b73ea56c7f2c7e54c2df39e11b800fcb72ecd9/public/icons/icon-192x192.png


--------------------------------------------------------------------------------
/public/icons/icon-512x512.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/AmanRaj1608/nextjs-web3-template/d3b73ea56c7f2c7e54c2df39e11b800fcb72ecd9/public/icons/icon-512x512.png


--------------------------------------------------------------------------------
/public/img/background.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/AmanRaj1608/nextjs-web3-template/d3b73ea56c7f2c7e54c2df39e11b800fcb72ecd9/public/img/background.png


--------------------------------------------------------------------------------
/public/logo.svg:
--------------------------------------------------------------------------------
  1 | <?xml version="1.0" encoding="UTF-8"?>
  2 | <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="375pt" height="374.999991pt" viewBox="0 0 375 374.999991" version="1.2">
  3 | <defs>
  4 | <g>
  5 | <symbol overflow="visible" id="glyph0-0">
  6 | <path style="stroke:none;" d="M 6.75 -17.5 L 6.75 -2.125 L 14.453125 -2.125 L 14.453125 -17.5 Z M 4.484375 0 L 4.484375 -19.625 L 16.6875 -19.625 L 16.6875 0 Z M 4.484375 0 "/>
  7 | </symbol>
  8 | <symbol overflow="visible" id="glyph0-1">
  9 | <path style="stroke:none;" d="M 14.890625 -19.71875 L 19.6875 -19.71875 L 19.6875 0 L 14.890625 0 L 6.890625 -12.40625 L 6.890625 0 L 2.09375 0 L 2.09375 -19.71875 L 6.890625 -19.71875 L 14.890625 -7.3125 Z M 14.890625 -19.71875 "/>
 10 | </symbol>
 11 | <symbol overflow="visible" id="glyph0-2">
 12 | <path style="stroke:none;" d="M 14 -19.71875 L 14 -16.078125 L 6.890625 -16.078125 L 6.890625 -11.84375 L 13.15625 -11.84375 L 13.15625 -8.203125 L 6.890625 -8.203125 L 6.890625 -3.640625 L 14 -3.640625 L 14 0 L 2.09375 0 L 2.09375 -19.71875 Z M 14 -19.71875 "/>
 13 | </symbol>
 14 | <symbol overflow="visible" id="glyph0-3">
 15 | <path style="stroke:none;" d="M 19.234375 -19.65625 L 13.015625 -9.796875 L 19.203125 0 L 13.78125 0 L 10.15625 -5.71875 L 6.828125 0 L 1.40625 0 L 7.59375 -9.828125 L 1.40625 -19.65625 L 6.828125 -19.65625 L 10.4375 -13.921875 L 13.796875 -19.65625 Z M 19.234375 -19.65625 "/>
 16 | </symbol>
 17 | <symbol overflow="visible" id="glyph0-4">
 18 | <path style="stroke:none;" d="M 0.75 -16.015625 L 0.75 -19.65625 L 16.265625 -19.65625 L 16.265625 -16.015625 L 10.890625 -16.015625 L 10.890625 0 L 6.109375 0 L 6.109375 -16.015625 Z M 0.75 -16.015625 "/>
 19 | </symbol>
 20 | <symbol overflow="visible" id="glyph0-5">
 21 | <path style="stroke:none;" d="M 6.21875 -2.609375 C 6.21875 -1.878906 5.960938 -1.257812 5.453125 -0.75 C 4.953125 -0.25 4.332031 0 3.59375 0 C 2.851562 0 2.234375 -0.25 1.734375 -0.75 C 1.234375 -1.257812 0.984375 -1.878906 0.984375 -2.609375 C 0.984375 -3.347656 1.234375 -3.96875 1.734375 -4.46875 C 2.234375 -4.976562 2.851562 -5.234375 3.59375 -5.234375 C 4.332031 -5.234375 4.953125 -4.976562 5.453125 -4.46875 C 5.960938 -3.96875 6.21875 -3.347656 6.21875 -2.609375 Z M 6.21875 -2.609375 "/>
 22 | </symbol>
 23 | <symbol overflow="visible" id="glyph0-6">
 24 | <path style="stroke:none;" d="M 9.046875 -6.265625 L 9.046875 -19.65625 L 13.828125 -19.65625 L 13.828125 -6.265625 C 13.828125 -4.234375 13.210938 -2.644531 11.984375 -1.5 C 10.765625 -0.363281 9.203125 0.203125 7.296875 0.203125 C 5.398438 0.203125 3.84375 -0.359375 2.625 -1.484375 C 1.414062 -2.617188 0.8125 -4.210938 0.8125 -6.265625 L 5.578125 -6.265625 C 5.585938 -5.523438 5.75 -4.976562 6.0625 -4.625 C 6.382812 -4.269531 6.796875 -4.09375 7.296875 -4.09375 C 7.804688 -4.09375 8.222656 -4.269531 8.546875 -4.625 C 8.878906 -4.976562 9.046875 -5.523438 9.046875 -6.265625 Z M 9.046875 -6.265625 "/>
 25 | </symbol>
 26 | <symbol overflow="visible" id="glyph0-7">
 27 | <path style="stroke:none;" d="M 8.765625 -16.15625 C 8.171875 -16.15625 7.679688 -15.992188 7.296875 -15.671875 C 6.910156 -15.359375 6.71875 -14.898438 6.71875 -14.296875 C 6.71875 -13.703125 6.894531 -13.222656 7.25 -12.859375 C 7.601562 -12.492188 8.0625 -12.210938 8.625 -12.015625 C 9.195312 -11.828125 9.832031 -11.644531 10.53125 -11.46875 C 11.238281 -11.289062 11.9375 -11.070312 12.625 -10.8125 C 13.3125 -10.5625 13.941406 -10.25 14.515625 -9.875 C 15.085938 -9.507812 15.550781 -8.984375 15.90625 -8.296875 C 16.257812 -7.617188 16.4375 -6.804688 16.4375 -5.859375 C 16.4375 -4.191406 15.757812 -2.765625 14.40625 -1.578125 C 13.050781 -0.390625 11.265625 0.203125 9.046875 0.203125 C 6.835938 0.203125 5.054688 -0.328125 3.703125 -1.390625 C 2.359375 -2.460938 1.6875 -3.976562 1.6875 -5.9375 L 6.78125 -5.9375 C 6.90625 -4.363281 7.707031 -3.578125 9.1875 -3.578125 C 9.875 -3.578125 10.410156 -3.757812 10.796875 -4.125 C 11.191406 -4.488281 11.390625 -4.953125 11.390625 -5.515625 C 11.390625 -6.078125 11.210938 -6.535156 10.859375 -6.890625 C 10.503906 -7.242188 10.039062 -7.519531 9.46875 -7.71875 C 8.90625 -7.925781 8.273438 -8.117188 7.578125 -8.296875 C 6.878906 -8.472656 6.179688 -8.691406 5.484375 -8.953125 C 4.796875 -9.222656 4.164062 -9.535156 3.59375 -9.890625 C 3.03125 -10.253906 2.570312 -10.773438 2.21875 -11.453125 C 1.863281 -12.140625 1.6875 -12.953125 1.6875 -13.890625 C 1.6875 -15.710938 2.363281 -17.175781 3.71875 -18.28125 C 5.082031 -19.382812 6.820312 -19.9375 8.9375 -19.9375 C 11.0625 -19.9375 12.773438 -19.453125 14.078125 -18.484375 C 15.390625 -17.523438 16.070312 -16.007812 16.125 -13.9375 L 10.921875 -13.9375 C 10.847656 -14.65625 10.617188 -15.203125 10.234375 -15.578125 C 9.847656 -15.960938 9.359375 -16.15625 8.765625 -16.15625 Z M 8.765625 -16.15625 "/>
 28 | </symbol>
 29 | <symbol overflow="visible" id="glyph0-8">
 30 | <path style="stroke:none;" d=""/>
 31 | </symbol>
 32 | <symbol overflow="visible" id="glyph0-9">
 33 | <path style="stroke:none;" d="M 23.90625 -19.65625 L 29.0625 -19.65625 L 23.578125 0 L 18.09375 0 L 14.640625 -12.453125 L 11.234375 0 L 5.734375 0 L 0.171875 -19.65625 L 5.296875 -19.65625 L 8.703125 -5.515625 L 12.203125 -19.65625 L 17.640625 -19.65625 L 21 -5.734375 Z M 23.90625 -19.65625 "/>
 34 | </symbol>
 35 | <symbol overflow="visible" id="glyph0-10">
 36 | <path style="stroke:none;" d="M 2.09375 -19.65625 L 10.640625 -19.65625 C 12.640625 -19.65625 14.226562 -19.171875 15.40625 -18.203125 C 16.59375 -17.234375 17.1875 -16 17.1875 -14.5 C 17.1875 -12.28125 15.890625 -10.78125 13.296875 -10 C 14.617188 -9.8125 15.671875 -9.257812 16.453125 -8.34375 C 17.242188 -7.425781 17.640625 -6.351562 17.640625 -5.125 C 17.640625 -3.550781 17.066406 -2.300781 15.921875 -1.375 C 14.773438 -0.457031 13.171875 0 11.109375 0 L 2.09375 0 Z M 6.890625 -16.015625 L 6.890625 -11.765625 L 10.03125 -11.765625 C 10.71875 -11.765625 11.269531 -11.941406 11.6875 -12.296875 C 12.101562 -12.648438 12.3125 -13.175781 12.3125 -13.875 C 12.3125 -14.570312 12.101562 -15.101562 11.6875 -15.46875 C 11.269531 -15.832031 10.71875 -16.015625 10.03125 -16.015625 Z M 6.890625 -3.640625 L 10.5 -3.640625 C 11.15625 -3.640625 11.695312 -3.832031 12.125 -4.21875 C 12.550781 -4.613281 12.765625 -5.15625 12.765625 -5.84375 C 12.765625 -6.539062 12.554688 -7.09375 12.140625 -7.5 C 11.734375 -7.914062 11.207031 -8.125 10.5625 -8.125 L 6.890625 -8.125 Z M 6.890625 -3.640625 "/>
 37 | </symbol>
 38 | <symbol overflow="visible" id="glyph0-11">
 39 | <path style="stroke:none;" d="M 8.28125 -16.75 C 7 -16.75 6.289062 -16.054688 6.15625 -14.671875 L 1.515625 -14.671875 C 1.515625 -16.628906 2.144531 -18.144531 3.40625 -19.21875 C 4.664062 -20.289062 6.335938 -20.828125 8.421875 -20.828125 C 10.515625 -20.828125 12.140625 -20.3125 13.296875 -19.28125 C 14.453125 -18.257812 15.03125 -16.957031 15.03125 -15.375 C 15.03125 -14.125 14.726562 -13.101562 14.125 -12.3125 C 13.519531 -11.53125 12.898438 -11.007812 12.265625 -10.75 L 12.265625 -10.640625 C 14.359375 -9.835938 15.40625 -8.222656 15.40625 -5.796875 C 15.40625 -3.960938 14.789062 -2.519531 13.5625 -1.46875 C 12.34375 -0.414062 10.65625 0.109375 8.5 0.109375 C 6.34375 0.109375 4.582031 -0.4375 3.21875 -1.53125 C 1.851562 -2.632812 1.171875 -4.28125 1.171875 -6.46875 L 5.828125 -6.46875 C 5.847656 -5.644531 6.082031 -4.992188 6.53125 -4.515625 C 6.976562 -4.046875 7.597656 -3.8125 8.390625 -3.8125 C 9.179688 -3.8125 9.773438 -4.023438 10.171875 -4.453125 C 10.578125 -4.878906 10.78125 -5.488281 10.78125 -6.28125 C 10.78125 -7.070312 10.5 -7.664062 9.9375 -8.0625 C 9.375 -8.457031 8.460938 -8.65625 7.203125 -8.65625 L 6.296875 -8.65625 L 6.296875 -12.546875 L 7.203125 -12.546875 C 9.328125 -12.546875 10.390625 -13.289062 10.390625 -14.78125 C 10.390625 -15.382812 10.195312 -15.863281 9.8125 -16.21875 C 9.425781 -16.570312 8.914062 -16.75 8.28125 -16.75 Z M 8.28125 -16.75 "/>
 40 | </symbol>
 41 | <symbol overflow="visible" id="glyph1-0">
 42 | <path style="stroke:none;" d="M 2.375 -6.40625 L 2.375 -0.609375 L 5.15625 -0.609375 L 5.15625 -6.40625 Z M 1.703125 0 L 1.703125 -7.015625 L 5.8125 -7.015625 L 5.8125 0 Z M 1.703125 0 "/>
 43 | </symbol>
 44 | <symbol overflow="visible" id="glyph1-1">
 45 | <path style="stroke:none;" d="M 2.90625 -6.109375 C 2.570312 -6.109375 2.296875 -6.019531 2.078125 -5.84375 C 1.867188 -5.675781 1.765625 -5.425781 1.765625 -5.09375 C 1.765625 -4.757812 1.890625 -4.503906 2.140625 -4.328125 C 2.390625 -4.160156 2.691406 -4.035156 3.046875 -3.953125 C 3.410156 -3.878906 3.773438 -3.789062 4.140625 -3.6875 C 4.503906 -3.582031 4.8125 -3.390625 5.0625 -3.109375 C 5.3125 -2.828125 5.4375 -2.429688 5.4375 -1.921875 C 5.4375 -1.410156 5.21875 -0.953125 4.78125 -0.546875 C 4.351562 -0.140625 3.773438 0.0625 3.046875 0.0625 C 2.316406 0.0625 1.722656 -0.101562 1.265625 -0.4375 C 0.816406 -0.78125 0.59375 -1.25 0.59375 -1.84375 L 1.8125 -1.84375 C 1.84375 -1.539062 1.957031 -1.296875 2.15625 -1.109375 C 2.351562 -0.929688 2.644531 -0.84375 3.03125 -0.84375 C 3.425781 -0.84375 3.734375 -0.941406 3.953125 -1.140625 C 4.179688 -1.347656 4.296875 -1.585938 4.296875 -1.859375 C 4.296875 -2.128906 4.222656 -2.34375 4.078125 -2.5 C 3.941406 -2.65625 3.765625 -2.769531 3.546875 -2.84375 C 3.335938 -2.914062 3.101562 -2.984375 2.84375 -3.046875 C 2.582031 -3.109375 2.316406 -3.175781 2.046875 -3.25 C 1.785156 -3.332031 1.546875 -3.4375 1.328125 -3.5625 C 1.117188 -3.695312 0.941406 -3.882812 0.796875 -4.125 C 0.660156 -4.363281 0.59375 -4.660156 0.59375 -5.015625 C 0.59375 -5.628906 0.8125 -6.117188 1.25 -6.484375 C 1.6875 -6.859375 2.253906 -7.046875 2.953125 -7.046875 C 3.648438 -7.046875 4.207031 -6.882812 4.625 -6.5625 C 5.039062 -6.238281 5.269531 -5.773438 5.3125 -5.171875 L 4.0625 -5.171875 C 4.03125 -5.429688 3.914062 -5.648438 3.71875 -5.828125 C 3.519531 -6.015625 3.25 -6.109375 2.90625 -6.109375 Z M 2.90625 -6.109375 "/>
 46 | </symbol>
 47 | <symbol overflow="visible" id="glyph1-2">
 48 | <path style="stroke:none;" d="M 0.390625 -6.0625 L 0.390625 -6.953125 L 5.234375 -6.953125 L 5.234375 -6.0625 L 3.390625 -6.0625 L 3.390625 0 L 2.25 0 L 2.25 -6.0625 Z M 0.390625 -6.0625 "/>
 49 | </symbol>
 50 | <symbol overflow="visible" id="glyph1-3">
 51 | <path style="stroke:none;" d="M 5.4375 0 L 4.9375 -1.421875 L 2.03125 -1.421875 L 1.53125 0 L 0.34375 0 L 2.828125 -6.953125 L 4.15625 -6.953125 L 6.640625 0 Z M 2.34375 -2.3125 L 4.625 -2.3125 L 3.484375 -5.578125 Z M 2.34375 -2.3125 "/>
 52 | </symbol>
 53 | <symbol overflow="visible" id="glyph1-4">
 54 | <path style="stroke:none;" d="M 1.890625 -2.8125 L 1.890625 0 L 0.75 0 L 0.75 -6.953125 L 3.15625 -6.953125 C 3.9375 -6.953125 4.539062 -6.753906 4.96875 -6.359375 C 5.394531 -5.972656 5.609375 -5.476562 5.609375 -4.875 C 5.609375 -4.414062 5.46875 -4 5.1875 -3.625 C 4.90625 -3.25 4.46875 -3.003906 3.875 -2.890625 L 5.71875 0 L 4.328125 0 L 2.59375 -2.8125 Z M 1.890625 -6.0625 L 1.890625 -3.703125 L 3.15625 -3.703125 C 3.582031 -3.703125 3.898438 -3.804688 4.109375 -4.015625 C 4.328125 -4.222656 4.4375 -4.507812 4.4375 -4.875 C 4.4375 -5.25 4.328125 -5.539062 4.109375 -5.75 C 3.898438 -5.957031 3.582031 -6.0625 3.15625 -6.0625 Z M 1.890625 -6.0625 "/>
 55 | </symbol>
 56 | <symbol overflow="visible" id="glyph1-5">
 57 | <path style="stroke:none;" d="M 4.59375 -6.953125 L 4.59375 -6.0625 L 1.890625 -6.0625 L 1.890625 -3.953125 L 4.296875 -3.953125 L 4.296875 -3.078125 L 1.890625 -3.078125 L 1.890625 -0.890625 L 4.59375 -0.890625 L 4.59375 0 L 0.75 0 L 0.75 -6.953125 Z M 4.59375 -6.953125 "/>
 58 | </symbol>
 59 | </g>
 60 | <clipPath id="clip1">
 61 |   <path d="M 34.320312 200.933594 L 344 200.933594 L 344 290.390625 L 34.320312 290.390625 Z M 34.320312 200.933594 "/>
 62 | </clipPath>
 63 | <clipPath id="clip3">
 64 |   <path d="M 0.320312 0.933594 L 309.441406 0.933594 L 309.441406 90.390625 L 0.320312 90.390625 Z M 0.320312 0.933594 "/>
 65 | </clipPath>
 66 | <filter id="alpha" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%">
 67 |   <feColorMatrix type="matrix" in="SourceGraphic" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 1 0"/>
 68 | </filter>
 69 | <image id="image12" width="310" height="92" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAATYAAABcCAYAAADkpJkhAAAABmJLR0QA/wD/AP+gvaeTAAABSklEQVR4nO3UwQkAIBDAsNP9ZxaXEISSTNBX18ycAQjZvwMAXjM2IMfYgBxjA3KMDcgxNiDH2IAcYwNyjA3IMTYgx9iAHGMDcowNyDE2IMfYgBxjA3KMDcgxNiDH2IAcYwNyjA3IMTYgx9iAHGMDcowNyDE2IMfYgBxjA3KMDcgxNiDH2IAcYwNyjA3IMTYgx9iAHGMDcowNyDE2IMfYgBxjA3KMDcgxNiDH2IAcYwNyjA3IMTYgx9iAHGMDcowNyDE2IMfYgBxjA3KMDcgxNiDH2IAcYwNyjA3IMTYgx9iAHGMDcowNyDE2IMfYgBxjA3KMDcgxNiDH2IAcYwNyjA3IMTYgx9iAHGMDcowNyDE2IMfYgBxjA3KMDcgxNiDH2IAcYwNyjA3IMTYgx9iAHGMDcowNyDE2IMfYgBxjA3KMDcgxNiDH2ICcC6QAAbaviTNwAAAAAElFTkSuQmCC"/>
 70 | <mask id="mask0">
 71 |   <g filter="url(#alpha)">
 72 | <use xlink:href="#image12" transform="matrix(1,0,0,1,0.000000000000007105,0.000000000000028422)"/>
 73 |   </g>
 74 | </mask>
 75 | <clipPath id="clip4">
 76 |   <rect x="0" y="0" width="310" height="91"/>
 77 | </clipPath>
 78 | <g id="surface11" clip-path="url(#clip4)">
 79 | <path style="fill-rule:evenodd;fill:rgb(100%,34.118652%,34.118652%);fill-opacity:1;stroke-width:1;stroke-linecap:butt;stroke-linejoin:round;stroke:rgb(0%,23.139954%,31.369019%);stroke-opacity:1;stroke-miterlimit:4;" d="M 16.191844 15.999729 C 11.21329 15.999729 6.275791 14.236232 2.055274 10.852282 L 1.311166 10.25369 L 8.925252 1.657005 C 8.96484 1.612258 9.008094 1.571912 9.055746 1.535967 C 9.103398 1.500022 9.153983 1.468478 9.2075 1.442804 C 9.26175 1.416395 9.317466 1.395855 9.375382 1.38045 C 9.432565 1.365779 9.491214 1.356242 9.551329 1.352575 C 9.610711 1.348907 9.670093 1.351108 9.729475 1.359177 C 9.788857 1.367246 9.846772 1.381184 9.903222 1.400257 C 9.959671 1.420063 10.013188 1.445004 10.065239 1.475081 C 10.116557 1.505157 10.164942 1.540368 10.209662 1.579981 C 10.254382 1.61886 10.294703 1.662874 10.330625 1.710556 C 10.366548 1.758238 10.398071 1.808854 10.424463 1.862404 C 10.450122 1.915955 10.471382 1.971706 10.486045 2.029658 C 10.50144 2.086876 10.51097 2.145562 10.514636 2.205714 C 10.518302 2.265133 10.516102 2.324552 10.508038 2.383971 C 10.499974 2.442657 10.486045 2.500609 10.466984 2.557093 C 10.44719 2.613578 10.422264 2.667862 10.392207 2.719212 C 10.362149 2.771295 10.327693 2.818977 10.288105 2.863725 L 3.953297 10.015281 C 9.272747 13.937669 15.696994 15.162728 21.72023 13.372088 L 29.090924 11.177253 L 36.46235 13.372088 C 42.481921 15.162728 48.904702 13.937669 54.226351 10.018215 L 47.810901 2.819711 C 47.771313 2.775697 47.736124 2.727281 47.706066 2.675932 C 47.676009 2.623848 47.651083 2.570298 47.631289 2.513813 C 47.611495 2.457328 47.597566 2.399376 47.589502 2.339957 C 47.581437 2.281272 47.579238 2.221853 47.582171 2.1617 C 47.585836 2.102281 47.595367 2.043596 47.610029 1.985644 C 47.625424 1.927692 47.645951 1.871941 47.67161 1.81839 C 47.698002 1.76484 47.728793 1.71349 47.764715 1.665808 C 47.801371 1.618126 47.841692 1.574846 47.885678 1.535233 C 47.930398 1.49562 47.978783 1.460409 48.030101 1.430333 C 48.082152 1.399523 48.135669 1.374582 48.192119 1.355509 C 48.248568 1.335703 48.306484 1.321765 48.365866 1.313696 C 48.425248 1.304893 48.48463 1.302692 48.544012 1.30636 C 48.603394 1.310028 48.662776 1.318831 48.719958 1.334235 C 48.777874 1.348907 48.83359 1.369447 48.88784 1.395855 C 48.941358 1.42153 48.991942 1.453073 49.039594 1.489018 C 49.087247 1.524963 49.131233 1.565309 49.170821 1.610057 L 56.87288 10.252957 L 56.125841 10.853015 C 50.189845 15.613139 42.833814 17.166836 35.943308 15.11578 L 29.090924 13.077194 L 22.239273 15.117247 C 20.266472 15.705569 18.250418 16.000463 16.191844 16.001196 " transform="matrix(5.328323,0,0,5.325,0.318369,0.934259)"/>
 80 | </g>
 81 | <clipPath id="clip6">
 82 |   <path d="M 0.320312 1 L 309 1 L 309 90 L 0.320312 90 Z M 0.320312 1 "/>
 83 | </clipPath>
 84 | <image id="image18" width="1289" height="373" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABQkAAAF1CAAAAABuOjOAAAAAAmJLR0QA/4ePzL8AAAPCSURBVHic7dQhAQAwDAPBbjbq39mElMxDQO9IaNBXAQAAAAAAAADAdudvv+gNgKCbPgAQp4QASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCKCEAEoIoIQASgighABKCDAxsAPbBZI8CwAAAABJRU5ErkJggg=="/>
 85 | <mask id="mask2">
 86 | <use xlink:href="#image18"/>
 87 | </mask>
 88 | <image id="image17" width="1289" height="373" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABQkAAAF1CAIAAADEM/sLAAAABmJLR0QA/wD/AP+gvaeTAAAFjUlEQVR4nO3BgQAAAADDoPlTn+AGVQEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHwDBRYAAU4z16gAAAAASUVORK5CYII="/>
 89 | <clipPath id="clip5">
 90 |   <rect x="0" y="0" width="310" height="91"/>
 91 | </clipPath>
 92 | <g id="surface24" clip-path="url(#clip5)">
 93 | <g clip-path="url(#clip6)" clip-rule="nonzero">
 94 | <use xlink:href="#image17" mask="url(#mask2)" transform="matrix(0.24,0,0,0.24,0.0800023,0.879987)"/>
 95 | </g>
 96 | </g>
 97 | <mask id="mask1">
 98 |   <g filter="url(#alpha)">
 99 | <use xlink:href="#surface24"/>
100 |   </g>
101 | </mask>
102 | <clipPath id="clip7">
103 |   <rect x="0" y="0" width="310" height="91"/>
104 | </clipPath>
105 | <g id="surface23" clip-path="url(#clip7)">
106 | <path style="fill-rule:evenodd;fill:rgb(100%,34.118652%,34.118652%);fill-opacity:1;stroke-width:1;stroke-linecap:butt;stroke-linejoin:round;stroke:rgb(0%,23.139954%,31.369019%);stroke-opacity:1;stroke-miterlimit:4;" d="M 16.191844 15.999729 C 11.21329 15.999729 6.275791 14.236232 2.055274 10.852282 L 1.311166 10.25369 L 8.925252 1.657005 C 8.96484 1.612258 9.008094 1.571912 9.055746 1.535967 C 9.103398 1.500022 9.153983 1.468478 9.2075 1.442804 C 9.26175 1.416395 9.317466 1.395855 9.375382 1.38045 C 9.432565 1.365779 9.491214 1.356242 9.551329 1.352575 C 9.610711 1.348907 9.670093 1.351108 9.729475 1.359177 C 9.788857 1.367246 9.846772 1.381184 9.903222 1.400257 C 9.959671 1.420063 10.013188 1.445004 10.065239 1.475081 C 10.116557 1.505157 10.164942 1.540368 10.209662 1.579981 C 10.254382 1.61886 10.294703 1.662874 10.330625 1.710556 C 10.366548 1.758238 10.398071 1.808854 10.424463 1.862404 C 10.450122 1.915955 10.471382 1.971706 10.486045 2.029658 C 10.50144 2.086876 10.51097 2.145562 10.514636 2.205714 C 10.518302 2.265133 10.516102 2.324552 10.508038 2.383971 C 10.499974 2.442657 10.486045 2.500609 10.466984 2.557093 C 10.44719 2.613578 10.422264 2.667862 10.392207 2.719212 C 10.362149 2.771295 10.327693 2.818977 10.288105 2.863725 L 3.953297 10.015281 C 9.272747 13.937669 15.696994 15.162728 21.72023 13.372088 L 29.090924 11.177253 L 36.46235 13.372088 C 42.481921 15.162728 48.904702 13.937669 54.226351 10.018215 L 47.810901 2.819711 C 47.771313 2.775697 47.736124 2.727281 47.706066 2.675932 C 47.676009 2.623848 47.651083 2.570298 47.631289 2.513813 C 47.611495 2.457328 47.597566 2.399376 47.589502 2.339957 C 47.581437 2.281272 47.579238 2.221853 47.582171 2.1617 C 47.585836 2.102281 47.595367 2.043596 47.610029 1.985644 C 47.625424 1.927692 47.645951 1.871941 47.67161 1.81839 C 47.698002 1.76484 47.728793 1.71349 47.764715 1.665808 C 47.801371 1.618126 47.841692 1.574846 47.885678 1.535233 C 47.930398 1.49562 47.978783 1.460409 48.030101 1.430333 C 48.082152 1.399523 48.135669 1.374582 48.192119 1.355509 C 48.248568 1.335703 48.306484 1.321765 48.365866 1.313696 C 48.425248 1.304893 48.48463 1.302692 48.544012 1.30636 C 48.603394 1.310028 48.662776 1.318831 48.719958 1.334235 C 48.777874 1.348907 48.83359 1.369447 48.88784 1.395855 C 48.941358 1.42153 48.991942 1.453073 49.039594 1.489018 C 49.087247 1.524963 49.131233 1.565309 49.170821 1.610057 L 56.87288 10.252957 L 56.125841 10.853015 C 50.189845 15.613139 42.833814 17.166836 35.943308 15.11578 L 29.090924 13.077194 L 22.239273 15.117247 C 20.266472 15.705569 18.250418 16.000463 16.191844 16.001196 " transform="matrix(5.328323,0,0,5.325,0.318369,0.934259)"/>
107 | </g>
108 | <clipPath id="clip2">
109 |   <rect x="0" y="0" width="310" height="91"/>
110 | </clipPath>
111 | <g id="surface27" clip-path="url(#clip2)">
112 | <g clip-path="url(#clip3)" clip-rule="nonzero">
113 | <use xlink:href="#surface11" mask="url(#mask0)"/>
114 | <use xlink:href="#surface23" mask="url(#mask1)"/>
115 | </g>
116 | </g>
117 | <clipPath id="clip8">
118 |   <path d="M 124 24.140625 L 256 24.140625 L 256 173 L 124 173 Z M 124 24.140625 "/>
119 | </clipPath>
120 | <clipPath id="clip9">
121 |   <path d="M 13.003906 158 L 78 158 L 78 227.558594 L 13.003906 227.558594 Z M 13.003906 158 "/>
122 | </clipPath>
123 | <clipPath id="clip11">
124 |   <path d="M 0.00390625 0.160156 L 64.039062 0.160156 L 64.039062 69.558594 L 0.00390625 69.558594 Z M 0.00390625 0.160156 "/>
125 | </clipPath>
126 | <image id="image37" width="65" height="70" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEEAAABGCAYAAACT8vn9AAAABmJLR0QA/wD/AP+gvaeTAAAAj0lEQVR4nO3QAQkAIBDAwNP+mR9jKLglGLcwPm/fHnihEISAEBACQkAICAEhIASEgBAQAkJACAgBISAEhIAQEAJCQAgIASEgBISAEBACQkAICAEhIASEgBAQAkJACAgBISAEhIAQEAJCQAgIASEgBISAEBACQkAICAEhIASEgBAQAkJACAgBISAEhIAQEAI4m6QBisSchPAAAAAASUVORK5CYII="/>
127 | <mask id="mask3">
128 |   <g filter="url(#alpha)">
129 | <use xlink:href="#image37" transform="matrix(1,0,0,1,0.000000000000001776,0)"/>
130 |   </g>
131 | </mask>
132 | <clipPath id="clip12">
133 |   <rect x="0" y="0" width="65" height="70"/>
134 | </clipPath>
135 | <g id="surface36" clip-path="url(#clip12)">
136 | <path style="fill-rule:evenodd;fill:rgb(100%,34.118652%,34.118652%);fill-opacity:1;stroke-width:1;stroke-linecap:round;stroke-linejoin:round;stroke:rgb(0%,23.139954%,31.369019%);stroke-opacity:1;stroke-miterlimit:4;" d="M 7.844063 13.988285 C 7.740695 13.987551 7.640992 13.970679 7.543488 13.936935 C 7.446717 13.902457 7.358011 13.853308 7.277369 13.788754 C 7.196727 13.724934 7.129281 13.648643 7.074297 13.561348 C 7.019314 13.474054 6.981192 13.380157 6.957733 13.279658 C 6.35365 10.624875 4.647701 7.794036 2.026098 5.092304 L 0.999743 4.038167 L 2.402917 3.592157 C 5.49811 2.607709 8.203287 2.4742 10.671671 3.187228 C 10.729586 3.203366 10.78457 3.225373 10.838087 3.253249 C 10.890871 3.280391 10.940722 3.312668 10.987641 3.35008 C 11.03456 3.386758 11.077081 3.428572 11.115203 3.474053 C 11.154057 3.519534 11.18778 3.568683 11.216372 3.620767 C 11.245696 3.673584 11.269156 3.727868 11.287483 3.785086 C 11.305078 3.841571 11.317541 3.900256 11.324139 3.959675 C 11.330737 4.019094 11.332203 4.078513 11.327071 4.137932 C 11.32194 4.197351 11.310943 4.256037 11.294815 4.313255 C 11.277953 4.370473 11.25596 4.425491 11.228835 4.479041 C 11.200976 4.531858 11.16872 4.581741 11.131331 4.628689 C 11.093942 4.674904 11.052888 4.718185 11.007435 4.75633 C 10.961249 4.795209 10.912131 4.828953 10.86008 4.857562 C 10.808029 4.886172 10.753046 4.909646 10.696596 4.927985 C 10.639414 4.946324 10.581498 4.958795 10.522116 4.965397 C 10.462734 4.971999 10.402619 4.972733 10.343237 4.967598 C 10.283855 4.962463 10.225206 4.951459 10.168024 4.935321 C 8.398295 4.424757 6.523731 4.421089 4.353724 4.935321 C 6.633698 7.545356 8.138774 10.268361 8.733326 12.876929 C 8.747989 12.943684 8.75532 13.011172 8.754587 13.079394 C 8.754587 13.147616 8.746522 13.215104 8.731127 13.281859 C 8.715732 13.348614 8.693005 13.412434 8.662948 13.47332 C 8.63289 13.53494 8.596968 13.592158 8.554447 13.645709 C 8.511927 13.699259 8.463542 13.746941 8.410025 13.789488 C 8.356508 13.832035 8.299325 13.86798 8.237744 13.898056 C 8.176162 13.927399 8.111649 13.950139 8.045669 13.964811 C 7.978956 13.980216 7.911509 13.987551 7.84333 13.988285 " transform="matrix(5.328323,0,0,5.325,0.00507506,-10.315737)"/>
137 | </g>
138 | <clipPath id="clip14">
139 |   <path d="M 0.00390625 0.160156 L 64 0.160156 L 64 69.558594 L 0.00390625 69.558594 Z M 0.00390625 0.160156 "/>
140 | </clipPath>
141 | <image id="image43" width="267" height="290" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQsAAAEiCAAAAADLnahwAAAAAmJLR0QA/4ePzL8AAAH6SURBVHic7dAxEcAgAMBAQFH9m6glhg5Z2OnwryCX+T6Dz7od8CNexIt4ES/iRbyIF/EiXsSLeBEv4kW8iBfxIl7Ei3gRL+JFvIgX8SJexIt4ES/iRbyIF/EiXsSLeBEv4kW8iBfxIl7Ei3gRL+JFvIgX8SJexIt4ES/iRbyIF/EiXsSLeBEv4kW8iBfxIl7Ei3gRL+JFvIgX8SJexIt4ES/iRbyIF/EiXsSLeBEv4kW8iBfxIl7Ei3gRL+JFvIgX8SJexIt4ES/iRbyIF/EiXsSLeBEv4kW8iBfxIl7Ei3gRL+JFvIgX8SJexIt4ES/iRbyIF/EiXsSLeBEv4kW8iBfxIl7Ei3gRL+JFvIgX8SJexIt4ES/iRbyIF/EiXsSLeBEv4kW8iBfxIl7Ei3gRL+JFvIgX8SJexIt4ES/iRbyIF/EiXsSLeBEv4kW8iBfxIl7Ei3gRL+JFvIgX8SJexIt4ES/iRbyIF/EiXsSLeBEv4kW8iBfxIl7Ei3gRL+JFvIgX8SJexIt4ES/iRbyIF/EiXsSLeBEv4kW8iBfxIl7Ei3gRL+JFvIgX8SJexIt4ES/iRbyIF/EiXsSLeBEv4kW8iBfxIl7Ei3gRL+JFvIgX8SJexIt4ES/iRbyIF/EiXsSLeBEv4kW8iBfxIl7Ei3gRL+JFvIgXnGyk0gNBGRyFLAAAAABJRU5ErkJggg=="/>
142 | <mask id="mask5">
143 | <use xlink:href="#image43"/>
144 | </mask>
145 | <image id="image42" width="267" height="290" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQsAAAEiCAIAAABhlGD7AAAABmJLR0QA/wD/AP+gvaeTAAAA+ElEQVR4nO3BMQEAAADCoPVPbQwfoAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHgZjLEAAWqThr8AAAAASUVORK5CYII="/>
146 | <clipPath id="clip13">
147 |   <rect x="0" y="0" width="65" height="70"/>
148 | </clipPath>
149 | <g id="surface49" clip-path="url(#clip13)">
150 | <g clip-path="url(#clip14)" clip-rule="nonzero">
151 | <use xlink:href="#image42" mask="url(#mask5)" transform="matrix(0.24,0,0,0.24,-0.0399964,0.15999)"/>
152 | </g>
153 | </g>
154 | <mask id="mask4">
155 |   <g filter="url(#alpha)">
156 | <use xlink:href="#surface49"/>
157 |   </g>
158 | </mask>
159 | <clipPath id="clip15">
160 |   <rect x="0" y="0" width="65" height="70"/>
161 | </clipPath>
162 | <g id="surface48" clip-path="url(#clip15)">
163 | <path style="fill-rule:evenodd;fill:rgb(100%,34.118652%,34.118652%);fill-opacity:1;stroke-width:1;stroke-linecap:round;stroke-linejoin:round;stroke:rgb(0%,23.139954%,31.369019%);stroke-opacity:1;stroke-miterlimit:4;" d="M 7.844063 13.988285 C 7.740695 13.987551 7.640992 13.970679 7.543488 13.936935 C 7.446717 13.902457 7.358011 13.853308 7.277369 13.788754 C 7.196727 13.724934 7.129281 13.648643 7.074297 13.561348 C 7.019314 13.474054 6.981192 13.380157 6.957733 13.279658 C 6.35365 10.624875 4.647701 7.794036 2.026098 5.092304 L 0.999743 4.038167 L 2.402917 3.592157 C 5.49811 2.607709 8.203287 2.4742 10.671671 3.187228 C 10.729586 3.203366 10.78457 3.225373 10.838087 3.253249 C 10.890871 3.280391 10.940722 3.312668 10.987641 3.35008 C 11.03456 3.386758 11.077081 3.428572 11.115203 3.474053 C 11.154057 3.519534 11.18778 3.568683 11.216372 3.620767 C 11.245696 3.673584 11.269156 3.727868 11.287483 3.785086 C 11.305078 3.841571 11.317541 3.900256 11.324139 3.959675 C 11.330737 4.019094 11.332203 4.078513 11.327071 4.137932 C 11.32194 4.197351 11.310943 4.256037 11.294815 4.313255 C 11.277953 4.370473 11.25596 4.425491 11.228835 4.479041 C 11.200976 4.531858 11.16872 4.581741 11.131331 4.628689 C 11.093942 4.674904 11.052888 4.718185 11.007435 4.75633 C 10.961249 4.795209 10.912131 4.828953 10.86008 4.857562 C 10.808029 4.886172 10.753046 4.909646 10.696596 4.927985 C 10.639414 4.946324 10.581498 4.958795 10.522116 4.965397 C 10.462734 4.971999 10.402619 4.972733 10.343237 4.967598 C 10.283855 4.962463 10.225206 4.951459 10.168024 4.935321 C 8.398295 4.424757 6.523731 4.421089 4.353724 4.935321 C 6.633698 7.545356 8.138774 10.268361 8.733326 12.876929 C 8.747989 12.943684 8.75532 13.011172 8.754587 13.079394 C 8.754587 13.147616 8.746522 13.215104 8.731127 13.281859 C 8.715732 13.348614 8.693005 13.412434 8.662948 13.47332 C 8.63289 13.53494 8.596968 13.592158 8.554447 13.645709 C 8.511927 13.699259 8.463542 13.746941 8.410025 13.789488 C 8.356508 13.832035 8.299325 13.86798 8.237744 13.898056 C 8.176162 13.927399 8.111649 13.950139 8.045669 13.964811 C 7.978956 13.980216 7.911509 13.987551 7.84333 13.988285 " transform="matrix(5.328323,0,0,5.325,0.00507506,-10.315737)"/>
164 | </g>
165 | <clipPath id="clip10">
166 |   <rect x="0" y="0" width="65" height="70"/>
167 | </clipPath>
168 | <g id="surface52" clip-path="url(#clip10)">
169 | <g clip-path="url(#clip11)" clip-rule="nonzero">
170 | <use xlink:href="#surface36" mask="url(#mask3)"/>
171 | <use xlink:href="#surface48" mask="url(#mask4)"/>
172 | </g>
173 | </g>
174 | <clipPath id="clip16">
175 |   <path d="M 275 132 L 361.746094 132 L 361.746094 253 L 275 253 Z M 275 132 "/>
176 | </clipPath>
177 | </defs>
178 | <g id="surface1">
179 | <g style="fill:rgb(100%,34.118652%,34.118652%);fill-opacity:1;">
180 |   <use xlink:href="#glyph0-1" x="81.629048" y="338.624978"/>
181 | </g>
182 | <g style="fill:rgb(100%,34.118652%,34.118652%);fill-opacity:1;">
183 |   <use xlink:href="#glyph0-2" x="105.650072" y="338.624978"/>
184 | </g>
185 | <g style="fill:rgb(100%,34.118652%,34.118652%);fill-opacity:1;">
186 |   <use xlink:href="#glyph0-3" x="123.903892" y="338.624978"/>
187 | </g>
188 | <g style="fill:rgb(100%,34.118652%,34.118652%);fill-opacity:1;">
189 |   <use xlink:href="#glyph0-4" x="146.749084" y="338.624978"/>
190 | </g>
191 | <g style="fill:rgb(100%,34.118652%,34.118652%);fill-opacity:1;">
192 |   <use xlink:href="#glyph0-5" x="166.01076" y="338.624978"/>
193 | </g>
194 | <g style="fill:rgb(100%,34.118652%,34.118652%);fill-opacity:1;">
195 |   <use xlink:href="#glyph0-6" x="175.445772" y="338.624978"/>
196 | </g>
197 | <g style="fill:rgb(100%,34.118652%,34.118652%);fill-opacity:1;">
198 |   <use xlink:href="#glyph0-7" x="194.315498" y="338.624978"/>
199 | </g>
200 | <g style="fill:rgb(100%,34.118652%,34.118652%);fill-opacity:1;">
201 |   <use xlink:href="#glyph0-8" x="214.66902" y="338.624978"/>
202 | </g>
203 | <g style="fill:rgb(100%,34.118652%,34.118652%);fill-opacity:1;">
204 |   <use xlink:href="#glyph0-9" x="225.307871" y="338.624978"/>
205 | </g>
206 | <g style="fill:rgb(100%,34.118652%,34.118652%);fill-opacity:1;">
207 |   <use xlink:href="#glyph0-2" x="256.803875" y="338.624978"/>
208 | </g>
209 | <g style="fill:rgb(100%,34.118652%,34.118652%);fill-opacity:1;">
210 |   <use xlink:href="#glyph0-10" x="275.057692" y="338.624978"/>
211 | </g>
212 | <g style="fill:rgb(100%,34.118652%,34.118652%);fill-opacity:1;">
213 |   <use xlink:href="#glyph0-11" x="296.16712" y="338.624978"/>
214 | </g>
215 | <g style="fill:rgb(100%,34.118652%,34.118652%);fill-opacity:1;">
216 |   <use xlink:href="#glyph1-1" x="165.790072" y="358.724976"/>
217 | </g>
218 | <g style="fill:rgb(100%,34.118652%,34.118652%);fill-opacity:1;">
219 |   <use xlink:href="#glyph1-2" x="175.327687" y="358.724976"/>
220 | </g>
221 | <g style="fill:rgb(100%,34.118652%,34.118652%);fill-opacity:1;">
222 |   <use xlink:href="#glyph1-3" x="184.465458" y="358.724976"/>
223 | </g>
224 | <g style="fill:rgb(100%,34.118652%,34.118652%);fill-opacity:1;">
225 |   <use xlink:href="#glyph1-4" x="194.932713" y="358.724976"/>
226 | </g>
227 | <g style="fill:rgb(100%,34.118652%,34.118652%);fill-opacity:1;">
228 |   <use xlink:href="#glyph1-2" x="204.750215" y="358.724976"/>
229 | </g>
230 | <g style="fill:rgb(100%,34.118652%,34.118652%);fill-opacity:1;">
231 |   <use xlink:href="#glyph1-5" x="213.887984" y="358.724976"/>
232 | </g>
233 | <g style="fill:rgb(100%,34.118652%,34.118652%);fill-opacity:1;">
234 |   <use xlink:href="#glyph1-4" x="222.62592" y="358.724976"/>
235 | </g>
236 | <g clip-path="url(#clip1)" clip-rule="nonzero">
237 | <use xlink:href="#surface27" transform="matrix(1,0,0,1,34,200)"/>
238 | </g>
239 | <path style="fill-rule:evenodd;fill:rgb(100%,34.118652%,34.118652%);fill-opacity:1;stroke-width:1;stroke-linecap:round;stroke-linejoin:round;stroke:rgb(0%,23.139954%,31.369019%);stroke-opacity:1;stroke-miterlimit:4;" d="M 33.088724 45.37517 L 18.092215 36.721267 C 17.677275 36.420504 17.282861 36.096267 16.906776 35.748556 C 16.531423 35.400844 16.178064 35.03186 15.846698 34.641601 C 15.515332 34.252077 15.208159 33.843479 14.925911 33.416543 C 14.643663 32.989606 14.387075 32.547264 14.157611 32.089518 C 13.928148 31.632505 13.727275 31.162288 13.554261 30.681067 C 13.380514 30.199113 13.236824 29.709089 13.122459 29.210263 C 13.008094 28.711437 12.923786 28.207475 12.869536 27.698379 C 12.815286 27.189283 12.791826 26.678719 12.799157 26.166689 L 12.925985 17.308854 L 18.92283 19.279218 C 18.980745 19.296823 19.036462 19.320298 19.089246 19.348907 C 19.14203 19.377516 19.191881 19.41126 19.238067 19.450139 C 19.284253 19.489018 19.326774 19.531565 19.364162 19.579247 C 19.402284 19.626195 19.435274 19.676812 19.462399 19.730362 C 19.490257 19.783913 19.512984 19.839664 19.529112 19.897616 C 19.545974 19.955568 19.556237 20.014987 19.561369 20.075139 C 19.566501 20.135292 19.565034 20.195444 19.557703 20.255597 C 19.551105 20.315016 19.537909 20.373701 19.518848 20.43092 C 19.499788 20.488872 19.475595 20.543889 19.446271 20.595973 C 19.416213 20.648789 19.381757 20.697939 19.342169 20.74342 C 19.302581 20.788901 19.258594 20.829981 19.210942 20.867393 C 19.16329 20.904071 19.111972 20.935615 19.057722 20.962757 C 19.004205 20.989165 18.947755 21.010439 18.889107 21.025843 C 18.831191 21.041248 18.771809 21.051518 18.711694 21.055186 C 18.650846 21.058854 18.590731 21.056653 18.531349 21.047851 C 18.471234 21.039781 18.413318 21.025843 18.356135 21.006037 L 14.709643 19.810321 L 14.618005 26.193097 C 14.61214 26.630304 14.631934 27.066043 14.67812 27.501049 C 14.724306 27.935322 14.795417 28.365926 14.892921 28.792129 C 14.990425 29.218332 15.112854 29.6372 15.260209 30.049465 C 15.407565 30.460997 15.578379 30.862258 15.77412 31.25325 C 15.969127 31.644242 16.186861 32.022763 16.427321 32.38808 C 16.667782 32.753397 16.928769 33.103309 17.210283 33.437083 C 17.492531 33.770856 17.793106 34.087024 18.113476 34.385586 C 18.433112 34.683415 18.768876 34.962171 19.122236 35.219653 L 33.095322 43.277899 L 47.234825 35.218186 C 47.589651 34.95997 47.927615 34.681948 48.248717 34.384119 C 48.569819 34.085557 48.872594 33.769389 49.155575 33.434882 C 49.439289 33.101108 49.701742 32.750463 49.942935 32.385146 C 50.184862 32.019095 50.403329 31.639841 50.599803 31.248115 C 50.795543 30.85639 50.967824 30.453661 51.115912 30.041396 C 51.263268 29.628397 51.38643 29.208796 51.483934 28.781126 C 51.581438 28.354189 51.653282 27.922117 51.699468 27.486378 C 51.745654 27.050638 51.765448 26.613432 51.75885 26.174758 L 51.668678 19.79785 L 47.51414 21.122674 C 47.456958 21.141014 47.399042 21.153484 47.33966 21.160086 C 47.280278 21.166689 47.220896 21.167422 47.161514 21.162287 C 47.102132 21.157152 47.043483 21.146882 46.986301 21.13001 C 46.928385 21.113872 46.873402 21.091865 46.820618 21.063989 C 46.767101 21.036847 46.717249 21.00457 46.671063 20.967158 C 46.624144 20.929746 46.581624 20.888666 46.542769 20.843185 C 46.504647 20.79697 46.470924 20.748555 46.4416 20.695738 C 46.413008 20.643654 46.389549 20.58937 46.371221 20.532152 C 46.352893 20.475667 46.34043 20.416982 46.333832 20.357563 C 46.327234 20.298877 46.326501 20.239458 46.331633 20.179306 C 46.336032 20.119887 46.347028 20.061935 46.36389 20.003983 C 46.380018 19.946765 46.402012 19.891747 46.429137 19.838197 C 46.456995 19.78538 46.489252 19.735497 46.52664 19.688549 C 46.563296 19.642334 46.605083 19.599787 46.650536 19.560908 C 46.695989 19.522029 46.745107 19.488285 46.797158 19.459676 C 46.849209 19.431066 46.904192 19.406859 46.960642 19.389253 L 53.453802 17.319857 L 53.577697 26.149817 C 53.585029 26.663314 53.561569 27.174611 53.507319 27.685175 C 53.453069 28.195005 53.368761 28.700433 53.253663 29.200727 C 53.138564 29.700287 52.994142 30.191777 52.820394 30.674465 C 52.645914 31.157153 52.443576 31.62737 52.213379 32.08585 C 51.982449 32.54433 51.725127 32.987405 51.441413 33.415076 C 51.1577 33.842012 50.84906 34.251343 50.516228 34.641601 C 50.183396 35.03186 49.827837 35.400844 49.450285 35.748556 C 49.073466 36.096267 48.67612 36.419771 48.259714 36.7198 L 48.179072 36.771883 L 33.087991 45.373703 Z M 33.088724 45.37517 " transform="matrix(5.328323,0,0,5.325,13.005075,24.138953)"/>
240 | <path style=" stroke:none;fill-rule:evenodd;fill:rgb(100%,34.118652%,34.118652%);fill-opacity:1;" d="M 189.53125 188.808594 L 122.140625 150.308594 L 189.53125 245.519531 L 255.445312 150.308594 Z M 189.53125 188.808594 "/>
241 | <g clip-path="url(#clip8)" clip-rule="nonzero">
242 | <path style=" stroke:none;fill-rule:evenodd;fill:rgb(100%,34.118652%,34.118652%);fill-opacity:1;" d="M 189.53125 24.140625 L 124.246094 132.988281 L 189.398438 172.5 L 255.449219 133.519531 Z M 189.53125 24.140625 "/>
243 | </g>
244 | <g clip-path="url(#clip9)" clip-rule="nonzero">
245 | <use xlink:href="#surface52" transform="matrix(1,0,0,1,13,158)"/>
246 | </g>
247 | <path style=" stroke:none;fill-rule:evenodd;fill:rgb(100%,34.118652%,34.118652%);fill-opacity:1;" d="M 324.339844 222.171875 C 323.976562 222.171875 323.617188 222.128906 323.261719 222.046875 C 322.90625 221.96875 322.5625 221.847656 322.234375 221.691406 C 321.90625 221.53125 321.601562 221.339844 321.316406 221.113281 C 321.03125 220.886719 320.777344 220.628906 320.550781 220.347656 C 320.320312 220.0625 320.128906 219.757812 319.96875 219.429688 C 319.8125 219.101562 319.691406 218.757812 319.609375 218.40625 C 319.53125 218.050781 319.488281 217.691406 319.488281 217.328125 C 319.488281 216.964844 319.527344 216.605469 319.609375 216.25 C 322.777344 202.355469 330.796875 187.863281 342.941406 173.964844 C 331.378906 171.226562 321.398438 171.246094 311.960938 173.964844 C 311.65625 174.050781 311.34375 174.109375 311.027344 174.136719 C 310.710938 174.164062 310.394531 174.160156 310.078125 174.125 C 309.761719 174.089844 309.453125 174.023438 309.148438 173.925781 C 308.84375 173.832031 308.554688 173.707031 308.277344 173.550781 C 307.996094 173.398438 307.738281 173.21875 307.492188 173.011719 C 307.25 172.808594 307.03125 172.582031 306.832031 172.332031 C 306.632812 172.082031 306.460938 171.816406 306.316406 171.535156 C 306.171875 171.25 306.054688 170.957031 305.96875 170.652344 C 305.878906 170.347656 305.820312 170.035156 305.792969 169.71875 C 305.765625 169.402344 305.769531 169.085938 305.804688 168.769531 C 305.839844 168.453125 305.902344 168.144531 306 167.839844 C 306.097656 167.539062 306.222656 167.246094 306.375 166.96875 C 306.527344 166.691406 306.707031 166.429688 306.910156 166.1875 C 307.117188 165.941406 307.34375 165.722656 307.59375 165.523438 C 307.839844 165.324219 308.105469 165.152344 308.386719 165.007812 C 308.671875 164.859375 308.964844 164.742188 309.269531 164.65625 C 322.429688 160.859375 336.851562 161.570312 353.335938 166.8125 L 360.8125 169.1875 L 355.351562 174.800781 C 341.375 189.183594 332.289062 204.257812 329.066406 218.398438 C 328.945312 218.933594 328.738281 219.433594 328.445312 219.898438 C 328.152344 220.363281 327.792969 220.769531 327.363281 221.109375 C 326.9375 221.453125 326.460938 221.714844 325.945312 221.898438 C 325.425781 222.078125 324.894531 222.167969 324.34375 222.171875 "/>
248 | <g clip-path="url(#clip16)" clip-rule="nonzero">
249 | <path style="fill:none;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke:rgb(0%,23.139954%,31.369019%);stroke-opacity:1;stroke-miterlimit:4;" d="M 58.430156 37.189283 C 58.361977 37.189283 58.294531 37.181214 58.227818 37.165809 C 58.161105 37.151138 58.096591 37.128397 58.03501 37.099055 C 57.973428 37.068978 57.916246 37.033033 57.862729 36.990487 C 57.809211 36.94794 57.761559 36.899524 57.719039 36.846707 C 57.675785 36.793157 57.639863 36.735938 57.609805 36.674319 C 57.580481 36.612699 57.557755 36.548145 57.542359 36.482124 C 57.527697 36.415369 57.519633 36.347881 57.519633 36.279659 C 57.519633 36.211437 57.526964 36.143949 57.542359 36.077194 C 58.136912 33.467892 59.641988 30.746355 61.921228 28.136319 C 59.751221 27.622088 57.878124 27.625756 56.106929 28.136319 C 56.049746 28.152458 55.991097 28.163461 55.931715 28.168596 C 55.872333 28.173731 55.812952 28.172998 55.75357 28.166396 C 55.694188 28.159793 55.636272 28.147323 55.579089 28.128984 C 55.521907 28.111378 55.467656 28.087904 55.415606 28.058561 C 55.362822 28.029952 55.314436 27.996208 55.26825 27.957329 C 55.222798 27.919183 55.181743 27.876636 55.144355 27.829688 C 55.106966 27.782739 55.074709 27.732857 55.047584 27.68004 C 55.020459 27.626489 54.998466 27.571472 54.982337 27.514254 C 54.965476 27.457035 54.954479 27.39835 54.949347 27.338931 C 54.944216 27.279512 54.944949 27.220093 54.951547 27.160674 C 54.958145 27.101255 54.969874 27.043303 54.988202 26.986084 C 55.00653 26.9296 55.029989 26.874582 55.058581 26.822499 C 55.087172 26.770415 55.120895 26.721266 55.159017 26.675785 C 55.197872 26.62957 55.240392 26.588491 55.287311 26.551079 C 55.333497 26.513667 55.383349 26.48139 55.436133 26.454248 C 55.48965 26.426372 55.544633 26.404365 55.601816 26.388226 C 58.071665 25.675198 60.778309 25.808708 63.872036 26.793156 L 65.275209 27.239165 L 64.250321 28.293303 C 61.627251 30.994301 59.922036 33.82514 59.31722 36.480657 C 59.294493 36.581156 59.255639 36.675052 59.200655 36.762347 C 59.145672 36.849641 59.078226 36.925933 58.997584 36.989753 C 58.917675 37.054307 58.828235 37.103456 58.731465 37.137934 C 58.633961 37.171678 58.534258 37.18855 58.430889 37.189283 " transform="matrix(5.328323,0,0,5.325,13.005075,24.138953)"/>
250 | </g>
251 | <path style="fill-rule:evenodd;fill:rgb(100%,34.118652%,34.118652%);fill-opacity:1;stroke-width:1;stroke-linecap:butt;stroke-linejoin:round;stroke:rgb(0%,23.139954%,31.369019%);stroke-opacity:1;stroke-miterlimit:4;" d="M 18.620788 17.437228 C 18.557007 17.437228 18.493227 17.430626 18.430912 17.417422 C 18.367865 17.404218 18.30775 17.384411 18.249101 17.358003 C 18.190452 17.332328 18.135469 17.300051 18.083418 17.262639 C 18.0321 17.224493 17.984448 17.181947 17.941928 17.134265 C 17.899407 17.086583 17.862019 17.035233 17.830495 16.979482 C 17.798238 16.923731 17.772579 16.865045 17.753518 16.804159 C 17.733724 16.743273 17.721261 16.680919 17.714663 16.617099 C 17.708065 16.553279 17.708799 16.489458 17.71613 16.425638 L 18.43971 9.953366 L 22.974732 13.045356 C 23.023117 13.0791 23.067103 13.117979 23.107425 13.160526 C 23.147746 13.203073 23.183668 13.250021 23.215192 13.29917 C 23.246716 13.349053 23.273108 13.40187 23.294368 13.456154 C 23.315628 13.511172 23.331023 13.567656 23.341287 13.625608 C 23.35155 13.68356 23.355949 13.742246 23.355216 13.800931 C 23.354483 13.859616 23.347885 13.918302 23.335422 13.97552 C 23.322959 14.032739 23.305364 14.089223 23.281905 14.142774 C 23.259178 14.197058 23.230587 14.248408 23.197597 14.296823 C 23.164607 14.345972 23.127219 14.39072 23.085431 14.432533 C 23.043644 14.473613 22.998191 14.510291 22.949073 14.543302 C 22.899954 14.575579 22.847903 14.603455 22.793653 14.625462 C 22.739403 14.648202 22.682954 14.665074 22.625771 14.676811 C 22.567855 14.688548 22.509939 14.694417 22.450557 14.695151 C 22.391909 14.695151 22.33326 14.690016 22.276077 14.679012 C 22.218161 14.668009 22.161712 14.65187 22.106729 14.629863 C 22.052478 14.607856 22.000428 14.580714 21.951309 14.549171 L 19.911796 13.159059 L 19.52398 16.628103 C 19.511517 16.738871 19.479994 16.844505 19.428676 16.943537 C 19.377358 17.043302 19.309912 17.129863 19.22707 17.204687 C 19.143496 17.279511 19.049658 17.336729 18.945556 17.377076 C 18.840721 17.416688 18.732954 17.436495 18.620788 17.437228 " transform="matrix(5.328323,0,0,5.325,13.005075,24.138953)"/>
252 | <path style="fill-rule:evenodd;fill:rgb(100%,34.118652%,34.118652%);fill-opacity:1;stroke-width:1;stroke-linecap:round;stroke-linejoin:round;stroke:rgb(0%,23.139954%,31.369019%);stroke-opacity:1;stroke-miterlimit:4;" d="M 47.349924 17.437228 C 47.239224 17.437228 47.13219 17.417422 47.028821 17.377809 C 46.925453 17.33893 46.832348 17.282445 46.749506 17.209822 C 46.666665 17.136465 46.599951 17.050638 46.547901 16.953073 C 46.496583 16.855509 46.463593 16.751342 46.449664 16.64204 L 46.003933 13.145121 L 43.946091 14.549171 C 43.896973 14.582915 43.844189 14.611524 43.789206 14.634264 C 43.734222 14.657739 43.677773 14.675344 43.619124 14.687815 C 43.560475 14.700286 43.501826 14.706154 43.441711 14.706888 C 43.382329 14.707621 43.322947 14.702486 43.264299 14.691483 C 43.20565 14.679746 43.148467 14.663607 43.092751 14.640867 C 43.037767 14.618859 42.984983 14.590984 42.935132 14.557973 C 42.884547 14.525696 42.838361 14.488284 42.795841 14.446471 C 42.753321 14.404658 42.715199 14.359176 42.681476 14.309294 C 42.647753 14.260145 42.619161 14.208061 42.595702 14.153044 C 42.572242 14.098026 42.554648 14.041541 42.542918 13.982856 C 42.530455 13.92417 42.523857 13.864751 42.523857 13.805332 C 42.523124 13.745913 42.528256 13.686494 42.539252 13.627809 C 42.550249 13.569123 42.56711 13.511905 42.589837 13.456154 C 42.61183 13.401136 42.639688 13.348319 42.671945 13.298437 C 42.704935 13.248554 42.742324 13.202339 42.784111 13.159792 C 42.825898 13.116512 42.871351 13.078366 42.921203 13.045356 L 47.434964 9.967304 L 48.253849 16.413167 C 48.261913 16.476988 48.263379 16.541542 48.257514 16.605362 C 48.252383 16.669916 48.23992 16.733003 48.220859 16.794623 C 48.201798 16.856976 48.176872 16.915661 48.144615 16.972146 C 48.113092 17.028631 48.076436 17.080714 48.033183 17.12913 C 47.990662 17.177545 47.94301 17.220826 47.890959 17.259705 C 47.838908 17.29785 47.783925 17.330127 47.724543 17.356536 C 47.665894 17.382944 47.605046 17.403484 47.541999 17.416688 C 47.478218 17.430626 47.414437 17.437228 47.349924 17.437228 " transform="matrix(5.328323,0,0,5.325,13.005075,24.138953)"/>
253 | </g>
254 | </svg>
255 | 


--------------------------------------------------------------------------------
/public/manifest.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "NextJS Web3 Starter",
 3 |   "short_name": "NextWeb3",
 4 |   "start_url": "/",
 5 |   "lang": "en-US",
 6 |   "display": "standalone",
 7 |   "background_color": "#000000",
 8 |   "theme_color": "#000000",
 9 |   "icons": [
10 |     {
11 |       "src": "/icons/icon-192x192.png",
12 |       "sizes": "192x192",
13 |       "type": "image/png",
14 |       "purpose": "any maskable"
15 |     },
16 |     {
17 |       "src": "/icons/icon-512x512.png",
18 |       "sizes": "512x512",
19 |       "type": "image/png",
20 |       "purpose": "any"
21 |     }
22 |   ]
23 | }
24 | 


--------------------------------------------------------------------------------
/public/robots.txt:
--------------------------------------------------------------------------------
1 | User-agent: *
2 | Disallow:
3 | 
4 | Sitemap: 
5 | 


--------------------------------------------------------------------------------
/src/components/ConnectWallet.jsx:
--------------------------------------------------------------------------------
 1 | import React, { useEffect, useState } from "react";
 2 | import Blockies from "react-blockies";
 3 | 
 4 | import { makeStyles } from '@material-ui/core/styles';
 5 | 
 6 | import { useWeb3Modal } from "../hooks/web3";
 7 | 
 8 | const truncateAddress = (address) => {
 9 |   return address.slice(0, 6) + "..." + address.slice(-4);
10 | };
11 | 
12 | const ConnectWallet = () => {
13 |   const classes = useStyles();
14 | 
15 |   const [signerAddress, setSignerAddress] = useState("");
16 |   // const [isWaiting, setWaiting] = useState(false)
17 |   // const [isSent, setSent] = useState(false)
18 |   // const [walletNotDetected, setWalletNotDetected] = useState(false)
19 | 
20 |   const { connectWallet, disconnectWallet, provider, error } = useWeb3Modal();
21 | 
22 |   useEffect(() => {
23 |     const getAddress = async () => {
24 |       const signer = provider.getSigner();
25 |       const address = await signer.getAddress();
26 |       setSignerAddress(address);
27 |     }
28 |     if (provider) getAddress();
29 |     else setSignerAddress("");
30 |   }, [provider]);
31 | 
32 |   const handleClickConnect = async () => {
33 |     await connectWallet();
34 |   };
35 | 
36 |   const handleClickAddress = () => {
37 |     disconnectWallet();
38 |   };
39 | 
40 |   return (
41 |     <button
42 |       className={classes.btn}
43 |       onClick={signerAddress ? handleClickAddress : handleClickConnect}>
44 |       <Blockies
45 |         className={classes.img}
46 |         seed={signerAddress.toLowerCase()}
47 |         size={8}
48 |         scale={3}
49 |       />
50 |       <div>
51 |         {signerAddress ? truncateAddress(signerAddress) : "Connect Wallet"}
52 |       </div>
53 |     </button>
54 |   );
55 | }
56 | 
57 | const useStyles = makeStyles((theme) => ({
58 |   btn: {
59 |     background: 'rgb(183,192,238)',
60 |     cursor: 'pointer',
61 |     border: 0,
62 |     outline: 'none',
63 |     borderRadius: 9999,
64 |     height: 35,
65 |     display: 'flex',
66 |     alignItems: 'center'
67 |   },
68 |   img: {
69 |     borderRadius: 999,
70 |     marginRight: 5
71 |   }
72 | }));
73 | 
74 | export default ConnectWallet;


--------------------------------------------------------------------------------
/src/components/Navbar.jsx:
--------------------------------------------------------------------------------
 1 | import React from 'react';
 2 | 
 3 | import AppBar from '@material-ui/core/AppBar';
 4 | import Toolbar from '@material-ui/core/Toolbar';
 5 | import Typography from '@material-ui/core/Typography';
 6 | import IconButton from '@material-ui/core/IconButton';
 7 | import {
 8 |   Brightness4Outlined as ToggleDarkModeIcon,
 9 |   Brightness5Outlined as ToggleLightModeIcon,
10 | } from "@material-ui/icons/";
11 | import { makeStyles, useTheme } from '@material-ui/core/styles';
12 | 
13 | import dynamic from "next/dynamic";
14 | const ConnectWallet = dynamic(() => import("./ConnectWallet"), {
15 |   ssr: false,
16 | });
17 | 
18 | const Navbar = ({ toggleMode, darkMode }) => {
19 |   const classes = useStyles();
20 |   const theme = useTheme();
21 | 
22 |   return (
23 |     <AppBar position="static" className={classes.root}>
24 |       <Toolbar>
25 |         <img src="/logo.svg" alt="logo" className={classes.img} />
26 | 
27 |         <Typography variant="h6" className={classes.title}>
28 |           Next.js Web3 starter
29 |         </Typography>
30 | 
31 |         <IconButton
32 |           edge="start"
33 |           color="inherit"
34 |           aria-label="mode"
35 |           onClick={toggleMode}
36 |           className={classes.toggleBtn}
37 |         >
38 |           {darkMode ? <ToggleLightModeIcon htmlColor={theme.custom.palette.iconColor} /> : <ToggleDarkModeIcon htmlColor={theme.custom.palette.iconColor} />}
39 |         </IconButton>
40 | 
41 |         <ConnectWallet />
42 |       </Toolbar>
43 |     </AppBar>
44 |   )
45 | }
46 | 
47 | const useStyles = makeStyles((theme) => ({
48 |   root: {
49 |     flexGrow: 1,
50 |     margin: 'auto',
51 |     maxWidth: 1100,
52 |     boxShadow: 'none'
53 |   },
54 |   img: {
55 |     width: 50,
56 |     marginRight: 20
57 |   },
58 |   title: {
59 |     flexGrow: 1,
60 |     // color: '#784ffe',
61 |     [theme.breakpoints.down('xs')]: {
62 |       fontSize: 0,
63 |       // display: 'none'
64 |     },
65 |   },
66 |   toggleBtn: {
67 |     marginRight: 20,
68 |     [theme.breakpoints.down('xs')]: {
69 |       marginRight: 5,
70 |     },
71 |   }
72 | }));
73 | 
74 | export default Navbar;


--------------------------------------------------------------------------------
/src/contracts/Example.js:
--------------------------------------------------------------------------------
 1 | export const abi = [
 2 | 	{
 3 | 		"inputs": [],
 4 | 		"name": "retrieve",
 5 | 		"outputs": [
 6 | 			{
 7 | 				"internalType": "uint256",
 8 | 				"name": "",
 9 | 				"type": "uint256"
10 | 			}
11 | 		],
12 | 		"stateMutability": "view",
13 | 		"type": "function"
14 | 	},
15 | 	{
16 | 		"inputs": [
17 | 			{
18 | 				"internalType": "uint256",
19 | 				"name": "num",
20 | 				"type": "uint256"
21 | 			}
22 | 		],
23 | 		"name": "store",
24 | 		"outputs": [],
25 | 		"stateMutability": "nonpayable",
26 | 		"type": "function"
27 | 	}
28 | ];
29 | 
30 | export const bytecode = {
31 | 	"generatedSources": [],
32 | 	"linkReferences": {},
33 | 	"object": "608060405234801561001057600080fd5b5060c78061001f6000396000f3fe6080604052348015600f57600080fd5b506004361060325760003560e01c80632e64cec11460375780636057361d146053575b600080fd5b603d607e565b6040518082815260200191505060405180910390f35b607c60048036036020811015606757600080fd5b81019080803590602001909291905050506087565b005b60008054905090565b806000819055505056fea26469706673582212209c3e0e66a7777942989215a6ccd2dc78a71a81a3f0a819541fddad256ac53d8664736f6c63430007040033",
34 | 	"opcodes": "PUSH1 0x80 PUSH1 0x40 MSTORE CALLVALUE DUP1 ISZERO PUSH2 0x10 JUMPI PUSH1 0x0 DUP1 REVERT JUMPDEST POP PUSH1 0xC7 DUP1 PUSH2 0x1F PUSH1 0x0 CODECOPY PUSH1 0x0 RETURN INVALID PUSH1 0x80 PUSH1 0x40 MSTORE CALLVALUE DUP1 ISZERO PUSH1 0xF JUMPI PUSH1 0x0 DUP1 REVERT JUMPDEST POP PUSH1 0x4 CALLDATASIZE LT PUSH1 0x32 JUMPI PUSH1 0x0 CALLDATALOAD PUSH1 0xE0 SHR DUP1 PUSH4 0x2E64CEC1 EQ PUSH1 0x37 JUMPI DUP1 PUSH4 0x6057361D EQ PUSH1 0x53 JUMPI JUMPDEST PUSH1 0x0 DUP1 REVERT JUMPDEST PUSH1 0x3D PUSH1 0x7E JUMP JUMPDEST PUSH1 0x40 MLOAD DUP1 DUP3 DUP2 MSTORE PUSH1 0x20 ADD SWAP2 POP POP PUSH1 0x40 MLOAD DUP1 SWAP2 SUB SWAP1 RETURN JUMPDEST PUSH1 0x7C PUSH1 0x4 DUP1 CALLDATASIZE SUB PUSH1 0x20 DUP2 LT ISZERO PUSH1 0x67 JUMPI PUSH1 0x0 DUP1 REVERT JUMPDEST DUP2 ADD SWAP1 DUP1 DUP1 CALLDATALOAD SWAP1 PUSH1 0x20 ADD SWAP1 SWAP3 SWAP2 SWAP1 POP POP POP PUSH1 0x87 JUMP JUMPDEST STOP JUMPDEST PUSH1 0x0 DUP1 SLOAD SWAP1 POP SWAP1 JUMP JUMPDEST DUP1 PUSH1 0x0 DUP2 SWAP1 SSTORE POP POP JUMP INVALID LOG2 PUSH5 0x6970667358 0x22 SLT KECCAK256 SWAP13 RETURNDATACOPY 0xE PUSH7 0xA7777942989215 0xA6 0xCC 0xD2 0xDC PUSH25 0xA71A81A3F0A819541FDDAD256AC53D8664736F6C6343000704 STOP CALLER ",
35 | 	"sourceMap": "74:206:0:-:0;;;;;;;;;;;;;;;;;;;"
36 | };
37 | 


--------------------------------------------------------------------------------
/src/hooks/web3.js:
--------------------------------------------------------------------------------
 1 | import { useState } from 'react'
 2 | import { ethers } from "ethers";
 3 | import Web3Modal from "web3modal";
 4 | import WalletConnectProvider from "@walletconnect/web3-provider";
 5 | 
 6 | const providerOptions = {
 7 |   walletconnect: {
 8 |     package: WalletConnectProvider,
 9 |     options: {
10 |       infuraId: '196440d5d02d41dfa2a8ee5bfd2e96bd',
11 |     },
12 |   },
13 | };
14 | 
15 | const web3Modal = new Web3Modal({
16 |   network: "kovan",
17 |   cacheProvider: true,
18 |   providerOptions,
19 | });
20 | 
21 | export function useWeb3Modal() {
22 |   const [provider, setProvider] = useState(undefined);
23 |   const [error, setError] = useState(null);
24 | 
25 |   // Automatically connect if the provider is cashed but has not yet
26 |   // been set (e.g. page refresh)
27 |   if (web3Modal.cachedProvider && !provider) {
28 |     connectWallet();
29 |   }
30 | 
31 |   async function connectWallet() {
32 |     try {
33 |       const externalProvider = await web3Modal.connect();
34 |       const ethersProvider = new ethers.providers.Web3Provider(externalProvider);
35 |   
36 |       setProvider(ethersProvider);
37 |     } catch(e) {
38 |       setError('NO_WALLET_CONNECTED');
39 |       console.log('NO_WALLET_CONNECTED', e);
40 |     }
41 |   }
42 | 
43 |   function disconnectWallet() {
44 |     web3Modal.clearCachedProvider();
45 |     setProvider(undefined);
46 |   }
47 | 
48 |   return { connectWallet, disconnectWallet, provider, error }
49 | }
50 | 


--------------------------------------------------------------------------------
/src/utils/theme.js:
--------------------------------------------------------------------------------
  1 | import { red, amber, grey } from "@material-ui/core/colors";
  2 | import { createMuiTheme, responsiveFontSizes } from "@material-ui/core/styles";
  3 | 
  4 | const fontFamilyRoboto = {
  5 |   fontFamily: [
  6 |     "Roboto",
  7 |     "Arial",
  8 |     "sans-serif",
  9 |     '"Apple Color Emoji"',
 10 |     '"Segoe UI Emoji"',
 11 |     '"Segoe UI Symbol"'
 12 |   ].join(",")
 13 | };
 14 | 
 15 | const fontFamilyMetropolis = {
 16 |   fontFamily: [
 17 |     "Metropolis",
 18 |     "Arial",
 19 |     "sans-serif",
 20 |     '"Apple Color Emoji"',
 21 |     '"Segoe UI Emoji"',
 22 |     '"Segoe UI Symbol"'
 23 |   ].join(","),
 24 |   letterSpacing: "0.015rem"
 25 | };
 26 | 
 27 | // A custom theme for this app
 28 | const lightMuiTheme = createMuiTheme({
 29 |   type: "light",
 30 |   palette: {
 31 |     primary: {
 32 |       main: "#FFF"
 33 |     },
 34 |     secondary: {
 35 |       main: amber[500],
 36 |       light: "#feefc3"
 37 |     },
 38 |     error: {
 39 |       main: red.A400
 40 |     },
 41 |     background: {
 42 |       default: "#FFF",
 43 |       highlight: "#F1F3F4"
 44 |     }
 45 |   },
 46 |   typography: {
 47 |     ...fontFamilyRoboto,
 48 |     overline: {
 49 |       fontWeight: 500,
 50 |       fontSize: "0.7rem"
 51 |     }
 52 |   },
 53 |   shape: {
 54 |     borderRadius: "0.5rem"
 55 |   },
 56 |   zIndex: {
 57 |     appBar: 1200,
 58 |     drawer: 1100
 59 |   },
 60 |   mixins: {
 61 |     drawer: {
 62 |       minWidth: 280
 63 |     }
 64 |   },
 65 |   overrides: {
 66 |     // MuiCssBaseline: {
 67 |     //   "@global": {
 68 |     //     "@font-face": [
 69 |     //       Fonts.MetropolisRegular,
 70 |     //       Fonts.MetropolisBold,
 71 |     //       Fonts.RobotoRegular,
 72 |     //       Fonts.RobotoMedium,
 73 |     //       Fonts.RobotoBold
 74 |     //     ]
 75 |     //   }
 76 |     // },
 77 |     MuiListItemText: {
 78 |       primary: {
 79 |         ...fontFamilyMetropolis,
 80 |         fontWeight: 500,
 81 |         fontSize: "0.87rem"
 82 |       }
 83 |     }
 84 |   },
 85 |   custom: {
 86 |     fontFamily: {
 87 |       roboto: fontFamilyRoboto,
 88 |       metropolis: fontFamilyMetropolis
 89 |     },
 90 |     palette: {
 91 |       iconColor: "#5f6368",
 92 |       itemBorderColor: "#DDDDDD",
 93 |       iconHighlight: grey[900],
 94 |       notesCheckbox: grey[700],
 95 |       profilePopColor: "#FFF",
 96 |       noteBackground: {
 97 |         default: "#0000",
 98 |         red: "#F28B82",
 99 |         orange: "#FBBC04",
100 |         yellow: "#FFF475",
101 |         green: "#CCFF90",
102 |         cyan: "#A7FFEB",
103 |         lightblue: "#CBF0F8",
104 |         darkblue: "#AECBFA",
105 |         purple: "#D7AEFB",
106 |         pink: "#FDCFE8",
107 |         brown: "#E6C9A8",
108 |         grey: "#E8EAED"
109 |       },
110 |       noteColorCheck: "#0007",
111 |       labelBackground: "#0002"
112 |     }
113 |   }
114 | });
115 | 
116 | const darkMuiTheme = createMuiTheme({
117 |   type: "dark",
118 |   palette: {
119 |     primary: {
120 |       main: "#212121"
121 |     },
122 |     secondary: {
123 |       main: amber[500],
124 |       light: "#41331C"
125 |     },
126 |     error: {
127 |       main: red.A400
128 |     },
129 |     background: {
130 |       default: "#212121",
131 |       highlight: "#535456"
132 |     },
133 |     text: {
134 |       primary: "#E8EAED",
135 |       secondary: "#FFFFFFDE"
136 |     }
137 |   },
138 |   typography: {
139 |     ...fontFamilyRoboto,
140 |     overline: {
141 |       fontWeight: 500,
142 |       fontSize: "0.7rem"
143 |     }
144 |   },
145 |   shape: {
146 |     borderRadius: "0.5rem"
147 |   },
148 |   zIndex: {
149 |     appBar: 1200,
150 |     drawer: 1100
151 |   },
152 |   mixins: {
153 |     drawer: {
154 |       minWidth: 280
155 |     }
156 |   },
157 |   overrides: {
158 |     // MuiCssBaseline: {
159 |     // "@global": {
160 |     //   "@font-face": [
161 |     //     Fonts.MetropolisRegular,
162 |     //     Fonts.MetropolisBold,
163 |     //     Fonts.RobotoRegular,
164 |     //     Fonts.RobotoMedium,
165 |     //     Fonts.RobotoBold
166 |     //   ]
167 |     // }
168 |     // },
169 |     MuiListItemText: {
170 |       primary: {
171 |         ...fontFamilyMetropolis,
172 |         fontWeight: 500,
173 |         fontSize: "0.87rem"
174 |       }
175 |     }
176 |   },
177 |   custom: {
178 |     fontFamily: {
179 |       roboto: fontFamilyRoboto,
180 |       metropolis: fontFamilyMetropolis
181 |     },
182 |     palette: {
183 |       iconColor: "#949596",
184 |       itemBorderColor: "#5F6368",
185 |       iconHighlight: "#888A8B",
186 |       notesCheckbox: "#5F6368",
187 |       profilePopColor: "#2D2E30",
188 |       noteBackground: {
189 |         default: "#0000",
190 |         red: "#5C2B29",
191 |         orange: "#614A19",
192 |         yellow: "#635D18",
193 |         green: "#345920",
194 |         cyan: "#16504B",
195 |         lightblue: "#2D555E",
196 |         darkblue: "#1E3A5F",
197 |         purple: "#42275E",
198 |         pink: "#5B2245",
199 |         brown: "#442F19",
200 |         grey: "#3C3F43"
201 |       },
202 |       noteColorCheck: "#FFF7",
203 |       labelBackground: "#0002"
204 |     }
205 |   }
206 | });
207 | 
208 | export const lightTheme = responsiveFontSizes(lightMuiTheme);
209 | export const darkTheme = responsiveFontSizes(darkMuiTheme);


--------------------------------------------------------------------------------