-
Notifications
You must be signed in to change notification settings - Fork 14
/
index.html
109 lines (103 loc) · 12.4 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
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
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
<!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="author" content="Alvaro Montoro (alvaromontoro@gmail.com)" />
<meta name="keywords" content="jeff,bezos,earnings,calculator,counter" />
<meta name="description" content="See how much Jeff Bezos gained since you loaded the page." />
<meta name="theme-color" content="#ffffff" />
<meta property="og:title" content="Bezos Earnings Calculator" />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://bezoscalculator.com/" />
<meta property="og:image" content="https://bezoscalculator.com/thumb.jpg" />
<meta property="og:description" content="See how much Jeff Bezos gained since you loaded the page." />
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:url" content="https://bezoscalculator.com/" />
<meta name="twitter:title" content="Bezos Earnings Calculator" />
<meta name="twitter:description" content="See how much Jeff Bezos gained since you loaded the page." />
<meta name="twitter:image" content="https://bezoscalculator.com/thumb.jpg" />
<meta name="monetization" content="$ilp.uphold.com/2f28xFUMdj9Z" />
<title>Jeff Bezos' Calculator</title>
<link rel="shortcut icon" href="./fav.ico" />
<link rel="canonical" href="https://bezoscalculator.com/" />
<link rel="stylesheet" href="./style.css" />
<script src="./translations.js"></script>
<script src="./script.js" defer></script>
</head>
<body>
<script>
const darkmode = localStorage.getItem("darkmode");
if (darkmode === "false") {
document.querySelector("body").className = "light-mode";
}
</script>
<!-- icons from flaticon and freepik -->
<button id="nightmode">
<span class="in-dark-mode">
<svg aria-hidden="true" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 399.079 399.079" xml:space="preserve" fill="#eee">
<path d="M371.84,100.04c-2.01-3.457-6.443-4.63-9.9-2.62l-35.36,20.44c-3.457,2.01-4.63,6.443-2.62,9.9 c2.01,3.457,6.443,4.63,9.9,2.62l35.36-20.44C372.677,107.929,373.85,103.497,371.84,100.04z" />
<path d="M369.22,289.18l-35.36-20.44c-3.457-2.01-7.89-0.837-9.9,2.62c-2.01,3.457-0.837,7.89,2.62,9.9l35.36,20.44 c3.457,2.01,7.89,0.837,9.9-2.62C373.85,295.622,372.677,291.19,369.22,289.18z" />
<path d="M200.099,342.62c-4.01-0.298-7.501,2.711-7.799,6.721c-0.027,0.359-0.027,0.719,0,1.078v40.84 c-0.298,4.01,2.711,7.501,6.721,7.799s7.501-2.711,7.799-6.721c0.027-0.359,0.027-0.719,0-1.078v-40.84 C207.117,346.41,204.108,342.918,200.099,342.62z" />
<path d="M72.5,117.86L37.14,97.42c-3.457-2.01-7.89-0.837-9.9,2.62c-2.01,3.457-0.837,7.89,2.62,9.9l35.36,20.44 c3.457,2.01,7.89,0.837,9.9-2.62C77.13,124.302,75.957,119.87,72.5,117.86z" />
<path d="M200.099,0.02c-4.01-0.298-7.501,2.711-7.799,6.721c-0.027,0.359-0.027,0.719,0,1.078v40.84 c0.022,3.989,3.251,7.218,7.24,7.24c4.021,0,7.28-3.259,7.28-7.28V7.82C207.117,3.81,204.108,0.318,200.099,0.02z" />
<path d="M130.34,65.22l-20.4-35.36c-2.01-3.457-6.443-4.63-9.9-2.62c-3.457,2.01-4.63,6.443-2.62,9.9l20.4,35.36 c2.01,3.457,6.443,4.63,9.9,2.62C131.177,73.109,132.35,68.677,130.34,65.22z" />
<path d="M200.618,134.94c-0.359-0.027-0.719-0.027-1.078,0c-35.678,0-64.6,28.922-64.6,64.6c0,4.021,3.259,7.28,7.28,7.28 c4.005-0.022,7.24-3.275,7.24-7.28c-0.022-27.636,22.364-50.058,50-50.08c0.027,0,0.053,0,0.08,0 c4.01,0.298,7.501-2.711,7.799-6.721S204.628,135.237,200.618,134.94z" />
<path d="M397.98,198.98c-0.267-3.595-3.125-6.454-6.721-6.721h-40.84c-4.01-0.298-7.501,2.711-7.799,6.721 s2.711,7.501,6.721,7.799c0.359,0.027,0.72,0.027,1.079,0h40.84C395.269,206.482,398.278,202.99,397.98,198.98z" />
<path d="M49.738,192.3c-0.359-0.027-0.719-0.027-1.078,0H7.82c-4.01,0.298-7.019,3.79-6.721,7.799 c0.267,3.595,3.125,6.454,6.721,6.721h40.84c4.01,0.298,7.501-2.711,7.799-6.721C56.757,196.089,53.748,192.597,49.738,192.3z" />
<path d="M199.569,92.7c-59.006-0.008-106.846,47.819-106.855,106.825c-0.004,28.347,11.258,55.534,31.305,75.575 c20.009,20.059,47.188,31.316,75.52,31.28c59.006,0.008,106.847-47.819,106.855-106.825S258.575,92.708,199.569,92.7z M264.819,264.94c-36.053,36.053-94.507,36.053-130.56,0c-17.343-17.343-27.072-40.874-27.04-65.4 c-0.035-24.492,9.697-47.987,27.04-65.28v0.12c36.053-36.053,94.507-36.053,130.56,0 C300.873,170.433,300.873,228.887,264.819,264.94z" />
<path d="M301.678,361.972c-0.006-0.011-0.012-0.022-0.019-0.032l-20.44-35.36c-2.01-3.457-6.443-4.63-9.9-2.62 c-3.457,2.01-4.63,6.443-2.62,9.9l20.44,35.36c2.002,3.453,6.422,4.634,9.88,2.64 C302.484,369.863,303.675,365.436,301.678,361.972z" />
<path d="M299.28,27.24c-3.457-2.01-7.89-0.837-9.9,2.62l-20.44,35.36c-2.024,3.449-0.868,7.885,2.58,9.908 c0.007,0.004,0.013,0.008,0.02,0.012h0c3.454,2.014,7.887,0.847,9.901-2.608c0.006-0.011,0.013-0.022,0.019-0.032l20.44-35.36 C303.91,33.682,302.737,29.25,299.28,27.24z" />
<path d="M127.76,323.96c-3.457-2.01-7.89-0.837-9.9,2.62l-20.44,35.36c-2.01,3.457-0.837,7.89,2.62,9.9s7.89,0.837,9.9-2.62 l20.44-35.36C132.39,330.402,131.217,325.97,127.76,323.96z" />
<path d="M75.12,271.32c-2.01-3.457-6.443-4.63-9.9-2.62l-35.36,20.44c-3.457,2.01-4.63,6.443-2.62,9.9 c2.01,3.457,6.443,4.63,9.9,2.62l35.36-20.44C75.957,279.209,77.13,274.777,75.12,271.32z" />
</svg>
<span class="a11y-hidden" id="change-light">Change to light mode</span>
</span>
<span class="in-light-mode">
<svg aria-hidden="true" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 476.14 476.14" xml:space="preserve" fill="#222">
<path d="M466.535,257.983c-6.739-2.791-14.15-0.675-18.441,5.262c-17.213,23.816-40.396,42.803-67.043,54.908 c-27.774,12.617-58.786,17.396-89.672,13.826c-76.464-8.843-138.378-70.759-147.219-147.223c-3.571-30.889,1.21-61.896,13.828-89.67 c12.105-26.646,31.092-49.828,54.907-67.041c5.937-4.292,8.052-11.703,5.262-18.441c-2.81-6.787-9.593-10.562-16.881-9.394 C143.081,9.544,90.503,40.047,53.226,86.101C15.378,132.862-3.35,191.883,0.493,252.293c3.662,57.562,28.479,112.064,69.882,153.468 s95.904,66.223,153.467,69.886c5.18,0.329,10.343,0.493,15.496,0.493c54.939-0.002,107.947-18.623,150.699-53.226 c46.055-37.276,76.559-89.855,85.893-148.051C477.098,267.577,473.323,260.792,466.535,257.983z M461.119,272.488 c-8.748,54.539-37.343,103.82-80.519,138.767c-43.829,35.475-99.156,53.036-155.806,49.422 c-53.918-3.431-104.992-26.7-143.812-65.521c-38.821-38.821-62.089-89.896-65.519-143.814 C11.86,194.698,29.412,139.366,64.886,95.538c34.946-43.175,84.227-71.77,138.766-80.518c0.1-0.016,0.177-0.022,0.238-0.022 c0.168,0,0.215,0.053,0.27,0.115c0.176,0.202,0.216,0.473,0.195,0.543c-0.01,0.021-0.077,0.109-0.246,0.232 c-25.925,18.736-46.596,43.978-59.777,72.993c-13.744,30.253-18.956,64.002-15.071,97.597 c9.632,83.308,77.088,150.767,160.396,160.4c33.598,3.888,67.346-1.326,97.6-15.069c29.017-13.183,54.259-33.854,72.996-59.778 c0.122-0.169,0.21-0.236,0.23-0.245c0.068-0.026,0.343,0.018,0.545,0.194C461.111,272.055,461.179,272.114,461.119,272.488z" />
</svg>
<span class="a11y-hidden" id="change-dark">Change to dark mode</span>
</span>
</button>
<button id="language">
<svg aria-hidden="true" height="512pt" viewBox="0 0 512 512" width="512pt" xmlns="http://www.w3.org/2000/svg">
<g fill="currentColor">
<path d="m470 180h-140.644531c.445312-4.933594.6875-9.929688.6875-14.980469 0-90.992187-74.03125-165.019531-165.023438-165.019531-28.984375 0-57.496093 7.625-82.453125 22.046875-4.78125 2.761719-6.417968 8.878906-3.65625 13.660156 2.765625 4.785157 8.882813 6.417969 13.664063 3.65625 21.917969-12.667969 46.96875-19.363281 72.445312-19.363281 79.964844 0 145.023438 65.054688 145.023438 145.019531 0 79.964844-65.058594 145.023438-145.023438 145.023438-33.472656 0-64.917969-11.089844-90.9375-32.066407-2.609375-2.101562-6.066406-2.730468-9.214843-1.765624l-26.542969 6.941406 10.398437-22.851563c1.496094-3.28125 1.105469-7.109375-1.015625-10.027343-18.125-24.894532-27.707031-54.375-27.707031-85.253907 0-25.542969 6.730469-50.65625 19.464844-72.621093 2.769531-4.78125 1.140625-10.898438-3.636719-13.667969s-10.894531-1.144531-13.667969 3.636719c-14.496094 25.007812-22.160156 53.589843-22.160156 82.652343 0 33.160157 9.714844 64.914063 28.152344 92.199219l-16.742188 36.785156c-1.601562 3.511719-1.035156 7.628906 1.449219 10.582032 2.484375 2.953124 6.445313 4.210937 10.179687 3.234374l42.527344-11.117187c28.507813 21.535156 63.621094 33.339844 99.453125 33.339844 7.800781 0 15.46875-.558594 22.980469-1.609375v87.566406c0 23.15625 18.839844 42 41.996094 42h141.433594l63.238281 51.738281c1.820312 1.492188 4.066406 2.257813 6.332031 2.257813 1.457031 0 2.917969-.316406 4.28125-.960938 3.492188-1.65625 5.71875-5.171875 5.71875-9.039062v-43.996094h19c23.160156 0 42-18.84375 42-42v-194c0-23.160156-18.839844-42-42-42zm22 236c0 12.128906-9.867188 22-22 22h-29c-5.523438 0-10 4.476562-10 10v32.894531l-49.390625-40.410156c-2.722656-2.484375-5.105469-2.484375-10.460937-2.484375h-141.152344c-12.128906 0-21.996094-9.871094-21.996094-22v-91.648438c59.152344-15.972656 105.238281-64.074218 118.296875-124.351562h143.703125c12.132812 0 22 9.867188 22 22zm0 0" />
<path d="m399.761719 348.605469c3.390625-1.597657 5.742187-5.039063 5.742187-9.039063 0-5.519531-4.476562-10-10-10h-4.09375l-32.25-73.5c-1.597656-3.636718-5.191406-5.984375-9.160156-5.984375s-7.5625 2.347657-9.15625 5.984375l-32.25 73.5h-4.09375c-5.523438 0-10 4.480469-10 10 0 4 2.351562 7.441406 5.742188 9.039063l-12.011719 27.375c-2.21875 5.058593.082031 10.957031 5.136719 13.175781 5.058593 2.21875 10.957031-.082031 13.175781-5.140625l15.117187-34.449219h56.683594l15.117188 34.449219c1.644531 3.75 5.3125 5.984375 9.164062 5.984375 1.339844 0 2.703125-.269531 4.011719-.84375 5.054687-2.21875 7.359375-8.117188 5.136719-13.175781zm-69.328125-19.039063 19.566406-44.59375 19.566406 44.59375zm0 0" />
<path d="m55.402344 65.398438c2.628906 0 5.207031-1.070313 7.070312-2.929688 1.859375-1.859375 2.929688-4.4375 2.929688-7.070312 0-2.628907-1.070313-5.207032-2.929688-7.070313-1.863281-1.859375-4.441406-2.929687-7.070312-2.929687-2.640625 0-5.210938 1.070312-7.070313 2.929687-1.859375 1.863281-2.929687 4.441406-2.929687 7.070313 0 2.632812 1.070312 5.210937 2.929687 7.070312 1.859375 1.863281 4.4375 2.929688 7.070313 2.929688zm0 0" />
<path d="m105.328125 225.878906c-4.84375 2.65625-6.617187 8.734375-3.960937 13.578125 1.820312 3.316407 5.246093 5.195313 8.777343 5.195313 1.625 0 3.273438-.398438 4.800781-1.234375 22.300782-12.230469 39.457032-31.253907 49.492188-53.6875 10.039062 22.433593 27.191406 41.457031 49.492188 53.6875 1.527343.835937 3.175781 1.234375 4.800781 1.234375 3.53125 0 6.957031-1.878906 8.777343-5.195313 2.65625-4.84375.882813-10.921875-3.960937-13.578125-26.105469-14.316406-43.675781-39.902344-48.039063-68.8125h44.398438c5.523438 0 10-4.476562 10-10 0-5.523437-4.476562-10-10-10h-45.46875v-41.671875c0-5.523437-4.476562-10-10-10s-10 4.476563-10 10v41.671875h-36.125c-5.523438 0-10 4.476563-10 10 0 5.523438 4.476562 10 10 10h35.054688c-4.363282 28.910156-21.933594 54.5-48.039063 68.8125zm0 0" />
</g>
</svg>
<span class="a11y-hidden">Change language</span>
</button>
<div id="language-popup">
<button onclick="languageClick('en')">English</button>
<button onclick="languageClick('es')">Español</button>
<button onclick="languageClick('ru')">Русский</button>
</div>
<main>
<p id="top">This is how much Jeff Bezos made...</p>
<output>
<span class="symbol currency">$</span>
<span class="number u8"></span>
<span class="number u7"></span>
<span class="number u6"></span>
<span class="symbol separator u6"></span>
<span class="number u5"></span>
<span class="number u4"></span>
<span class="number u3"></span>
<span class="symbol separator"></span>
<span class="number u2"></span>
<span class="number u1"></span>
<span class="number u0"></span>
</output>
<p id="bottom">...since you started reading this page.</p>
</main>
<footer>
<a id="link" href="https://github.com/alvaromontoro/bezos-calculator">See how this number was calculated</a>
</footer>
<script src="./localization.js"></script>
</body>
</html>