Twitter Emoji’s
J1 Template comes with the Twitter Emoji library (Twemoji) V1 included and offers more than 800+ icons. A lot of icons - hard to remember all the names, isn’t it?
To use all the Emoji’s with your documents you don’t need to remember any name. Simply pick the icon you want - use the Emoji Picker.
To find the icon you need, to fasten your search the Emoji Library is sorted by five categories:
-
people, classic Emoji’s like (
smile) and (laughing) or faces like (girl) -
nature, like (
mouse), (rose) or (sunny) -
objects, like (
bell), (hammer) or (notes) -
places, like (
office), (car) or flags like (de) -
symbols, like (
ok), (clock12) or (scorpius)
Asciidoc Markup
Using Twitter Emoji’s for your Asciidoc documents is quite simple - use the emoji: inline macro like this:
Your text emoji:icon_name[] ...
Your text emoji:icon_name[size, modifier] ...For all Emoji’s (icon_name), two parameters can be given for the size and a modifier to put additional features on the icon. See the following chapters for all sizes and modifiers (rotate, spin, flip and pulsed) available.
If none if the additional parameters are specified, the size is set to 1x and no modifier is used for an Emoji.
view result to see the nice turtle …You're faster than a emoji:turtle[2x] - for sure emoji:heart[pulsed] !
You’re faster than a - for sure !
Writing complex Asciidoc Macros for documents are not fun. For the emoji: inline macro the name of the Emoji is need. Go for the Emoji Picker and you’re done in seconds.
Sizes
For more eye-minded placement, or to place emphasis on, all Emoji’s can be specified in different sizes by the optional parameter size. See with the following what sizes are available.
BS grid Size
For a better Bootstrap integration, the icon size can be given like the view-port shortcuts xs, sm, md, lg and xl.
| Class | Result | Code |
|---|---|---|
| | |
| | |
| | |
| | |
| |
Relative Size
All icons can be specifier relativ to the base size of 1em from 1x to 5x. See the examples with the table below.
| Class | Result | Code |
|---|---|---|
| | |
| | |
| | |
| | |
| |
Rotate
To vary Emoji’s in their orientation, the icons can be rotated for 7 different angle. This is quite useful, if an Emoji has an orientation already but does not fit your need.
Using flip- and rotate- at the same time is not supported |
| Class | Result | Code |
|---|---|---|
no | | |
| | |
| | |
| | |
| | |
| | |
| | |
| |
Flip
Like rotate, an icon can be flipped by horizontal and vertical axes. It is similiar to rotate but the angle (perspective) remains unchanged.
| Class | Result | Code |
|---|---|---|
no | | |
| | |
| |
Spin and Pulsed
For realy eye-minded placements of Emoji’s, icons can be animated im terms of rotation and pulse. Be careful using animated Emoji’s, because this may cause disturbing effects and can demand unwanted attention.
| Class | Result | Code |
|---|---|---|
no | | |
| | |
| |
| Animations gets stopped if the mouse (pointer) is moved over an animated Emoji. |
Emoji Picker
The Picker for Emoji’s is easy to use. Open the category view by a click on the button Picker and click on an emoji you want to use. Automatically, the Asciidoc code is copied to the clipboard. You can paste the code directly from the clipboard to the document your’re currently work on.
For your reference, all Emoji’s selected are copied into to text-field of the picker (and the Asciidoc code as well ). If gets too much, a click on the Clear button cleans up the text-field.
Simple like that!
dummy-text