-
Notifications
You must be signed in to change notification settings - Fork 173
/
Copy pathindex.html
executable file
·53 lines (49 loc) · 2.6 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
---
---
<!doctype html>
<html lang="en">
<head>
<title>Emoji CSS</title>
<meta charset="utf-8">
<meta property="og:title" content="Emoji CSS" />
<meta property="og:image" content="https://emoji-css.afeld.me/emoji/thumbsup.png" />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://emoji-css.afeld.me/" />
<meta name="description" content="Emoji Web HTML Demo">
<meta name="keywords" content="HTML, CSS, JavaScript">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="shortcut icon" href="public/favicon.ico"/>
<link href="//fonts.googleapis.com/css?family=Yanone+Kaffeesatz" rel="stylesheet">
<link href="emoji.css" rel="stylesheet">
<link href="public/style.css" rel="stylesheet">
</head>
<body id="content">
<div id="header">
<h1>Emoji CSS</h1>
<input class="search" placeholder="Instant Search">
</div>
<p>
Want to include emoji in your HTML? Just include the (minified) stylesheet below, then add <code><i></code> tags to insert emoji. That's it!<br>
✈ <b>Click the emoji code and it will be copied to your clipboard.</b>
</p>
{% highlight html %}
<link href="https://emoji-css.afeld.me/emoji.css" rel="stylesheet">
{% assign emoji=site.data.emoji[104] %}{% include emoji-icon.html %}
{% endhighlight %}
<p>
By default, the emoji will be served as PNGs. To use SVG instead, use the <code>em-svg</code> class instead of <code>em</code>. This will scale better, but has larger file size.
</p>
<ul class="emojis">
{% for emoji in site.data.emoji %}
{% capture clipboard_text %}{% include emoji-icon.html %}{% endcapture %}
<li class="emoji" data-clipboard-text="{{ clipboard_text | replace:'"','"' | replace:'<','<' | replace:'>','>' }}">
{% include emoji.html %}
</li>
{% endfor %}
</ul>
<a href="https://github.com/afeld/emoji-css/"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://camo.githubusercontent.com/38ef81f8aca64bb9a64448d0d70f1308ef5341ab/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f6461726b626c75655f3132313632312e706e67" alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png"></a>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/1.7.1/clipboard.min.js"></script>
<script src="public/script.js"></script>
</body>
</html>