-
Notifications
You must be signed in to change notification settings - Fork 0
/
dashboard.html
91 lines (81 loc) · 4.11 KB
/
dashboard.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
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="ken's bitcoin dashboard">
<meta name="author" content="Your Name">
<title>ken's bitcoin dashboard</title>
<link href="bootstrap/cover.css" rel="stylesheet">
<style>
.data-row {
display: flex;
justify-content: space-between;
padding: 10px;
transition: background-color 0.3s, color 0.3s;
}
.data-row:hover {
background-color: #f0f0f0;
color: #000
}
#description {
height: 5em;
overflow: hidden;
}
</style>
<script>
function showDescription(text,element) {
document.getElementById('description').innerText = text;
document.getElementById('description').style.color = 'red'
}
function resetDescription() {
document.getElementById('description').style.color = 'white'
document.getElementById('description').innerText = 'Hover over any quantity to learn more.';
}
</script>
</head>
<body>
<div class="site-wrapper">
<div class="site-wrapper-inner">
<div class="cover-container">
<div class="masthead clearfix">
<div class="inner">
<h1 class>ken's bitcoin dashboard</h1>
<p id="description">Hover over any quantity to learn more.</p>
</div>
</div>
<div class="cover inner">
<br>
<h2 class="cover-heading">Bitcoin Status:</h2>
<br>
<div class="data-row tooltip" onmouseover="showDescription('The total number of blocks added to the bitcoin blockchain since Satoshi started the network in 2009. Blocks are found approximately every ten minutes.')" onmouseout="resetDescription()">Latest Block:<span>878,006</span>
</div>
<br>
<div class="data-row tooltip" onmouseover="showDescription('The current bitcoin/dollar exchange rate.')" onmouseout="resetDescription()">Exchange Rate:<span>$98,656 (1,014 sats/$)</span>
</div>
<br>
<div class="data-row tooltip" onmouseover="showDescription('The current supply and long-term supply limit of bitcoin.')" onmouseout="resetDescription()">Current / Total Supply:<span>19,806,250 / 21,000,000 (94.3%)<span>
</div>
<br>
<div class="data-row tooltip" onmouseover="showDescription('The reward paid to miners for finding a block.')" onmouseout="resetDescription()">Current Block Reward:<span>3.125 BTC<span>
</div>
<br>
<div class="data-row tooltip" onmouseover="showDescription('The annualized inflation rate based on the current block reward and bitcoin supply. This rate is trending towards zero due to the halving of the block reward, which occurs every 210,000 blocks.')" onmouseout="resetDescription()">Inflation Rate (annualized):<span>0.82928%</span>
</div>
<br>
<h2 class="cover-heading">US Dollar Status:</h2>
<br>
<div class="data-row tooltip" onmouseover="showDescription('The current estimate of M2 money supply; a measure of the total amount of dollars in existence.')" onmouseout="resetDescription()">M2 Money Supply:<span>$21,311,900,000,000 total USD</span></div>
</div>
<div class="mastfoot">
<div class="inner">
<p>Dashboard refreshed every 6 hours; data provided by my local bitcoin node, other economic metrics provided by FRED and Blockchair.
<p>Last update: 01/05/2025 06:00 PM</p>
</div>
</div>
</div>
</div>
</div>
</body>
</html>