Skip to content
This repository was archived by the owner on Sep 27, 2023. It is now read-only.

Commit 9812013

Browse files
chadohchadoh
committed
Add link to source code
1 parent 090e90a commit 9812013

File tree

2 files changed

+135
-131
lines changed

2 files changed

+135
-131
lines changed

‎src/index.html

+134-130
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,66 @@
1515
<link rel="stylesheet" href="css/global.css">
1616
</head>
1717
<body>
18+
<nav style="display: flex; align-items: stretch; position: absolute; right: 0.5em; top: 0.5em; z-index: 2">
19+
<div data-behavior="signed-in" id="transfers" class="dropdown" aria-live="polite" style="display: none">
20+
<button aria-controls="transfers">
21+
<div data-behavior="transfers-none">
22+
<picture>
23+
<source srcset="img/bell-white.svg" media="(prefers-color-scheme: dark)">
24+
<img style="width: 1em; vertical-align: middle" alt="no transfers" src="img/bell-black.svg">
25+
</picture>
26+
</div>
27+
<div data-behavior="transfers-in-progress" style="display: none">
28+
<picture>
29+
<source srcset="img/rainbow-black.gif" media="(prefers-color-scheme: dark)">
30+
<img style="width: 4em; vertical-align: middle" alt="view transfers" src="img/rainbow-white.gif">
31+
</picture>
32+
</div>
33+
<div data-behavior="transfers-all-complete" style="display: none">
34+
<picture>
35+
<source srcset="img/bell-white.svg" media="(prefers-color-scheme: dark)">
36+
<img style="width: 1em; vertical-align: middle" alt="no transfers" src="img/bell-black.svg">
37+
</picture>
38+
<div class="notification-indicator">
39+
<span data-behavior="notification-count">#</span>
40+
<span class="visually-hidden">notifications</span>
41+
</div>
42+
</div>
43+
</button>
44+
<div class="right">
45+
<div data-behavior="transfers-none">
46+
<div style="
47+
display: flex;
48+
flex-direction: column;
49+
height: 3em;
50+
justify-content: space-around;
51+
text-align: center;
52+
width: 10em;
53+
">
54+
No transfers
55+
</div>
56+
</div>
57+
<div data-behavior="transfers-container"></div>
58+
</div>
59+
</div>
60+
<div id="menu" class="dropdown" aria-live="polite" style="font-size: 0.8em">
61+
<button class="menu-icon" aria-controls="menu">
62+
<div></div>
63+
<span class="visually-hidden">menu</span>
64+
</button>
65+
<div class="right" style="width: 7em">
66+
<div>
67+
<a href="https://github.com/near-examples/erc20-to-nep21">View source</a>
68+
</div>
69+
<div data-behavior="signed-in" style="display: none; margin-top: 0.5em">
70+
<button class="link" data-behavior="logout">
71+
Sign out
72+
</button>
73+
</div>
74+
</div>
75+
</div>
76+
</nav>
77+
1878
<div data-behavior="signed-out">
1979
<h1 class="title">Eth→NEAR Fungible Tokens</h1>
2080
<div style="margin: 0 auto; max-width: 25em">
@@ -36,140 +96,84 @@ <h1 class="title">Eth→NEAR Fungible Tokens</h1>
3696
</div>
3797
</div>
3898

39-
<div data-behavior="signed-in" style="display: none; height: 100%; flex-direction: column; justify-content: space-between">
40-
<nav style="display: flex; align-items: stretch; position: absolute; right: 0.5em; top: 0.5em; z-index: 2">
41-
<div id="transfers" class="dropdown" aria-live="polite">
42-
<button aria-controls="transfers">
43-
<div data-behavior="transfers-none">
44-
<picture>
45-
<source srcset="img/bell-white.svg" media="(prefers-color-scheme: dark)">
46-
<img style="width: 1em; vertical-align: middle" alt="no transfers" src="img/bell-black.svg">
47-
</picture>
48-
</div>
49-
<div data-behavior="transfers-in-progress" style="display: none">
50-
<picture>
51-
<source srcset="img/rainbow-black.gif" media="(prefers-color-scheme: dark)">
52-
<img style="width: 4em; vertical-align: middle" alt="view transfers" src="img/rainbow-white.gif">
53-
</picture>
54-
</div>
55-
<div data-behavior="transfers-all-complete" style="display: none">
56-
<picture>
57-
<source srcset="img/bell-white.svg" media="(prefers-color-scheme: dark)">
58-
<img style="width: 1em; vertical-align: middle" alt="no transfers" src="img/bell-black.svg">
59-
</picture>
60-
<div class="notification-indicator">
61-
<span data-behavior="notification-count">#</span>
62-
<span class="visually-hidden">notifications</span>
63-
</div>
64-
</div>
65-
</button>
66-
<div class="right">
67-
<div data-behavior="transfers-none">
68-
<div style="
69-
display: flex;
70-
flex-direction: column;
71-
height: 3em;
72-
justify-content: space-around;
73-
text-align: center;
74-
width: 10em;
75-
">
76-
No transfers
77-
</div>
78-
</div>
79-
<div data-behavior="transfers-container"></div>
80-
</div>
99+
<main data-behavior="signed-in" style="display: none">
100+
<section class="balance">
101+
<header>
102+
<img alt="ethereum" src="img/eth-diamond-purple.png">
103+
Ethereum
104+
</header>
105+
<div>
106+
<span id="erc20name" class="dropdown" aria-live="polite">
107+
<button aria-controls="erc20name" data-behavior="ethErc20Name">🤔</button>
108+
<small class="left" style="width:27em; text-align:left">
109+
Contract <code data-behavior="ethErc20Address">🤔</code>
110+
</small>
111+
</span>
112+
balance
81113
</div>
82-
<div id="menu" class="dropdown" aria-live="polite" style="font-size: 0.8em">
83-
<button class="menu-icon" aria-controls="menu">
84-
<div></div>
85-
<span class="visually-hidden">menu</span>
86-
</button>
87-
<div class="right" style="width: 6em; text-align: center">
88-
<button class="link" data-behavior="logout">
89-
Sign out
114+
<strong class="jumbo" data-behavior="erc20Balance">🤔</strong>
115+
<footer>
116+
<img alt="account" src="img/account.svg">
117+
<code data-behavior="ethUser" class="clip">🤔</code>
118+
</footer>
119+
</section>
120+
<div data-behavior="balanceZero" style="grid-column: span 2; margin: 1em 0 0 1em">
121+
<p>
122+
Uh oh! You have no <span data-behavior="ethErc20Name">🤔</span>
123+
tokens. If you want to send some to yourself on NEAR, you'll need to
124+
get some on Ethereum first 😄
125+
</p>
126+
<p data-behavior="abound-token" style="display: none">
127+
You can <a href="https://chadoh.com/abundance-token" target="_blank">mint yourself more <span data-behavior="ethErc20Name">🤔</span></a>!
128+
</p>
129+
<p data-behavior="not-abound-token">
130+
Maybe you need to use a different account?
131+
</p>
132+
</div>
133+
<form data-behavior="balancePositive" style="display: none; margin: 3em 1em">
134+
<fieldset id="fieldset">
135+
<label
136+
for="amount"
137+
style="display: block; margin: -1em 0 0.1em"
138+
>
139+
Send
140+
</label>
141+
<div style="display: flex">
142+
<input
143+
autocomplete="off"
144+
id="amount"
145+
type="number"
146+
/>
147+
<button id="submit" aria-controls="transfers" disabled style="border-radius: 0 5px 5px 0">
148+
<span class="visually-hidden">Confirm</span>
90149
</button>
91150
</div>
151+
</fieldset>
152+
</form>
153+
<section class="balance" data-behavior="balancePositive" style="display: none">
154+
<header>
155+
<picture>
156+
<source srcset="img/near-icon-white.svg" media="(prefers-color-scheme: dark)">
157+
<img alt="near" src="img/near-icon-black.svg">
158+
</picture>
159+
NEAR
160+
</header>
161+
<div>
162+
<span id="nep21name" class="dropdown" aria-live="polite">
163+
<button aria-controls="nep21name" data-behavior="nearNep21Name">🤔</button>
164+
<small class="right" style="width:14em">
165+
Contract <code data-behavior="nearFunTokenAccount">🤔</code>
166+
</small>
167+
</span>
168+
balance
92169
</div>
93-
</nav>
94-
<main>
95-
<section class="balance">
96-
<header>
97-
<img alt="ethereum" src="img/eth-diamond-purple.png">
98-
Ethereum
99-
</header>
100-
<div>
101-
<span id="erc20name" class="dropdown" aria-live="polite">
102-
<button aria-controls="erc20name" data-behavior="ethErc20Name">🤔</button>
103-
<small class="left" style="width:27em; text-align:left">
104-
Contract <code data-behavior="ethErc20Address">🤔</code>
105-
</small>
106-
</span>
107-
balance
108-
</div>
109-
<strong class="jumbo" data-behavior="erc20Balance">🤔</strong>
110-
<footer>
111-
<img alt="account" src="img/account.svg">
112-
<code data-behavior="ethUser" class="clip">🤔</code>
113-
</footer>
114-
</section>
115-
<div data-behavior="balanceZero" style="grid-column: span 2; margin: 1em 0 0 1em">
116-
<p>
117-
Uh oh! You have no <span data-behavior="ethErc20Name">🤔</span>
118-
tokens. If you want to send some to yourself on NEAR, you'll need to
119-
get some on Ethereum first 😄
120-
</p>
121-
<p data-behavior="abound-token" style="display: none">
122-
You can <a href="https://chadoh.com/abundance-token" target="_blank">mint yourself more <span data-behavior="ethErc20Name">🤔</span></a>!
123-
</p>
124-
<p data-behavior="not-abound-token">
125-
Maybe you need to use a different account?
126-
</p>
127-
</div>
128-
<form data-behavior="balancePositive" style="display: none; margin: 3em 1em">
129-
<fieldset id="fieldset">
130-
<label
131-
for="amount"
132-
style="display: block; margin: -1em 0 0.1em"
133-
>
134-
Send
135-
</label>
136-
<div style="display: flex">
137-
<input
138-
autocomplete="off"
139-
id="amount"
140-
type="number"
141-
/>
142-
<button id="submit" aria-controls="transfers" disabled style="border-radius: 0 5px 5px 0">
143-
<span class="visually-hidden">Confirm</span>
144-
</button>
145-
</div>
146-
</fieldset>
147-
</form>
148-
<section class="balance" data-behavior="balancePositive" style="display: none">
149-
<header>
150-
<picture>
151-
<source srcset="img/near-icon-white.svg" media="(prefers-color-scheme: dark)">
152-
<img alt="near" src="img/near-icon-black.svg">
153-
</picture>
154-
NEAR
155-
</header>
156-
<div>
157-
<span id="nep21name" class="dropdown" aria-live="polite">
158-
<button aria-controls="nep21name" data-behavior="nearNep21Name">🤔</button>
159-
<small class="right" style="width:14em">
160-
Contract <code data-behavior="nearFunTokenAccount">🤔</code>
161-
</small>
162-
</span>
163-
balance
164-
</div>
165-
<strong class="jumbo" data-behavior="nep21Balance">🤔</strong>
166-
<footer>
167-
<img alt="account" src="img/account.svg">
168-
<code data-behavior="nearUser" class="clip">🤔</code>
169-
</footer>
170-
</section>
171-
</main>
172-
</div>
170+
<strong class="jumbo" data-behavior="nep21Balance">🤔</strong>
171+
<footer>
172+
<img alt="account" src="img/account.svg">
173+
<code data-behavior="nearUser" class="clip">🤔</code>
174+
</footer>
175+
</section>
176+
</main>
173177

174178
<script src="./js/index.js"></script>
175179
</body>

‎src/js/render.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -114,5 +114,5 @@ export default async function render () {
114114
fill('nep21Balance').with(formatLargeNum(nep21Balance))
115115

116116
hide('signed-out')
117-
show('signed-in', 'flex')
117+
show('signed-in')
118118
}

0 commit comments

Comments
 (0)