[mo] Added mozilla observatory

3 files changed, 63 insertions, 0 deletions

diff --git a/.gitmodules b/.gitmodules
new file mode 100644
index 0000000..74bedd0
--- /dev/null
+++ b/.gitmodules
@@ -0,0 +1,3 @@
+[submodule "public/dom-to-image"]
+	path = public/dom-to-image
+	url = https://github.com/tsayen/dom-to-image.git
diff --git a/public/dom-to-image b/public/dom-to-image
new file mode 160000
+Subproject fae625bce0970b3a039671ea7f338d05ecb3d0e
diff --git a/public/mozilla-observatory.html b/public/mozilla-observatory.html
new file mode 100644
index 0000000..026116c
--- /dev/null
+++ b/public/mozilla-observatory.html
@@ -0,0 +1,60 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<title>Mozilla Observatory button</title>
+		<link rel="stylesheet" href="https://syndamia.gitlab.io/web-buttons/common-styles.css" crossorigin="anonymous">
+<style>
+* {
+font-smooth: never;
+}
+#button {
+	border: 2px outset #4582ec;
+	width: 115px;
+	background: white;
+}
+#button > * {
+	height: 35px;
+}
+#mozilla-logo {
+	padding: 5px;
+	float: left;
+	font: 11px Arial;
+	font-weight: bold;
+}
+#score {
+	color: white;
+	background-color: #2d882d;
+	float: right;
+	font: 18px Arial;
+	width: 35px;
+	text-align: center;
+	margin-bottom: 10px;
+	border-radius: 7px;
+	border: 3px solid #106610;
+}
+</style>
+	</head>
+	<body>
+		<div id="button" class="button-x39">
+			<div id="mozilla-logo">
+				Mozilla<br>Observatory
+			</div>
+			<div id="score">
+				A<sup>+</sup>
+			</div>
+		</div>
+	<script src="./dom-to-image/src/dom-to-image.js"></script>
+	<script>
+		var node = document.getElementById('button');
+		domtoimage.toPng(node)
+			.then (function (dataUrl) {
+				var img = new Image();
+				img.src = dataUrl;
+				document.body.appendChild(img);
+			})
+			.catch(function (error) {
+				console.error('oops, something went wrong!', error);
+			});
+	</script>
+	</body>
+</html>