-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
35 lines (33 loc) · 2.42 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<!doctype html>
<html>
<head>
<meta charset='UTF-8' />
<title>Transferwise Transactions Data</title>
<link href="//d1a3f4spazzrp4.cloudfront.net/uber-fonts/4.0.0/superfine.css" rel="stylesheet">
<link href="//api.tiles.mapbox.com/mapbox-gl-js/v0.42.0/mapbox-gl.css" rel="stylesheet">
<link rel="shortcut icon" type="image/x-icon" href="https://transferwise.com/assets/common/favicon-625cf4fd0384c5e3b1eab4de315a4f8d.ico">
<link rel="icon" type="image/png" sizes="32x32" href="https://transferwise.com/assets/common/favicon-32x32-047493bcf5a8c94811d99b26cb186662.png">
<link rel="icon" type="image/png" sizes="16x16" href="https://transferwise.com/assets/common/favicon-16x16-e14a2a82e7e875e4efeb0b78525e40b1.png">
<style type="text/css">
@font-face {
font-family: 'GTEestiDisplay-Medium';
src: url('/fonts/GT-Eesti-Display-Medium-2.eot');
src: url('/fonts/GT-Eesti-Display-Medium-2.eot?#iefix') format('embedded-opentype'), url('/fonts/GT-Eesti-Display-Medium-2.woff') format('woff'), url('https://try.airtable.com/static/shared/font/GT-Eesti-Display-Medium-2.ttf') format('truetype');
font-weight: normal;
}
body {margin: 0; padding: 0; overflow: hidden; background: #1e2227; }
.bottom-widget--inner, .map-control { display: none; }
#count { cursor: pointer; z-index: 42; -webkit-font-smoothing: antialiased; letter-spacing: 0.02em; padding: 20px; font-family: "GTEestiDisplay-Medium", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif; color: #9e90ff82; font-size: 20px; position: absolute; }
/* #bubbles { position: absolute; width: 30vw; height: 80vh; bottom: 0; left: 0; background: transparent; } */
.bubble-x-y-z { background: #0d0a58; opacity: .88; width: 88px; height: 6px; padding: 16px; margin-left: 40px; border-radius: 36px; border: solid 3px grey; font-family: sans-serif; color: #ddd; font-size: 12px; line-height: 7px; text-align: center; display: none; position: absolute; top: 20%; left: 40px; z-index: 9000; transition-duration: 4s; }
.animate-bubble { top: 80%; display: block; transition-duration: 4s; }
</style>
</head>
<body>
<h2 id="count" title="total value of transfers in euro" ></h2>
<!-- <div id="bubbles" >
<div class="bubble-x-y-z"></div>
</div> -->
<script src='bundle.js'></script>
</body>
</html>