mirror of
https://github.com/stronk-dev/RandomChad.git
synced 2025-07-05 10:35:08 +02:00
Passabel minting UI
This commit is contained in:
Mentor Palokaj
parent
701b7e3be6
commit
9037e9f993
@ -1,3 +1,6 @@
|
|||||||
|
import Fox from './assets/metamask-fox.svg'
|
||||||
|
// import LaunchBackground from './assets/undraw_To_the_stars_qhyy.svg'
|
||||||
|
import LaunchBackground from './assets/undraw_relaunch_day_902d-fixed.svg'
|
||||||
import './App.css'
|
import './App.css'
|
||||||
|
|
||||||
import { useState, useEffect } from 'react'
|
import { useState, useEffect } from 'react'
|
||||||
@ -67,21 +70,47 @@ function App() {
|
|||||||
// ///////////////////////////////
|
// ///////////////////////////////
|
||||||
// Rendering
|
// Rendering
|
||||||
// ///////////////////////////////
|
// ///////////////////////////////
|
||||||
log( error, loading, address )
|
|
||||||
// Initialisation interface
|
// Initialisation interface
|
||||||
if( error || loading || !address ) return <main>
|
if( error || loading || !address ) return <main>
|
||||||
{ error && <p>{ error }</p> }
|
{ error && <p>{ error }</p> }
|
||||||
{ loading && <p>{ loading }</p> }
|
{ loading && <p>{ loading }</p> }
|
||||||
{ !address && <button onClick={ metamasklogin }>Connect Metamask</button> }
|
{ !address && ( !error && !loading ) && <div className="container">
|
||||||
|
|
||||||
|
<h1>Rocketeer Minter</h1>
|
||||||
|
<p>This interface is used to mint new Rocketeer NFTs. Minting is free, except for the gas fees. After minting you can view your new Rocketeer and its attributes on Opensea.</p>
|
||||||
|
|
||||||
|
<a className="button" href="#" onClick={ metamasklogin }>
|
||||||
|
<img alt="metamask fox" src={ Fox } />
|
||||||
|
Connect wallet
|
||||||
|
</a>
|
||||||
|
|
||||||
|
</div> }
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
// Render main interface
|
// Render main interface
|
||||||
return (
|
return (
|
||||||
<main>
|
<main>
|
||||||
|
|
||||||
<p>Logged in as { address }</p>
|
<div className="container">
|
||||||
<p>Total minted: { totalSupply }</p>
|
|
||||||
{ contract && <button onClick={ mintRocketeer }>Mint new Rocketeer</button> }
|
|
||||||
|
<h1>Rocketeer Minter</h1>
|
||||||
|
<p>We are ready to mint! There are currently { totalSupply } minted Rocketeers.</p>
|
||||||
|
|
||||||
|
<label for='address'>Minting to:</label>
|
||||||
|
<input id='address' value={ address } disabled />
|
||||||
|
{ contract && <a className="button" href="#" onClick={ metamasklogin }>
|
||||||
|
<img alt="metamask fox" src={ Fox } />
|
||||||
|
Mint new Rocketeer
|
||||||
|
</a> }
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<img className="stretchBackground" src={ LaunchBackground } alt="Launching rocket" />
|
||||||
|
|
||||||
</main>
|
</main>
|
||||||
);
|
);
|
||||||
|
|||||||
61
minter/src/assets/metamask-fox.svg
Normal file
61
minter/src/assets/metamask-fox.svg
Normal file
@ -0,0 +1,61 @@
|
|||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<!-- Generator: Adobe Illustrator 22.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns:ev="http://www.w3.org/2001/xml-events"
|
||||||
|
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 318.6 318.6"
|
||||||
|
style="enable-background:new 0 0 318.6 318.6;" xml:space="preserve">
|
||||||
|
<style type="text/css">
|
||||||
|
.st0{fill:#E2761B;stroke:#E2761B;stroke-linecap:round;stroke-linejoin:round;}
|
||||||
|
.st1{fill:#E4761B;stroke:#E4761B;stroke-linecap:round;stroke-linejoin:round;}
|
||||||
|
.st2{fill:#D7C1B3;stroke:#D7C1B3;stroke-linecap:round;stroke-linejoin:round;}
|
||||||
|
.st3{fill:#233447;stroke:#233447;stroke-linecap:round;stroke-linejoin:round;}
|
||||||
|
.st4{fill:#CD6116;stroke:#CD6116;stroke-linecap:round;stroke-linejoin:round;}
|
||||||
|
.st5{fill:#E4751F;stroke:#E4751F;stroke-linecap:round;stroke-linejoin:round;}
|
||||||
|
.st6{fill:#F6851B;stroke:#F6851B;stroke-linecap:round;stroke-linejoin:round;}
|
||||||
|
.st7{fill:#C0AD9E;stroke:#C0AD9E;stroke-linecap:round;stroke-linejoin:round;}
|
||||||
|
.st8{fill:#161616;stroke:#161616;stroke-linecap:round;stroke-linejoin:round;}
|
||||||
|
.st9{fill:#763D16;stroke:#763D16;stroke-linecap:round;stroke-linejoin:round;}
|
||||||
|
</style>
|
||||||
|
<polygon class="st0" points="274.1,35.5 174.6,109.4 193,65.8 "/>
|
||||||
|
<g>
|
||||||
|
<polygon class="st1" points="44.4,35.5 143.1,110.1 125.6,65.8 "/>
|
||||||
|
<polygon class="st1" points="238.3,206.8 211.8,247.4 268.5,263 284.8,207.7 "/>
|
||||||
|
<polygon class="st1" points="33.9,207.7 50.1,263 106.8,247.4 80.3,206.8 "/>
|
||||||
|
<polygon class="st1" points="103.6,138.2 87.8,162.1 144.1,164.6 142.1,104.1 "/>
|
||||||
|
<polygon class="st1" points="214.9,138.2 175.9,103.4 174.6,164.6 230.8,162.1 "/>
|
||||||
|
<polygon class="st1" points="106.8,247.4 140.6,230.9 111.4,208.1 "/>
|
||||||
|
<polygon class="st1" points="177.9,230.9 211.8,247.4 207.1,208.1 "/>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<polygon class="st2" points="211.8,247.4 177.9,230.9 180.6,253 180.3,262.3 "/>
|
||||||
|
<polygon class="st2" points="106.8,247.4 138.3,262.3 138.1,253 140.6,230.9 "/>
|
||||||
|
</g>
|
||||||
|
<polygon class="st3" points="138.8,193.5 110.6,185.2 130.5,176.1 "/>
|
||||||
|
<polygon class="st3" points="179.7,193.5 188,176.1 208,185.2 "/>
|
||||||
|
<g>
|
||||||
|
<polygon class="st4" points="106.8,247.4 111.6,206.8 80.3,207.7 "/>
|
||||||
|
<polygon class="st4" points="207,206.8 211.8,247.4 238.3,207.7 "/>
|
||||||
|
<polygon class="st4" points="230.8,162.1 174.6,164.6 179.8,193.5 188.1,176.1 208.1,185.2 "/>
|
||||||
|
<polygon class="st4" points="110.6,185.2 130.6,176.1 138.8,193.5 144.1,164.6 87.8,162.1 "/>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<polygon class="st5" points="87.8,162.1 111.4,208.1 110.6,185.2 "/>
|
||||||
|
<polygon class="st5" points="208.1,185.2 207.1,208.1 230.8,162.1 "/>
|
||||||
|
<polygon class="st5" points="144.1,164.6 138.8,193.5 145.4,227.6 146.9,182.7 "/>
|
||||||
|
<polygon class="st5" points="174.6,164.6 171.9,182.6 173.1,227.6 179.8,193.5 "/>
|
||||||
|
</g>
|
||||||
|
<polygon class="st6" points="179.8,193.5 173.1,227.6 177.9,230.9 207.1,208.1 208.1,185.2 "/>
|
||||||
|
<polygon class="st6" points="110.6,185.2 111.4,208.1 140.6,230.9 145.4,227.6 138.8,193.5 "/>
|
||||||
|
<polygon class="st7" points="180.3,262.3 180.6,253 178.1,250.8 140.4,250.8 138.1,253 138.3,262.3 106.8,247.4 117.8,256.4
|
||||||
|
140.1,271.9 178.4,271.9 200.8,256.4 211.8,247.4 "/>
|
||||||
|
<polygon class="st8" points="177.9,230.9 173.1,227.6 145.4,227.6 140.6,230.9 138.1,253 140.4,250.8 178.1,250.8 180.6,253 "/>
|
||||||
|
<g>
|
||||||
|
<polygon class="st9" points="278.3,114.2 286.8,73.4 274.1,35.5 177.9,106.9 214.9,138.2 267.2,153.5 278.8,140 273.8,136.4
|
||||||
|
281.8,129.1 275.6,124.3 283.6,118.2 "/>
|
||||||
|
<polygon class="st9" points="31.8,73.4 40.3,114.2 34.9,118.2 42.9,124.3 36.8,129.1 44.8,136.4 39.8,140 51.3,153.5 103.6,138.2
|
||||||
|
140.6,106.9 44.4,35.5 "/>
|
||||||
|
</g>
|
||||||
|
<polygon class="st6" points="267.2,153.5 214.9,138.2 230.8,162.1 207.1,208.1 238.3,207.7 284.8,207.7 "/>
|
||||||
|
<polygon class="st6" points="103.6,138.2 51.3,153.5 33.9,207.7 80.3,207.7 111.4,208.1 87.8,162.1 "/>
|
||||||
|
<polygon class="st6" points="174.6,164.6 177.9,106.9 193.1,65.8 125.6,65.8 140.6,106.9 144.1,164.6 145.3,182.8 145.4,227.6
|
||||||
|
173.1,227.6 173.3,182.8 "/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 3.9 KiB |
1
minter/src/assets/undraw_To_the_stars_qhyy.svg
Normal file
1
minter/src/assets/undraw_To_the_stars_qhyy.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 16 KiB |
133
minter/src/assets/undraw_relaunch_day_902d-fixed.svg
Normal file
133
minter/src/assets/undraw_relaunch_day_902d-fixed.svg
Normal file
@ -0,0 +1,133 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||||
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||||
|
<svg width="100%" height="100%" viewBox="0 0 750 750" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
|
||||||
|
<g transform="matrix(1.01064,0,0,1.00261,1.06145,1.00001)">
|
||||||
|
<g id="BG" transform="matrix(-0.981428,-0.00278963,0.00280316,-0.986189,957.595,822.459)">
|
||||||
|
<path d="M977,451.82C977.172,637.872 839.464,797.573 655.41,824.77L553.3,824.77C553.14,824.91 547.48,825.18 547.48,825.18C546.53,825.05 545.57,824.91 544.62,824.77C537.35,823.7 530.147,822.423 523.01,820.94C495.065,815.155 467.877,806.18 441.98,794.19C441.71,794.07 441.45,793.94 441.18,793.82C426.749,787.122 412.763,779.503 399.31,771.01C398.97,770.8 398.64,770.59 398.31,770.38C397.74,770.02 397.18,769.67 396.62,769.3C396.44,769.19 396.26,769.08 396.08,768.96C384.053,761.213 372.477,752.786 361.41,743.72C360.87,743.29 360.33,742.84 359.79,742.4C357.62,740.6 355.47,738.78 353.34,736.94C353.32,736.93 353.31,736.91 353.29,736.9C342.406,727.467 332.066,717.424 322.32,706.82C322.29,706.78 322.25,706.75 322.22,706.71C279.41,660.144 249.027,603.526 233.89,542.11C233.77,541.67 233.67,541.24 233.56,540.8C226.526,511.663 222.981,481.794 223,451.82C223,243.61 391.79,74.82 600,74.82C808.21,74.82 977,243.61 977,451.82Z" style="fill:rgb(63,61,86);fill-rule:nonzero;"/>
|
||||||
|
</g>
|
||||||
|
<g id="BG1" serif:id="BG" transform="matrix(0.981432,0,0,0.986193,-218.859,-73.787)">
|
||||||
|
<path d="M977,451.82C977.172,637.872 839.464,797.573 655.41,824.77L553.3,824.77C553.14,824.91 547.48,825.18 547.48,825.18C546.53,825.05 545.57,824.91 544.62,824.77C537.35,823.7 530.147,822.423 523.01,820.94C495.065,815.155 467.877,806.18 441.98,794.19C441.71,794.07 441.45,793.94 441.18,793.82C426.749,787.122 412.763,779.503 399.31,771.01C398.97,770.8 398.64,770.59 398.31,770.38C397.74,770.02 397.18,769.67 396.62,769.3C396.44,769.19 396.26,769.08 396.08,768.96C384.053,761.213 372.477,752.786 361.41,743.72C360.87,743.29 360.33,742.84 359.79,742.4C357.62,740.6 355.47,738.78 353.34,736.94C353.32,736.93 353.31,736.91 353.29,736.9C342.406,727.467 332.066,717.424 322.32,706.82C322.29,706.78 322.25,706.75 322.22,706.71C279.41,660.144 249.027,603.526 233.89,542.11C233.77,541.67 233.67,541.24 233.56,540.8C226.526,511.663 222.981,481.794 223,451.82C223,243.61 391.79,74.82 600,74.82C808.21,74.82 977,243.61 977,451.82Z" style="fill:rgb(63,61,86);fill-rule:nonzero;"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-218.859,-73.787)">
|
||||||
|
<path d="M634.853,507.436L667.824,468.838L700.795,430.239L719.407,408.45C720.437,407.244 718.848,405.363 717.818,406.569L684.847,445.167L651.877,483.766L633.264,505.555C632.234,506.761 633.824,508.642 634.853,507.436L634.853,507.436Z" style="fill:url(#_Linear1);fill-rule:nonzero;"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-1.41099e-06,-1.38067e-07)">
|
||||||
|
<rect x="386.81" y="336.41" width="34.1" height="413.54" style="fill:rgb(47,46,65);"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-1.41099e-06,-1.38067e-07)">
|
||||||
|
<path d="M409.95,488.23L409.88,500.61L409.05,650.87L408.95,668.78L408.73,709.14L408.51,749.95L406.31,749.95L406.53,709.14L406.74,671.44L406.85,650.5L407.68,500.64L407.75,488.22L409.95,488.23Z" style="fill:rgb(108,99,255);fill-rule:nonzero;"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-218.859,-73.787)">
|
||||||
|
<path d="M650.031,416.73L603.827,416.73C603.156,409.492 604.825,402.202 609.121,394.854L610.427,385.927L642.33,385.927L643.835,394.741C648.305,400.697 650.037,408.217 650.031,416.73Z" style="fill:rgb(47,46,65);fill-rule:nonzero;"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-218.859,-73.787)">
|
||||||
|
<path d="M643.318,387.027L610.396,387.027C609.189,387.027 608.196,386.034 608.196,384.827C608.196,384.654 608.216,384.482 608.257,384.314L613.801,361.212C614.038,360.226 614.927,359.525 615.941,359.525L637.774,359.525C638.788,359.525 639.676,360.226 639.913,361.212L645.458,384.314C645.498,384.482 645.518,384.654 645.518,384.827C645.518,386.034 644.525,387.027 643.318,387.027Z" style="fill:rgb(47,46,65);fill-rule:nonzero;"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-218.859,-73.787)">
|
||||||
|
<path d="M626.86,347.97C620.523,347.977 615.312,353.193 615.31,359.53L615.31,371.08L638.41,371.08L638.41,359.53C638.408,353.193 633.197,347.977 626.86,347.97Z" style="fill:rgb(47,46,65);fill-rule:nonzero;"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-1.41099e-06,-1.38067e-07)">
|
||||||
|
<path d="M391.051,622.109L312.765,723.714L323.592,726.213L384.388,647.927L391.051,647.927L391.051,622.109Z" style="fill:rgb(47,46,65);fill-rule:nonzero;"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-1.41099e-06,-1.38067e-07)">
|
||||||
|
<path d="M419.831,622.109L498.117,723.714L487.29,726.213L426.494,647.927L419.831,647.927L419.831,622.109Z" style="fill:rgb(47,46,65);fill-rule:nonzero;"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-218.859,-73.787)">
|
||||||
|
<path d="M872.38,320.07L872.38,712.47C848.053,737.888 820.303,759.792 789.93,777.55L789.93,320.07L872.38,320.07Z" style="fill:rgb(47,46,65);fill-rule:nonzero;"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-1.41099e-06,-1.38067e-07)">
|
||||||
|
<rect x="634.387" y="295.224" width="54.134" height="54.134" style="fill:rgb(47,46,65);"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-1.41099e-06,-1.38067e-07)">
|
||||||
|
<rect x="601.906" y="114.5" width="12.492" height="141.581" style="fill:rgb(47,46,65);"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-218.859,-73.787)">
|
||||||
|
<path d="M796.93,320.07L789.93,320.07L789.93,777.55C792.282,776.176 794.615,774.774 796.93,773.345L796.93,320.07Z" style="fill:rgb(230,230,230);fill-rule:nonzero;"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-1.41099e-06,-1.38067e-07)">
|
||||||
|
<rect x="601.906" y="114.5" width="7" height="130.75" style="fill:rgb(230,230,230);"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-1.41099e-06,-1.38067e-07)">
|
||||||
|
<rect x="583.168" y="309.798" width="44.973" height="24.985" style="fill:rgb(108,99,255);"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-1.41099e-06,-1.38067e-07)">
|
||||||
|
<circle cx="146.933" cy="244.847" r="66.193" style="fill:rgb(230,230,230);"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-1.41099e-06,-1.38067e-07)">
|
||||||
|
<circle cx="140.423" cy="199.271" r="7.596" style="fill:rgb(203,203,203);"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-1.41099e-06,-1.38067e-07)">
|
||||||
|
<circle cx="153.444" cy="275.23" r="7.596" style="fill:rgb(203,203,203);"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-1.41099e-06,-1.38067e-07)">
|
||||||
|
<circle cx="182.742" cy="232.91" r="5.426" style="fill:rgb(203,203,203);"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-1.41099e-06,-1.38067e-07)">
|
||||||
|
<circle cx="120.89" cy="250.272" r="17.362" style="fill:rgb(203,203,203);"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-1.41099e-06,-1.38067e-07)">
|
||||||
|
<circle cx="252.015" cy="349.213" r="3.576" style="fill:rgb(108,99,255);"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-1.41099e-06,-1.38067e-07)">
|
||||||
|
<path d="M283.012,401.093L281.227,402.866L279.454,401.081L278.264,402.263L280.037,404.048L278.252,405.821L279.434,407.011L281.219,405.238L282.992,407.023L284.182,405.841L282.409,404.056L284.194,402.283L283.012,401.093Z" style="fill:rgb(230,230,230);fill-rule:nonzero;"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-1.41099e-06,-1.38067e-07)">
|
||||||
|
<path d="M297.318,297.375L295.533,299.148L293.76,297.363L292.57,298.545L294.343,300.33L292.558,302.103L293.74,303.293L295.525,301.52L297.298,303.305L298.488,302.123L296.715,300.338L298.5,298.565L297.318,297.375Z" style="fill:rgb(230,230,230);fill-rule:nonzero;"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-218.859,-73.787)">
|
||||||
|
<path d="M565.279,175.376C561.417,177.949 557.464,171.825 561.401,169.366C565.262,166.793 569.215,172.917 565.279,175.376Z" style="fill:rgb(230,230,230);fill-rule:nonzero;"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-1.41099e-06,-1.38067e-07)">
|
||||||
|
<path d="M118.557,366.728L116.1,366.189L116.638,363.731L115,363.372L114.461,365.83L112.004,365.292L111.645,366.93L114.102,367.469L113.564,369.926L115.202,370.285L115.741,367.827L118.198,368.366L118.557,366.728Z" style="fill:rgb(230,230,230);fill-rule:nonzero;"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-1.41099e-06,-1.38067e-07)">
|
||||||
|
<path d="M494.557,71.728L492.1,71.189L492.638,68.731L491,68.372L490.461,70.83L488.004,70.292L487.645,71.93L490.102,72.469L489.564,74.926L491.202,75.285L491.741,72.827L494.198,73.366L494.557,71.728Z" style="fill:rgb(230,230,230);fill-rule:nonzero;"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-1.41099e-06,-1.38067e-07)">
|
||||||
|
<path d="M686.557,230.728L684.1,230.189L684.638,227.731L683,227.372L682.461,229.83L680.004,229.292L679.645,230.93L682.102,231.469L681.564,233.926L683.202,234.285L683.741,231.827L686.198,232.366L686.557,230.728Z" style="fill:rgb(230,230,230);fill-rule:nonzero;"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-1.41099e-06,-1.38067e-07)">
|
||||||
|
<path d="M222.46,110.506L220.003,109.967L220.541,107.51L218.903,107.151L218.364,109.608L215.906,109.07L215.547,110.708L218.005,111.247L217.467,113.705L219.105,114.063L219.644,111.606L222.101,112.144L222.46,110.506Z" style="fill:rgb(230,230,230);fill-rule:nonzero;"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-1.41099e-06,-1.38067e-07)">
|
||||||
|
<circle cx="455.34" cy="188.551" r="3.576" style="fill:rgb(108,99,255);"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-1.41099e-06,-1.38067e-07)">
|
||||||
|
<path d="M428.557,242.728L426.1,242.189L426.638,239.731L425,239.372L424.461,241.83L422.004,241.292L421.645,242.93L424.102,243.469L423.564,245.926L425.202,246.285L425.741,243.827L428.198,244.366L428.557,242.728Z" style="fill:rgb(230,230,230);fill-rule:nonzero;"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-1.41099e-06,-1.38067e-07)">
|
||||||
|
<path d="M523.46,198.506L521.003,197.967L521.541,195.51L519.903,195.151L519.364,197.608L516.906,197.07L516.547,198.708L519.005,199.247L518.467,201.705L520.105,202.063L520.644,199.606L523.101,200.144L523.46,198.506Z" style="fill:rgb(230,230,230);fill-rule:nonzero;"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-218.859,-73.787)">
|
||||||
|
<path d="M580.853,293.436L613.824,254.838L646.795,216.239L665.407,194.45C666.437,193.244 664.848,191.363 663.818,192.569L630.847,231.167L597.877,269.766L579.264,291.555C578.234,292.761 579.824,294.642 580.853,293.436L580.853,293.436Z" style="fill:url(#_Linear2);fill-rule:nonzero;"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-1.41099e-06,-1.38067e-07)">
|
||||||
|
<rect x="385.494" y="646.969" width="6" height="102.023" style="fill:rgb(230,230,230);"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-218.859,-73.787)">
|
||||||
|
<path d="M628.54,347.42C623.517,348.779 620,353.367 619.99,358.57L619.99,358.67C619.244,358.893 618.669,359.495 618.48,360.25L612.94,383.36C612.9,383.526 612.88,383.697 612.88,383.868C612.88,385.023 613.796,385.989 614.95,386.05L614.91,386.32L614.76,387.32L612.5,394.32C608.21,401.66 607.84,408.53 608.51,415.77L614.49,415.77L614.49,696.28L536.45,797.58L542.19,798.9L541.28,800.08L530.45,797.58L608.49,696.28L608.49,415.77L603.5,415.32C602.83,408.08 604.21,401.66 608.5,394.32L608.76,387.32L608.91,386.32L608.95,386.05C607.796,385.989 606.88,385.023 606.88,383.868C606.88,383.697 606.9,383.526 606.94,383.36L612.48,360.25C612.669,359.495 613.244,358.893 613.99,358.67L613.99,358.57C613.992,352.233 619.203,347.017 625.54,347.01C626.554,347.013 627.563,347.151 628.54,347.42Z" style="fill:rgb(230,230,230);fill-rule:nonzero;"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-1.41099e-06,-1.38067e-07)">
|
||||||
|
<path d="M431.177,646.969L425.594,646.969L425.594,647.506L485.974,725.255L491.062,724.081L431.177,646.969Z" style="fill:rgb(230,230,230);fill-rule:nonzero;"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-218.859,-73.787)">
|
||||||
|
<path d="M737.88,783.96L737.88,802.81C711.317,813.249 683.647,820.616 655.41,824.77L532.41,824.77C529.26,824.2 526.12,823.59 523.01,822.94L523.01,783.96L737.88,783.96Z" style="fill:rgb(47,46,65);fill-rule:nonzero;"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-218.859,-73.787)">
|
||||||
|
<path d="M632.05,725.69C631.35,725.57 630.61,725.45 629.85,725.32C625.38,724.6 619.99,723.78 613.81,722.93C613.39,722.87 612.96,722.81 612.52,722.75C607.42,722.06 601.81,721.36 595.76,720.67C562.59,716.94 516.26,713.95 468.98,718.06C470.15,713.36 471.23,708.66 472.25,703.98L426.97,710.99L475.83,686.14C480.433,660.611 483.598,634.844 485.31,608.96L460.85,612.74L485.86,600.02C487.65,567.99 486.81,546.67 486.81,546.67C486.81,546.67 405,589.2 339.58,654.2C337.18,645.74 334.55,637.39 331.75,629.19L296.61,658.59L325.58,612.07C316.331,587.834 305.721,564.14 293.8,541.1L274.82,556.98L289.66,533.16C274.64,504.81 262.9,486.99 262.9,486.99C262.9,486.99 249.51,508.93 233.56,542.8C248.601,604.763 279.148,661.897 322.32,708.82C332.08,719.44 342.437,729.497 353.34,738.94C355.47,740.78 357.62,742.6 359.79,744.4C371.348,753.967 383.466,762.836 396.08,770.96C396.82,771.44 397.56,771.91 398.31,772.38C436.489,796.611 478.736,813.741 523.01,822.94C526.12,823.59 529.26,824.2 532.41,824.77C533.18,824.91 533.95,825.05 534.72,825.18L547.48,825.18C547.48,825.18 553.14,824.91 553.3,824.77C569.15,810.9 583.52,796.88 595.91,783.96C598.73,781.03 601.44,778.15 604.05,775.35L582.67,762.88L610.11,768.76C611.37,767.37 612.61,766 613.81,764.66C619.97,757.78 625.31,751.55 629.74,746.26C630.5,745.34 631.24,744.46 631.95,743.6C640.02,733.86 644.46,727.92 644.46,727.92C644.46,727.92 640,727.01 632.05,725.69Z" style="fill:rgb(47,46,65);fill-rule:nonzero;"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-218.859,-73.787)">
|
||||||
|
<path d="M608.49,415.77L602.51,415.77C601.84,408.53 603.51,401.24 607.8,393.9L608.76,387.32L608.91,386.32L614.91,386.32L614.76,387.32L613.8,393.9C609.51,401.24 607.84,408.53 608.51,415.77L614.49,415.77" style="fill:rgb(108,99,255);fill-rule:nonzero;"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-1.41099e-06,-1.38067e-07)">
|
||||||
|
<rect x="385.49" y="427.5" width="6" height="73" style="fill:rgb(108,99,255);"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.981432,0,0,0.986193,-1.41099e-06,-1.38067e-07)">
|
||||||
|
<circle cx="606.5" cy="114.5" r="11" style="fill:rgb(108,99,255);"/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
<defs>
|
||||||
|
<linearGradient id="_Linear1" x1="0" y1="0" x2="1" y2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(86.81,0,0,86.81,632.931,457.002)"><stop offset="0" style="stop-color:white;stop-opacity:0.8"/><stop offset="1" style="stop-color:white;stop-opacity:0.24"/></linearGradient>
|
||||||
|
<linearGradient id="_Linear2" x1="0" y1="0" x2="1" y2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(7535.97,0,0,7535.97,50835.9,24891.7)"><stop offset="0" style="stop-color:white;stop-opacity:0.8"/><stop offset="1" style="stop-color:white;stop-opacity:0.24"/></linearGradient>
|
||||||
|
</defs>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 16 KiB |
1
minter/src/assets/undraw_relaunch_day_902d.svg
Normal file
1
minter/src/assets/undraw_relaunch_day_902d.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 8.5 KiB |
@ -1,3 +1,6 @@
|
|||||||
|
/* // //////////////////////////////
|
||||||
|
// Globals
|
||||||
|
// ////////////////////////////// */
|
||||||
body {
|
body {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
|
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
|
||||||
@ -11,3 +14,53 @@ code {
|
|||||||
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
|
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
|
||||||
monospace;
|
monospace;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
div.container {
|
||||||
|
max-width: 400px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*Login button*/
|
||||||
|
a.button {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
border: 1px solid rgba( 0, 0, 0, .3 );
|
||||||
|
color: rgba( 0, 0, 0, .8 );
|
||||||
|
text-decoration: none;
|
||||||
|
font-size: 1.5rem;
|
||||||
|
padding: .5rem 1.1rem .5rem 1rem;
|
||||||
|
margin-top: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
a img {
|
||||||
|
height: 50px;
|
||||||
|
width: 50px;
|
||||||
|
padding-right: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
input#address {
|
||||||
|
padding: .2rem .5rem;
|
||||||
|
margin-top: 1rem;
|
||||||
|
text-align: center;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stretchBackground {
|
||||||
|
position: absolute;
|
||||||
|
opacity: 1;
|
||||||
|
z-index: -1;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1, p, label, .button {
|
||||||
|
background: rgba( 255, 255, 255, .8 );
|
||||||
|
}
|
||||||
|
|
||||||
|
h1, p, label {
|
||||||
|
padding: .2rem .5rem;
|
||||||
|
}
|
||||||
@ -1 +0,0 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 841.9 595.3"><g fill="#61DAFB"><path d="M666.3 296.5c0-32.5-40.7-63.3-103.1-82.4 14.4-63.6 8-114.2-20.2-130.4-6.5-3.8-14.1-5.6-22.4-5.6v22.3c4.6 0 8.3.9 11.4 2.6 13.6 7.8 19.5 37.5 14.9 75.7-1.1 9.4-2.9 19.3-5.1 29.4-19.6-4.8-41-8.5-63.5-10.9-13.5-18.5-27.5-35.3-41.6-50 32.6-30.3 63.2-46.9 84-46.9V78c-27.5 0-63.5 19.6-99.9 53.6-36.4-33.8-72.4-53.2-99.9-53.2v22.3c20.7 0 51.4 16.5 84 46.6-14 14.7-28 31.4-41.3 49.9-22.6 2.4-44 6.1-63.6 11-2.3-10-4-19.7-5.2-29-4.7-38.2 1.1-67.9 14.6-75.8 3-1.8 6.9-2.6 11.5-2.6V78.5c-8.4 0-16 1.8-22.6 5.6-28.1 16.2-34.4 66.7-19.9 130.1-62.2 19.2-102.7 49.9-102.7 82.3 0 32.5 40.7 63.3 103.1 82.4-14.4 63.6-8 114.2 20.2 130.4 6.5 3.8 14.1 5.6 22.5 5.6 27.5 0 63.5-19.6 99.9-53.6 36.4 33.8 72.4 53.2 99.9 53.2 8.4 0 16-1.8 22.6-5.6 28.1-16.2 34.4-66.7 19.9-130.1 62-19.1 102.5-49.9 102.5-82.3zm-130.2-66.7c-3.7 12.9-8.3 26.2-13.5 39.5-4.1-8-8.4-16-13.1-24-4.6-8-9.5-15.8-14.4-23.4 14.2 2.1 27.9 4.7 41 7.9zm-45.8 106.5c-7.8 13.5-15.8 26.3-24.1 38.2-14.9 1.3-30 2-45.2 2-15.1 0-30.2-.7-45-1.9-8.3-11.9-16.4-24.6-24.2-38-7.6-13.1-14.5-26.4-20.8-39.8 6.2-13.4 13.2-26.8 20.7-39.9 7.8-13.5 15.8-26.3 24.1-38.2 14.9-1.3 30-2 45.2-2 15.1 0 30.2.7 45 1.9 8.3 11.9 16.4 24.6 24.2 38 7.6 13.1 14.5 26.4 20.8 39.8-6.3 13.4-13.2 26.8-20.7 39.9zm32.3-13c5.4 13.4 10 26.8 13.8 39.8-13.1 3.2-26.9 5.9-41.2 8 4.9-7.7 9.8-15.6 14.4-23.7 4.6-8 8.9-16.1 13-24.1zM421.2 430c-9.3-9.6-18.6-20.3-27.8-32 9 .4 18.2.7 27.5.7 9.4 0 18.7-.2 27.8-.7-9 11.7-18.3 22.4-27.5 32zm-74.4-58.9c-14.2-2.1-27.9-4.7-41-7.9 3.7-12.9 8.3-26.2 13.5-39.5 4.1 8 8.4 16 13.1 24 4.7 8 9.5 15.8 14.4 23.4zM420.7 163c9.3 9.6 18.6 20.3 27.8 32-9-.4-18.2-.7-27.5-.7-9.4 0-18.7.2-27.8.7 9-11.7 18.3-22.4 27.5-32zm-74 58.9c-4.9 7.7-9.8 15.6-14.4 23.7-4.6 8-8.9 16-13 24-5.4-13.4-10-26.8-13.8-39.8 13.1-3.1 26.9-5.8 41.2-7.9zm-90.5 125.2c-35.4-15.1-58.3-34.9-58.3-50.6 0-15.7 22.9-35.6 58.3-50.6 8.6-3.7 18-7 27.7-10.1 5.7 19.6 13.2 40 22.5 60.9-9.2 20.8-16.6 41.1-22.2 60.6-9.9-3.1-19.3-6.5-28-10.2zM310 490c-13.6-7.8-19.5-37.5-14.9-75.7 1.1-9.4 2.9-19.3 5.1-29.4 19.6 4.8 41 8.5 63.5 10.9 13.5 18.5 27.5 35.3 41.6 50-32.6 30.3-63.2 46.9-84 46.9-4.5-.1-8.3-1-11.3-2.7zm237.2-76.2c4.7 38.2-1.1 67.9-14.6 75.8-3 1.8-6.9 2.6-11.5 2.6-20.7 0-51.4-16.5-84-46.6 14-14.7 28-31.4 41.3-49.9 22.6-2.4 44-6.1 63.6-11 2.3 10.1 4.1 19.8 5.2 29.1zm38.5-66.7c-8.6 3.7-18 7-27.7 10.1-5.7-19.6-13.2-40-22.5-60.9 9.2-20.8 16.6-41.1 22.2-60.6 9.9 3.1 19.3 6.5 28.1 10.2 35.4 15.1 58.3 34.9 58.3 50.6-.1 15.7-23 35.6-58.4 50.6zM320.8 78.4z"/><circle cx="420.9" cy="296.5" r="45.7"/><path d="M520.5 78.1z"/></g></svg>
|
|
||||||
|
Before Width: | Height: | Size: 2.6 KiB |
@ -5,3 +5,21 @@ export const dev = process.env.NODE_ENV === 'development' || ( typeof location !
|
|||||||
export const log = ( ...messages ) => {
|
export const log = ( ...messages ) => {
|
||||||
if( dev ) console.log( ...messages )
|
if( dev ) console.log( ...messages )
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export function setListenerAndReturnUnlistener( parent, event, callback ) {
|
||||||
|
|
||||||
|
log( `${ event } listener requested on `, parent )
|
||||||
|
|
||||||
|
if( !parent ) return
|
||||||
|
|
||||||
|
// Set listener
|
||||||
|
parent.on( event, callback )
|
||||||
|
log( `Created ${ event } listener on `, parent )
|
||||||
|
|
||||||
|
// Return unsubscriber
|
||||||
|
return () => {
|
||||||
|
log( `Unregistering ${ event } on `, parent, ' with ', callback )
|
||||||
|
parent.removeListener( event, callback )
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
@ -1,5 +1,5 @@
|
|||||||
import { useState, useEffect } from "react"
|
import { useState, useEffect } from "react"
|
||||||
import { log } from './helpers'
|
import { log, setListenerAndReturnUnlistener } from './helpers'
|
||||||
|
|
||||||
// Ethers and web3 sdk
|
// Ethers and web3 sdk
|
||||||
import { ethers } from "ethers"
|
import { ethers } from "ethers"
|
||||||
@ -38,21 +38,11 @@ export function useAddress() {
|
|||||||
}, [] )
|
}, [] )
|
||||||
|
|
||||||
// Create listener to accounts change
|
// Create listener to accounts change
|
||||||
useEffect( f => {
|
useEffect( f => setListenerAndReturnUnlistener( ethereum, 'accountsChanged', addresses => {
|
||||||
|
|
||||||
if( !ethereum ) return
|
|
||||||
|
|
||||||
log( 'Starting account listener with ', ethereum )
|
|
||||||
|
|
||||||
const listener = ethereum.on( 'accountsChanged', addresses => {
|
|
||||||
log( 'Addresses changed to ', addresses )
|
log( 'Addresses changed to ', addresses )
|
||||||
setAddress( addresses[0] )
|
setAddress( addresses[0] )
|
||||||
} )
|
} ), [] )
|
||||||
|
|
||||||
return () => ethereum.removeListener( 'accountsChanged', listener )
|
|
||||||
|
|
||||||
|
|
||||||
}, [] )
|
|
||||||
|
|
||||||
return address
|
return address
|
||||||
|
|
||||||
@ -87,7 +77,7 @@ export function useTotalSupply() {
|
|||||||
} )( )
|
} )( )
|
||||||
|
|
||||||
// Listen to token transfers andor mints
|
// Listen to token transfers andor mints
|
||||||
const listener = contract.on( 'Transfer', async ( from, to, amount, event ) => {
|
return setListenerAndReturnUnlistener( contract, 'Transfer', async ( from, to, amount, event ) => {
|
||||||
|
|
||||||
try {
|
try {
|
||||||
|
|
||||||
@ -102,8 +92,6 @@ export function useTotalSupply() {
|
|||||||
|
|
||||||
} )
|
} )
|
||||||
|
|
||||||
return () => contract.removeListener( 'Transfer', listener )
|
|
||||||
|
|
||||||
|
|
||||||
}, [ contract ] )
|
}, [ contract ] )
|
||||||
|
|
||||||
@ -117,18 +105,10 @@ export function useChainId() {
|
|||||||
const [ chain, setChain ] = useState( undefined )
|
const [ chain, setChain ] = useState( undefined )
|
||||||
|
|
||||||
// Create listener to chain change
|
// Create listener to chain change
|
||||||
useEffect( f => {
|
useEffect( f => setListenerAndReturnUnlistener( ethereum, 'chainChanged', chainId => {
|
||||||
|
|
||||||
if( !ethereum ) return
|
|
||||||
|
|
||||||
const listener = ethereum.on('chainChanged', chainId => {
|
|
||||||
log( 'Chain changed to ', chainId )
|
log( 'Chain changed to ', chainId )
|
||||||
setChain( chainId )
|
setChain( chainId )
|
||||||
} )
|
} ), [] )
|
||||||
|
|
||||||
return ( ) => ethereum.removeListener( 'chainChanged', listener )
|
|
||||||
|
|
||||||
}, [] )
|
|
||||||
|
|
||||||
// Initial chain detection
|
// Initial chain detection
|
||||||
useEffect( f => {
|
useEffect( f => {
|
||||||
@ -216,6 +196,7 @@ export function useContract() {
|
|||||||
|
|
||||||
const chainId = useChainId()
|
const chainId = useChainId()
|
||||||
const [ contract, setContract ] = useState( undefined )
|
const [ contract, setContract ] = useState( undefined )
|
||||||
|
const address = useAddress()
|
||||||
|
|
||||||
useEffect( f => {
|
useEffect( f => {
|
||||||
|
|
||||||
@ -238,7 +219,7 @@ export function useContract() {
|
|||||||
setContract( undefined )
|
setContract( undefined )
|
||||||
}
|
}
|
||||||
|
|
||||||
}, [ chainId ] )
|
}, [ chainId, address ] )
|
||||||
|
|
||||||
return contract
|
return contract
|
||||||
|
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user