utilize »EMOJIone« for website

No matter if a emoji is given by the UTF-8 character or the shortname
via `:shortname:` EMOJIone's JavaScript method `toImage` [1]
> convert native unicode emoji and shortnames directly to images
so each looks similar to GitHub's markdown rendered version.

[1] https://demos.emojione.com/3.1/jstoimage.html
This commit is contained in:
Andreas Gebhardt 2017-09-12 18:26:51 +02:00
parent 9a3ed2ad20
commit 3dbd8e21d5
2 changed files with 5 additions and 1 deletions

View File

@ -14,7 +14,9 @@
<link href="https://fonts.googleapis.com/css?family=Open+Sans:400,700" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="/awesome-docker/style.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/emojione@3.1.2/extras/css/emojione.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/showdown/1.7.2/showdown.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/emojione@3.1.2/lib/js/emojione.min.js"></script>
</head>
<body>
@ -40,7 +42,7 @@
.then(res => res.text())
.catch(err => console.error(err))
.then(text => {
md.innerHTML = converter.makeHtml(text);
md.innerHTML = emojione.toImage(converter.makeHtml(text));
});
</script>
<!--Place this tag in your head or just before your close body tag. -->

2
style.css vendored
View File

@ -55,6 +55,8 @@ sub { bottom: -0.25em; }
/** Remove border when inside `a` element in IE 8/9/10. */
img { border: 0; }
img.emojione { height: 20px; }
/** Correct overflow not hidden in IE 9/10/11. */
svg:not(:root) { overflow: hidden; }