forgeplus/public/editormd/examples/emoji.html

191 lines
6.5 KiB
HTML

<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="utf-8" />
<title>Emoji - Editor.md examples</title>
<link rel="stylesheet" href="css/style.css" />
<link rel="stylesheet" href="../css/editormd.css" />
<link rel="shortcut icon" href="https://pandao.github.io/editor.md/favicon.ico" type="image/x-icon" />
<style>
</style>
</head>
<body>
<div id="layout">
<header>
<h1>Emoji 表情</h1>
<p>Supports:</p>
<ul style="margin: 10px 0 0 18px;">
<li>Github emoji : <a href="http://www.emoji-cheat-sheet.com/" target="_blank">http://www.emoji-cheat-sheet.com/</a></li>
<li>Twitter Emoji(Twemoji) : <a href="http://twitter.github.io/twemoji/preview.html" target="_blank">http://twitter.github.io/twemoji/preview.html</a></li>
<li>FontAwesome icon font emoji : <a href="http://fortawesome.github.io/Font-Awesome/icons/" target="_blank">http://fortawesome.github.io/Font-Awesome/icons/</a></li>
<li>Editor.md logo icon font emoji</li>
</ul>
</header>
<div id="test-editormd">
<textarea style="display:none;">### Emoji 表情 :smiley:
[TOC]
### Emoji
Emoji cheat sheet for Campfire and GitHub.
[http://www.emoji-cheat-sheet.com/](http://www.emoji-cheat-sheet.com/)
**Usage:**
:emoji-name:
**Examples:**
:heart: :smiley: :+1: :-1: :black_large_square: :waxing_gibbous_moon: :moon: :crescent_moon:
### Twitter Emoji (Twemoji)
**Usage:**
:tw-xxxx:
**Examples:**
:tw-1f504: :tw-30-20e3: :tw-31-20e3: :tw-32-20e3: :tw-33-20e3: :tw-34-20e3: :tw-35-20e3: :tw-36-20e3: :tw-37-20e3: :tw-38-20e3: :tw-39-20e3: :tw-1f51f:
[http://twitter.github.io/twemoji/preview.html](http://twitter.github.io/twemoji/preview.html)
### Fortawesome icons
[http://fortawesome.github.io/Font-Awesome/icons/](http://fortawesome.github.io/Font-Awesome/icons/)
**Usage:**
:fa-xxxx:
**Examples:**
:fa-wifi: :fa-twitter: :fa-google-plus: :fa-git-square: :fa-github-alt: :fa-external-link-square:
### Editor.md logos
**Usage:**
:editormd-logo:
:editormd-logo-1x:
...
:editormd-logo-8x:
**Examples:**
:editormd-logo: :editormd-logo-1x: :editormd-logo-2x: :editormd-logo-3x: :editormd-logo-4x: :editormd-logo-5x: :editormd-logo-6x: :editormd-logo-7x: :editormd-logo-8x:
### Mixed tests
&gt; Blockquotes :star:
@pandao dasfsadfasdf:fa-edit: :warning: :smiley:dsafsdfsad\:fdsfdf\:f dfdf: :fa-save::fa-star: :fa-truck:
**fdfasd:smiley:dsfsdfsfd** ~~fsdfds:smiley:dfsdfsdf :fa-info:~~ @pandao
:fa-weixin: :fa-qq: :fa-weibo: :fa-tencent-weibo: :fa-github: :fa-git:
*dsfdfsfd:smiley:dsfsfdsfd:smiley:dsfdf*
___Emphasis :fa-gear: Italic:smiley:___ __Emphasis:smiley:__
# H1 dsfdfsfd:smiley:dsfsfdsfd:smiley:dsfdf:fa-star:
## H2 dsfd:fa-star:fsfd:smiley:dsfsfdsfd:smiley:dsfdf:fa-star:
### H3 dsfdfsfd@pandao :smiley:dsfsfdsfd:smiley:dsfdf:fa-edit: fdsfsdf:fa-save:dsfsdf @pandao
#### H4 dsfdfsfd@pandao :smiley:dsfsfdsfd:smiley:dsfdf:fa-edit: fdsfsdf:fa-save:dsfsdf
##### H5 dsfdfsfd:smiley:dsfsfd @pandao sfd:smiley:dsfdf:fa-edit: fdsfsdf:fa-save:dsfsdf
###### H6 dsfdfsfd:smiley:dsfsfdsfd:smiley:dsfdf:fa-edit: fdsfsdf:fa-star:dsfsdf
[:smiley:](http://www.emoji-cheat-sheet.com/ "link + emoji") link + emoji
- dafs@pandao sdfsdaf:smiley:dfsdfsdf
- dafssdfsdaf:smiley:dfsdfsdf @pandao
- dafssdfsdaf:smiley:dfsdfsdf
- dafss:fa-truck:dfsdaf:smiley:dfsd @pandao fsdf
- dafssd: :fa-truck:fsdaf:smiley:dfsdfsdf :fa-star:: :fa-truck:
+ dafssdfsdaf:smiley:dfsdfsdf @pandao
+ dafs@pandao s:fa-truck:dfsdaf:smiley:dfsdfsdf
1. :smiley:第一行:fa-truck:fsdaf:smiley:dfs@pandao dfsdf :fa-save:: :fa-truck:
- dafssdfsdaf:smiley:dfsdfsdf @pandao
- dafss:fa-truck:dfsdaf:smiley:dfsdfsdf
2. :smiley:第二行:fa-truck:fsdaf:smiley:dfsdfsdf :fa-star:: :fa-truck:
3. 第三行:fa-truck:fsdaf:smiley:dfsdfsdf :fa-save:: :fa-truck:
&gt; Blockquotes @pandao
&gt; dd:smiley:引用文本(Blockquotes:smiley:)fdasfad :fa-star:: dfd :fa-truck: @pandao
#### Datetime test
02:21:47
2015-03-12 02:21:47
### In table
|:100: First Header | Second:smiley: Header:smiley: |
| ------------- | ------------- |
| Content:fa-truck: Cell | :smiley:Content Cell :smiley: |
| Con:fa-truck:tent Cell:bangbang: | Content Cell dfsdfsdf :fa-star: :dfdf :fa-truck: |
### Editor.md logo emoji
:fa-heart:fasdfsdfsfddffd:editormd-logo: :editormd-logo: :editormd-logo-4x:
dfasfasdfasdf:bangbang:
This is an H1 :editormd-logo-4x: @pandao
=============
@pandao This :fa-save:: :fa-truck:is an H2 :100:
-------------
### GFM task lists :editormd-logo-5x:
- [x] :smiley: @mentions, :smiley: #refs, [links](), **formatting**, and <del>tags</del> supported :editormd-logo:;
- [x] list syntax required (any unordered or ordered list supported) :editormd-logo-3x:;
- [x] [ ] :smiley: this is a complete item :smiley:;
- [ ] []this is an incomplete item [test link](#) :fa-star: @pandao;
- [ ] [ ]this is an incomplete item;
- [ ] :smiley: this is an incomplete item [test link](#);
- [ ] :smiley: this is an incomplete item [test link](#);
</textarea>
</div>
</div>
<script src="js/jquery.min.js"></script>
<script src="../editormd.js"></script>
<script type="text/javascript">
var testEditor;
$(function() {
// You can custom Emoji's graphics files url path
editormd.emoji = {
path : "http://www.emoji-cheat-sheet.com/graphics/emojis/",
ext : ".png"
};
// Twitter Emoji (Twemoji) graphics files url path
editormd.twemoji = {
path : "http://twemoji.maxcdn.com/72x72/",
ext : ".png"
};
testEditor = editormd("test-editormd", {
width : "90%",
height : 720,
toc : true,
emoji : true, // Support Github emoji, Twitter Emoji(Twemoji), fontAwesome, Editor.md logo emojis.
taskList : true,
path : '../lib/'
});
});
</script>
</body>
</html>