diff options
3 files changed, 63 insertions, 0 deletions
| -rw-r--r-- | .gitmodules | 3 | ||||
| m--------- | public/dom-to-image | 0 | ||||
| -rw-r--r-- | public/mozilla-observatory.html | 60 |
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> |