@kolkov/angular-editor
Version:
A simple native WYSIWYG editor for Angular 6+, 7+, 8+. Rich Text editor component for Angular.
709 lines (706 loc) • 126 kB
JavaScript
import { Injectable, Inject, defineInjectable, inject, EventEmitter, Component, Renderer2, Output, ViewChild, SecurityContext, forwardRef, ChangeDetectorRef, Attribute, Input, HostBinding, HostListener, NgModule } from '@angular/core';
import { HttpClient, HttpResponse } from '@angular/common/http';
import { DOCUMENT, CommonModule } from '@angular/common';
import { NG_VALUE_ACCESSOR, FormsModule, ReactiveFormsModule } from '@angular/forms';
import { DomSanitizer } from '@angular/platform-browser';
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class AngularEditorService {
/**
* @param {?} http
* @param {?} doc
*/
constructor(http, doc) {
this.http = http;
this.doc = doc;
/**
* save selection when the editor is focussed out
*/
this.saveSelection = (/**
* @return {?}
*/
() => {
if (this.doc.getSelection) {
/** @type {?} */
const sel = this.doc.getSelection();
if (sel.getRangeAt && sel.rangeCount) {
this.savedSelection = sel.getRangeAt(0);
this.selectedText = sel.toString();
}
}
else if (this.doc.getSelection && this.doc.createRange) {
this.savedSelection = document.createRange();
}
else {
this.savedSelection = null;
}
});
}
/**
* Executed command from editor header buttons exclude toggleEditorMode
* @param {?} command string from triggerCommand
* @return {?}
*/
executeCommand(command) {
/** @type {?} */
const commands = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'p', 'pre'];
if (commands.includes(command)) {
this.doc.execCommand('formatBlock', false, command);
return;
}
this.doc.execCommand(command, false, null);
}
/**
* Create URL link
* @param {?} url string from UI prompt
* @return {?}
*/
createLink(url) {
if (!url.includes('http')) {
this.doc.execCommand('createlink', false, url);
}
else {
/** @type {?} */
const newUrl = '<a href="' + url + '" target="_blank">' + this.selectedText + '</a>';
this.insertHtml(newUrl);
}
}
/**
* insert color either font or background
*
* @param {?} color color to be inserted
* @param {?} where where the color has to be inserted either text/background
* @return {?}
*/
insertColor(color, where) {
/** @type {?} */
const restored = this.restoreSelection();
if (restored) {
if (where === 'textColor') {
this.doc.execCommand('foreColor', false, color);
}
else {
this.doc.execCommand('hiliteColor', false, color);
}
}
}
/**
* Set font name
* @param {?} fontName string
* @return {?}
*/
setFontName(fontName) {
this.doc.execCommand('fontName', false, fontName);
}
/**
* Set font size
* @param {?} fontSize string
* @return {?}
*/
setFontSize(fontSize) {
this.doc.execCommand('fontSize', false, fontSize);
}
/**
* Create raw HTML
* @param {?} html HTML string
* @return {?}
*/
insertHtml(html) {
/** @type {?} */
const isHTMLInserted = this.doc.execCommand('insertHTML', false, html);
if (!isHTMLInserted) {
throw new Error('Unable to perform the operation');
}
}
/**
* restore selection when the editor is focused in
*
* saved selection when the editor is focused out
* @return {?}
*/
restoreSelection() {
if (this.savedSelection) {
if (this.doc.getSelection) {
/** @type {?} */
const sel = this.doc.getSelection();
sel.removeAllRanges();
sel.addRange(this.savedSelection);
return true;
}
else if (this.doc.getSelection /*&& this.savedSelection.select*/) {
// this.savedSelection.select();
return true;
}
}
else {
return false;
}
}
/**
* setTimeout used for execute 'saveSelection' method in next event loop iteration
* @param {?} callbackFn
* @param {?=} timeout
* @return {?}
*/
executeInNextQueueIteration(callbackFn, timeout = 1e2) {
setTimeout(callbackFn, timeout);
}
/**
* check any selection is made or not
* @private
* @return {?}
*/
checkSelection() {
/** @type {?} */
const selectedText = this.savedSelection.toString();
if (selectedText.length === 0) {
throw new Error('No Selection Made');
}
return true;
}
/**
* Upload file to uploadUrl
* @param {?} file The file
* @return {?}
*/
uploadImage(file) {
/** @type {?} */
const uploadData = new FormData();
uploadData.append('file', file, file.name);
return this.http.post(this.uploadUrl, uploadData, {
reportProgress: true,
observe: 'events',
});
}
/**
* Insert image with Url
* @param {?} imageUrl The imageUrl.
* @return {?}
*/
insertImage(imageUrl) {
this.doc.execCommand('insertImage', false, imageUrl);
}
/**
* @param {?} separator
* @return {?}
*/
setDefaultParagraphSeparator(separator) {
this.doc.execCommand('defaultParagraphSeparator', false, separator);
}
/**
* @param {?} customClass
* @return {?}
*/
createCustomClass(customClass) {
/** @type {?} */
let newTag = this.selectedText;
if (customClass) {
/** @type {?} */
const tagName = customClass.tag ? customClass.tag : 'span';
newTag = '<' + tagName + ' class="' + customClass.class + '">' + this.selectedText + '</' + tagName + '>';
}
this.insertHtml(newTag);
}
/**
* @param {?} videoUrl
* @return {?}
*/
insertVideo(videoUrl) {
if (videoUrl.match('www.youtube.com')) {
this.insertYouTubeVideoTag(videoUrl);
}
if (videoUrl.match('vimeo.com')) {
this.insertVimeoVideoTag(videoUrl);
}
}
/**
* @private
* @param {?} videoUrl
* @return {?}
*/
insertYouTubeVideoTag(videoUrl) {
/** @type {?} */
const id = videoUrl.split('v=')[1];
/** @type {?} */
const imageUrl = `https://img.youtube.com/vi/${id}/0.jpg`;
/** @type {?} */
const thumbnail = `
<div style='position: relative'>
<img style='position: absolute; left:200px; top:140px'
src="https://img.icons8.com/color/96/000000/youtube-play.png"
<a href='${videoUrl}' target='_blank'>
<img src="${imageUrl}" alt="click to watch"/>
</a>
</div>`;
this.insertHtml(thumbnail);
}
/**
* @private
* @param {?} videoUrl
* @return {?}
*/
insertVimeoVideoTag(videoUrl) {
/** @type {?} */
const sub = this.http.get(`https://vimeo.com/api/oembed.json?url=${videoUrl}`).subscribe((/**
* @param {?} data
* @return {?}
*/
data => {
/** @type {?} */
const imageUrl = data.thumbnail_url_with_play_button;
/** @type {?} */
const thumbnail = `<div>
<a href='${videoUrl}' target='_blank'>
<img src="${imageUrl}" alt="${data.title}"/>
</a>
</div>`;
this.insertHtml(thumbnail);
sub.unsubscribe();
}));
}
/**
* @param {?} node
* @return {?}
*/
nextNode(node) {
if (node.hasChildNodes()) {
return node.firstChild;
}
else {
while (node && !node.nextSibling) {
node = node.parentNode;
}
if (!node) {
return null;
}
return node.nextSibling;
}
}
/**
* @param {?} range
* @param {?} includePartiallySelectedContainers
* @return {?}
*/
getRangeSelectedNodes(range, includePartiallySelectedContainers) {
/** @type {?} */
let node = range.startContainer;
/** @type {?} */
const endNode = range.endContainer;
/** @type {?} */
let rangeNodes = [];
// Special case for a range that is contained within a single node
if (node === endNode) {
rangeNodes = [node];
}
else {
// Iterate nodes until we hit the end container
while (node && node !== endNode) {
rangeNodes.push(node = this.nextNode(node));
}
// Add partially selected nodes at the start of the range
node = range.startContainer;
while (node && node !== range.commonAncestorContainer) {
rangeNodes.unshift(node);
node = node.parentNode;
}
}
// Add ancestors of the range container, if required
if (includePartiallySelectedContainers) {
node = range.commonAncestorContainer;
while (node) {
rangeNodes.push(node);
node = node.parentNode;
}
}
return rangeNodes;
}
/**
* @return {?}
*/
getSelectedNodes() {
/** @type {?} */
const nodes = [];
if (this.doc.getSelection) {
/** @type {?} */
const sel = this.doc.getSelection();
for (let i = 0, len = sel.rangeCount; i < len; ++i) {
nodes.push.apply(nodes, this.getRangeSelectedNodes(sel.getRangeAt(i), true));
}
}
return nodes;
}
/**
* @param {?} el
* @return {?}
*/
replaceWithOwnChildren(el) {
/** @type {?} */
const parent = el.parentNode;
while (el.hasChildNodes()) {
parent.insertBefore(el.firstChild, el);
}
parent.removeChild(el);
}
/**
* @param {?} tagNames
* @return {?}
*/
removeSelectedElements(tagNames) {
/** @type {?} */
const tagNamesArray = tagNames.toLowerCase().split(',');
this.getSelectedNodes().forEach((/**
* @param {?} node
* @return {?}
*/
(node) => {
if (node.nodeType === 1 &&
tagNamesArray.indexOf(node.tagName.toLowerCase()) > -1) {
// Remove the node and replace it with its children
this.replaceWithOwnChildren(node);
}
}));
}
}
AngularEditorService.decorators = [
{ type: Injectable, args: [{
providedIn: 'root'
},] }
];
/** @nocollapse */
AngularEditorService.ctorParameters = () => [
{ type: HttpClient },
{ type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] }] }
];
/** @nocollapse */ AngularEditorService.ngInjectableDef = defineInjectable({ factory: function AngularEditorService_Factory() { return new AngularEditorService(inject(HttpClient), inject(DOCUMENT)); }, token: AngularEditorService, providedIn: "root" });
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/** @type {?} */
const angularEditorConfig = {
editable: true,
spellcheck: true,
height: 'auto',
minHeight: '0',
maxHeight: 'auto',
width: 'auto',
minWidth: '0',
translate: 'yes',
enableToolbar: true,
showToolbar: true,
placeholder: 'Enter text here...',
defaultParagraphSeparator: '',
defaultFontName: '',
defaultFontSize: '',
fonts: [
{ class: 'arial', name: 'Arial' },
{ class: 'times-new-roman', name: 'Times New Roman' },
{ class: 'calibri', name: 'Calibri' },
{ class: 'comic-sans-ms', name: 'Comic Sans MS' }
],
uploadUrl: 'v1/image',
sanitize: true,
toolbarPosition: 'top',
};
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class AngularEditorToolbarComponent {
/**
* @param {?} r
* @param {?} editorService
* @param {?} doc
*/
constructor(r, editorService, doc) {
this.r = r;
this.editorService = editorService;
this.doc = doc;
this.id = '';
this.htmlMode = false;
this.showToolbar = true;
this.linkSelected = false;
this.block = 'default';
this.fontSize = '5';
this.customClassId = -1;
this.tagMap = {
BLOCKQUOTE: 'indent',
A: 'link'
};
this.select = ['H1', 'H2', 'H3', 'H4', 'H5', 'H6', 'P', 'PRE', 'DIV'];
this.buttons = ['bold', 'italic', 'underline', 'strikeThrough', 'subscript', 'superscript', 'justifyLeft', 'justifyCenter',
'justifyRight', 'justifyFull', 'indent', 'outdent', 'insertUnorderedList', 'insertOrderedList', 'link'];
this.execute = new EventEmitter();
}
/**
* @return {?}
*/
get isLinkButtonDisabled() {
return this.htmlMode || !Boolean(this.editorService.selectedText);
}
/**
* Trigger command from editor header buttons
* @param {?} command string from toolbar buttons
* @return {?}
*/
triggerCommand(command) {
this.execute.emit(command);
}
/**
* highlight editor buttons when cursor moved or positioning
* @return {?}
*/
triggerButtons() {
if (!this.showToolbar) {
return;
}
this.buttons.forEach((/**
* @param {?} e
* @return {?}
*/
e => {
/** @type {?} */
const result = this.doc.queryCommandState(e);
/** @type {?} */
const elementById = this.doc.getElementById(e + '-' + this.id);
if (result) {
this.r.addClass(elementById, 'active');
}
else {
this.r.removeClass(elementById, 'active');
}
}));
}
/**
* trigger highlight editor buttons when cursor moved or positioning in block
* @param {?} nodes
* @return {?}
*/
triggerBlocks(nodes) {
if (!this.showToolbar) {
return;
}
this.linkSelected = nodes.findIndex((/**
* @param {?} x
* @return {?}
*/
x => x.nodeName === 'A')) > -1;
/** @type {?} */
let found = false;
this.select.forEach((/**
* @param {?} y
* @return {?}
*/
y => {
/** @type {?} */
const node = nodes.find((/**
* @param {?} x
* @return {?}
*/
x => x.nodeName === y));
if (node !== undefined && y === node.nodeName) {
if (found === false) {
this.block = node.nodeName.toLowerCase();
found = true;
}
}
else if (found === false) {
this.block = 'default';
}
}));
found = false;
if (this.customClasses) {
this.customClasses.forEach((/**
* @param {?} y
* @param {?} index
* @return {?}
*/
(y, index) => {
/** @type {?} */
const node = nodes.find((/**
* @param {?} x
* @return {?}
*/
x => {
if (x instanceof Element) {
return x.className === y.class;
}
}));
if (node !== undefined) {
if (found === false) {
this.customClassId = index;
found = true;
}
}
else if (found === false) {
this.customClassId = -1;
}
}));
}
Object.keys(this.tagMap).map((/**
* @param {?} e
* @return {?}
*/
e => {
/** @type {?} */
const elementById = this.doc.getElementById(this.tagMap[e] + '-' + this.id);
/** @type {?} */
const node = nodes.find((/**
* @param {?} x
* @return {?}
*/
x => x.nodeName === e));
if (node !== undefined && e === node.nodeName) {
this.r.addClass(elementById, 'active');
}
else {
this.r.removeClass(elementById, 'active');
}
}));
this.foreColour = this.doc.queryCommandValue('ForeColor');
this.fontSize = this.doc.queryCommandValue('FontSize');
this.fontName = this.doc.queryCommandValue('FontName').replace(/"/g, '');
this.backColor = this.doc.queryCommandValue('backColor');
}
/**
* insert URL link
* @return {?}
*/
insertUrl() {
/** @type {?} */
let url = 'https:\/\/';
/** @type {?} */
const selection = this.editorService.savedSelection;
if (selection && selection.commonAncestorContainer.parentElement.nodeName === 'A') {
/** @type {?} */
const parent = (/** @type {?} */ (selection.commonAncestorContainer.parentElement));
if (parent.href !== '') {
url = parent.href;
}
}
url = prompt('Insert URL link', url);
if (url && url !== '' && url !== 'https://') {
this.editorService.createLink(url);
}
}
/**
* insert Video link
* @return {?}
*/
insertVideo() {
this.execute.emit('');
/** @type {?} */
const url = prompt('Insert Video link', `https://`);
if (url && url !== '' && url !== `https://`) {
this.editorService.insertVideo(url);
}
}
/**
* insert color
* @param {?} color
* @param {?} where
* @return {?}
*/
insertColor(color, where) {
this.editorService.insertColor(color, where);
this.execute.emit('');
}
/**
* set font Name/family
* @param {?} foreColor string
* @return {?}
*/
setFontName(foreColor) {
this.editorService.setFontName(foreColor);
this.execute.emit('');
}
/**
* set font Size
* @param {?} fontSize string
* @return {?}
*/
setFontSize(fontSize) {
this.editorService.setFontSize(fontSize);
this.execute.emit('');
}
/**
* toggle editor mode (WYSIWYG or SOURCE)
* @param {?} m boolean
* @return {?}
*/
setEditorMode(m) {
/** @type {?} */
const toggleEditorModeButton = this.doc.getElementById('toggleEditorMode' + '-' + this.id);
if (m) {
this.r.addClass(toggleEditorModeButton, 'active');
}
else {
this.r.removeClass(toggleEditorModeButton, 'active');
}
this.htmlMode = m;
}
/**
* Upload image when file is selected
* @param {?} event
* @return {?}
*/
onFileChanged(event) {
/** @type {?} */
const file = event.target.files[0];
if (file.type.includes('image/')) {
if (this.uploadUrl) {
this.editorService.uploadImage(file).subscribe((/**
* @param {?} e
* @return {?}
*/
e => {
if (e instanceof HttpResponse) {
this.editorService.insertImage(e.body.imageUrl);
this.fileReset();
}
}));
}
else {
/** @type {?} */
const reader = new FileReader();
reader.onload = (/**
* @param {?} e
* @return {?}
*/
(e) => {
/** @type {?} */
const fr = (/** @type {?} */ (e.currentTarget));
this.editorService.insertImage(fr.result.toString());
});
reader.readAsDataURL(file);
}
}
}
/**
* Reset Input
* @return {?}
*/
fileReset() {
this.myInputFile.nativeElement.value = '';
}
/**
* Set custom class
* @param {?} classId
* @return {?}
*/
setCustomClass(classId) {
if (classId === -1) {
this.execute.emit('clear');
}
else {
this.editorService.createCustomClass(this.customClasses[classId]);
}
}
}
AngularEditorToolbarComponent.decorators = [
{ type: Component, args: [{
selector: 'angular-editor-toolbar',
template: "<div class=\"angular-editor-toolbar\" *ngIf=\"showToolbar\">\n <div class=\"angular-editor-toolbar-set\">\n <button type=\"button\" title=\"Undo\" class=\"angular-editor-button\" (click)=\"triggerCommand('undo')\" tabindex=\"-1\"><i\n class='fa fa-undo'></i></button>\n <button type=\"button\" title=\"Redo\" class=\"angular-editor-button\" (click)=\"triggerCommand('redo')\" tabindex=\"-1\"><i\n class='fa fa-repeat'></i></button>\n </div>\n <div class=\"angular-editor-toolbar-set\">\n <button [id]=\"'bold-'+id\" type=\"button\" title=\"Bold\" class=\"angular-editor-button\" (click)=\"triggerCommand('bold')\"\n [disabled]=\"htmlMode\" tabindex=\"-1\"><i class='fa fa-bold'></i></button>\n <button [id]=\"'italic-'+id\" type=\"button\" title=\"Italic\" class=\"angular-editor-button\"\n (click)=\"triggerCommand('italic')\"\n [disabled]=\"htmlMode\" tabindex=\"-1\"><i class='fa fa-italic'></i></button>\n <button [id]=\"'underline-'+id\" type=\"button\" title=\"Underline\" class=\"angular-editor-button\"\n (click)=\"triggerCommand('underline')\" [disabled]=\"htmlMode\" tabindex=\"-1\"><i class='fa fa-underline'></i></button>\n <button [id]=\"'strikeThrough-'+id\" type=\"button\" title=\"Strikethrough\" class=\"angular-editor-button\"\n (click)=\"triggerCommand('strikeThrough')\" [disabled]=\"htmlMode\" tabindex=\"-1\"><i class='fa fa-strikethrough'></i></button>\n <button [id]=\"'subscript-'+id\" type=\"button\" title=\"Subscript\" class=\"angular-editor-button\"\n (click)=\"triggerCommand('subscript')\" [disabled]=\"htmlMode\" tabindex=\"-1\"><i class='fa fa-subscript'></i></button>\n <button [id]=\"'superscript-'+id\" type=\"button\" title=\"Superscript\" class=\"angular-editor-button\"\n (click)=\"triggerCommand('superscript')\" [disabled]=\"htmlMode\" tabindex=\"-1\"><i class='fa fa-superscript'></i></button>\n </div>\n <div class=\"angular-editor-toolbar-set\">\n <button [id]=\"'justifyLeft-'+id\" type=\"button\" title=\"Justify Left\" class=\"angular-editor-button\"\n (click)=\"triggerCommand('justifyLeft')\" [disabled]=\"htmlMode\" tabindex=\"-1\"><i\n class='fa fa-align-left'></i></button>\n <button [id]=\"'justifyCenter-'+id\" type=\"button\" title=\"Justify Center\" class=\"angular-editor-button\"\n (click)=\"triggerCommand('justifyCenter')\" [disabled]=\"htmlMode\" tabindex=\"-1\"><i class='fa fa-align-center'></i></button>\n <button [id]=\"'justifyRight-'+id\" type=\"button\" title=\"Justify Right\" class=\"angular-editor-button\"\n (click)=\"triggerCommand('justifyRight')\" [disabled]=\"htmlMode\" tabindex=\"-1\">\n <i class='fa fa-align-right'></i></button>\n <button [id]=\"'justifyFull-'+id\" type=\"button\" title=\"Justify Full\" class=\"angular-editor-button\"\n (click)=\"triggerCommand('justifyFull')\" [disabled]=\"htmlMode\" tabindex=\"-1\"><i\n class='fa fa-align-justify'></i></button>\n </div>\n <div class=\"angular-editor-toolbar-set\">\n <button [id]=\"'indent-'+id\" type=\"button\" title=\"Indent\" class=\"angular-editor-button\"\n (click)=\"triggerCommand('indent')\"\n [disabled]=\"htmlMode\" tabindex=\"-1\"><i\n class='fa fa-indent'></i></button>\n <button [id]=\"'outdent-'+id\" type=\"button\" title=\"Outdent\" class=\"angular-editor-button\"\n (click)=\"triggerCommand('outdent')\"\n [disabled]=\"htmlMode\" tabindex=\"-1\"><i\n class='fa fa-outdent'></i></button>\n </div>\n <div class=\"angular-editor-toolbar-set\">\n <button [id]=\"'insertUnorderedList-'+id\" type=\"button\" title=\"Unordered List\" class=\"angular-editor-button\"\n (click)=\"triggerCommand('insertUnorderedList')\" [disabled]=\"htmlMode\" tabindex=\"-1\"><i class='fa fa-list-ul'></i></button>\n <button [id]=\"'insertOrderedList-'+id\" type=\"button\" title=\"Ordered List\" class=\"angular-editor-button\"\n (click)=\"triggerCommand('insertOrderedList')\" [disabled]=\"htmlMode\" tabindex=\"-1\"><i class='fa fa-list-ol'></i></button>\n </div>\n <div class=\"angular-editor-toolbar-set\">\n <label [for]=\"'heading-'+id\" class=\"block-label\" tabindex=\"-1\"></label>\n <select title=\"Formatting\" [id]=\"'heading-'+id\" class=\"select-heading\" [(ngModel)]=\"block\"\n (change)=\"triggerCommand(block)\"\n [disabled]=\"htmlMode\" tabindex=\"-1\">\n <optgroup label=\"Formatting\"></optgroup>\n <option class=\"h1\" value=\"h1\">Heading 1</option>\n <option class=\"h2\" value=\"h2\">Heading 2</option>\n <option class=\"h3\" value=\"h3\">Heading 3</option>\n <option class=\"h4\" value=\"h4\">Heading 4</option>\n <option class=\"h5\" value=\"h5\">Heading 5</option>\n <option class=\"h6\" value=\"h6\">Heading 6</option>\n <option class=\"p\" value=\"p\">Paragraph</option>\n <option class=\"pre\" value=\"pre\">Predefined</option>\n <option class=\"div\" value=\"div\">Standard</option>\n <option class=\"default\" value=\"default\">Default</option>\n </select>\n </div>\n <div class=\"angular-editor-toolbar-set\">\n <label [for]=\"'fontSelector-'+id\" class=\"block-label\"></label>\n <select title=\"Font Name\" [id]=\"'fontSelector-'+id\" class=\"select-font\" [(ngModel)]=\"fontName\"\n (change)=\"setFontName(fontName)\"\n [disabled]=\"htmlMode\" tabindex=\"-1\">\n <optgroup label=\"Font Name\"></optgroup>\n <option *ngFor=\"let item of fonts\" [class]=\"item.class\" [value]=\"item.name\">{{item.name}}</option>\n </select>\n </div>\n <div class=\"angular-editor-toolbar-set\">\n <label [for]=\"'fontSizeSelector-'+id\" class=\"block-label\"></label>\n <select title=\"Font Size\" [id]=\"'fontSizeSelector-'+id\" class=\"select-font-size\" [(ngModel)]=\"fontSize\"\n (change)=\"setFontSize(fontSize)\"\n [disabled]=\"htmlMode\" tabindex=\"-1\">\n <optgroup label=\"Font Sizing\"></optgroup>\n <option class=\"size1\" value=\"1\">1</option>\n <option class=\"size2\" value=\"2\">2</option>\n <option class=\"size3\" value=\"3\">3</option>\n <option class=\"size4\" value=\"4\">4</option>\n <option class=\"size5\" value=\"5\">5</option>\n <option class=\"size6\" value=\"6\">6</option>\n <option class=\"size7\" value=\"7\">7</option>\n </select>\n </div>\n <div class=\"angular-editor-toolbar-set\">\n <input\n style=\"display: none\"\n type=\"color\" (change)=\"insertColor(fgInput.value, 'textColor')\"\n #fgInput>\n <button [id]=\"'foregroundColorPicker-'+id\" type=\"button\" class=\"angular-editor-button\" (click)=\"fgInput.click()\" title=\"Text Color\"\n [disabled]=\"htmlMode\" tabindex=\"-1\"><span class=\"color-label foreground\"><i class=\"fa fa-font\"></i></span></button>\n <input\n style=\"display: none\"\n type=\"color\" (change)=\"insertColor(bgInput.value, 'backgroundColor')\"\n #bgInput>\n <button [id]=\"'backgroundColorPicker-'+id\" type=\"button\" class=\"angular-editor-button\" (click)=\"bgInput.click()\" title=\"Background Color\"\n [disabled]=\"htmlMode\" tabindex=\"-1\"><span class=\"color-label background\"><i class=\"fa fa-font\"></i></span></button>\n </div>\n <div *ngIf=\"customClasses\" class=\"angular-editor-toolbar-set\">\n <label [for]=\"'customClassSelector-'+id\" class=\"block-label\"></label>\n <select title=\"Custom Style\" [id]=\"'customClassSelector-'+id\" class=\"select-custom-style\" [(ngModel)]=\"customClassId\"\n (change)=\"setCustomClass(customClassId)\"\n [disabled]=\"htmlMode\" tabindex=\"-1\">\n <optgroup label=\"Custom Class\"></optgroup>\n <option class=\"\" [ngValue]=\"-1\">Clear Class</option>\n <option *ngFor=\"let item of customClasses; let i = index\" [class]=\"item.class\" [ngValue]=\"i\">{{item.name}}</option>\n </select>\n </div>\n <div class=\"angular-editor-toolbar-set\">\n <button [id]=\"'link-'+id\" type=\"button\" class=\"angular-editor-button\" (click)=\"insertUrl()\"\n title=\"Insert Link\" [disabled]=\"isLinkButtonDisabled\" tabindex=\"-1\">\n <i class=\"fa fa-link\"></i>\n </button>\n <button [id]=\"'unlink-'+id\" type=\"button\" class=\"angular-editor-button\" (click)=\"triggerCommand('unlink')\"\n title=\"Unlink\" [disabled]=\"htmlMode || !linkSelected\" tabindex=\"-1\">\n <i class=\"fa fa-chain-broken\"></i>\n </button>\n <input\n style=\"display: none\"\n accept=\"image/*\"\n type=\"file\" (change)=\"onFileChanged($event)\"\n #fileInput>\n <button [id]=\"'insertImage-'+id\" type=\"button\" class=\"angular-editor-button\" (click)=\"fileInput.click()\" title=\"Insert Image\"\n [disabled]=\"htmlMode\" tabindex=\"-1\"><i class=\"fa fa-image\"></i></button>\n <button [id]=\"'insertVideo-'+id\" type=\"button\" class=\"angular-editor-button\"\n (click)=\"insertVideo()\" title=\"Insert Video\" [disabled]=\"htmlMode\" tabindex=\"-1\"><i class=\"fa fa-video-camera\"></i></button>\n <button [id]=\"'insertHorizontalRule-'+id\" type=\"button\" title=\"Horizontal Line\" class=\"angular-editor-button\"\n (click)=\"triggerCommand('insertHorizontalRule')\" [disabled]=\"htmlMode\" tabindex=\"-1\"><i class=\"fa fa-minus\"></i></button>\n </div>\n <div class=\"angular-editor-toolbar-set\">\n <button [id]=\"'clearFormatting-'+id\" type=\"button\" title=\"Clear Formatting\" class=\"angular-editor-button\"\n (click)=\"triggerCommand('removeFormat')\" [disabled]=\"htmlMode\" tabindex=\"-1\"><i class='fa fa-remove'></i></button>\n </div>\n <div class=\"angular-editor-toolbar-set\">\n <button [id]=\"'toggleEditorMode-'+id\" type=\"button\" title=\"HTML Code\" class=\"angular-editor-button\"\n (click)=\"triggerCommand('toggleEditorMode')\" tabindex=\"-1\"><i class='fa fa-code'></i></button>\n </div>\n</div>\n",
styles: ["@charset \"UTF-8\";/*!\n * Font Awesome 4.7.0 by @davegandy - http://fontawesome.io - @fontawesome\n * License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)\n */@font-face{font-family:FontAwesome;src:url(https://netdna.bootstrapcdn.com/font-awesome/4.7.0/fonts/fontawesome-webfont.eot?v=4.7.0);src:url(https://netdna.bootstrapcdn.com/font-awesome/4.7.0/fonts/fontawesome-webfont.eot?#iefix&v=4.7.0) format(\"embedded-opentype\"),url(https://netdna.bootstrapcdn.com/font-awesome/4.7.0/fonts/fontawesome-webfont.woff2?v=4.7.0) format(\"woff2\"),url(https://netdna.bootstrapcdn.com/font-awesome/4.7.0/fonts/fontawesome-webfont.woff?v=4.7.0) format(\"woff\"),url(https://netdna.bootstrapcdn.com/font-awesome/4.7.0/fonts/fontawesome-webfont.ttf?v=4.7.0) format(\"truetype\"),url(https://netdna.bootstrapcdn.com/font-awesome/4.7.0/fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular) format(\"svg\");font-weight:400;font-style:normal}.fa{display:inline-block;font:14px/1 FontAwesome;font-size:inherit;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.fa-lg{font-size:1.33333em;line-height:.75em;vertical-align:-15%}.fa-2x{font-size:2em}.fa-3x{font-size:3em}.fa-4x{font-size:4em}.fa-5x{font-size:5em}.fa-fw{width:1.28571em;text-align:center}.fa-ul{padding-left:0;margin-left:2.14286em;list-style-type:none}.fa-ul>li{position:relative}.fa-li{position:absolute;left:-2.14286em;width:2.14286em;top:.14286em;text-align:center}.fa-li.fa-lg{left:-1.85714em}.fa-border{padding:.2em .25em .15em;border:.08em solid #eee;border-radius:.1em}.fa-pull-left{float:left}.fa-pull-right{float:right}.fa.fa-pull-left{margin-right:.3em}.fa.fa-pull-right{margin-left:.3em}.pull-right{float:right}.pull-left{float:left}.fa.pull-left{margin-right:.3em}.fa.pull-right{margin-left:.3em}.fa-spin{-webkit-animation:2s linear infinite fa-spin;animation:2s linear infinite fa-spin}.fa-pulse{-webkit-animation:1s steps(8) infinite fa-spin;animation:1s steps(8) infinite fa-spin}@-webkit-keyframes fa-spin{0%{transform:rotate(0)}100%{transform:rotate(359deg)}}@keyframes fa-spin{0%{transform:rotate(0)}100%{transform:rotate(359deg)}}.fa-rotate-90{transform:rotate(90deg)}.fa-rotate-180{transform:rotate(180deg)}.fa-rotate-270{transform:rotate(270deg)}.fa-flip-horizontal{transform:scale(-1,1)}.fa-flip-vertical{transform:scale(1,-1)}:root .fa-flip-horizontal,:root .fa-flip-vertical,:root .fa-rotate-180,:root .fa-rotate-270,:root .fa-rotate-90{-webkit-filter:none;filter:none}.fa-stack{position:relative;display:inline-block;width:2em;height:2em;line-height:2em;vertical-align:middle}.fa-stack-1x,.fa-stack-2x{position:absolute;left:0;width:100%;text-align:center}.fa-stack-1x{line-height:inherit}.fa-stack-2x{font-size:2em}.fa-inverse{color:#fff}.fa-glass:before{content:\"\uF000\"}.fa-music:before{content:\"\uF001\"}.fa-search:before{content:\"\uF002\"}.fa-envelope-o:before{content:\"\uF003\"}.fa-heart:before{content:\"\uF004\"}.fa-star:before{content:\"\uF005\"}.fa-star-o:before{content:\"\uF006\"}.fa-user:before{content:\"\uF007\"}.fa-film:before{content:\"\uF008\"}.fa-th-large:before{content:\"\uF009\"}.fa-th:before{content:\"\uF00A\"}.fa-th-list:before{content:\"\uF00B\"}.fa-check:before{content:\"\uF00C\"}.fa-close:before,.fa-remove:before,.fa-times:before{content:\"\uF00D\"}.fa-search-plus:before{content:\"\uF00E\"}.fa-search-minus:before{content:\"\uF010\"}.fa-power-off:before{content:\"\uF011\"}.fa-signal:before{content:\"\uF012\"}.fa-cog:before,.fa-gear:before{content:\"\uF013\"}.fa-trash-o:before{content:\"\uF014\"}.fa-home:before{content:\"\uF015\"}.fa-file-o:before{content:\"\uF016\"}.fa-clock-o:before{content:\"\uF017\"}.fa-road:before{content:\"\uF018\"}.fa-download:before{content:\"\uF019\"}.fa-arrow-circle-o-down:before{content:\"\uF01A\"}.fa-arrow-circle-o-up:before{content:\"\uF01B\"}.fa-inbox:before{content:\"\uF01C\"}.fa-play-circle-o:before{content:\"\uF01D\"}.fa-repeat:before,.fa-rotate-right:before{content:\"\uF01E\"}.fa-refresh:before{content:\"\uF021\"}.fa-list-alt:before{content:\"\uF022\"}.fa-lock:before{content:\"\uF023\"}.fa-flag:before{content:\"\uF024\"}.fa-headphones:before{content:\"\uF025\"}.fa-volume-off:before{content:\"\uF026\"}.fa-volume-down:before{content:\"\uF027\"}.fa-volume-up:before{content:\"\uF028\"}.fa-qrcode:before{content:\"\uF029\"}.fa-barcode:before{content:\"\uF02A\"}.fa-tag:before{content:\"\uF02B\"}.fa-tags:before{content:\"\uF02C\"}.fa-book:before{content:\"\uF02D\"}.fa-bookmark:before{content:\"\uF02E\"}.fa-print:before{content:\"\uF02F\"}.fa-camera:before{content:\"\uF030\"}.fa-font:before{content:\"\uF031\"}.fa-bold:before{content:\"\uF032\"}.fa-italic:before{content:\"\uF033\"}.fa-text-height:before{content:\"\uF034\"}.fa-text-width:before{content:\"\uF035\"}.fa-align-left:before{content:\"\uF036\"}.fa-align-center:before{content:\"\uF037\"}.fa-align-right:before{content:\"\uF038\"}.fa-align-justify:before{content:\"\uF039\"}.fa-list:before{content:\"\uF03A\"}.fa-dedent:before,.fa-outdent:before{content:\"\uF03B\"}.fa-indent:before{content:\"\uF03C\"}.fa-video-camera:before{content:\"\uF03D\"}.fa-image:before,.fa-photo:before,.fa-picture-o:before{content:\"\uF03E\"}.fa-pencil:before{content:\"\uF040\"}.fa-map-marker:before{content:\"\uF041\"}.fa-adjust:before{content:\"\uF042\"}.fa-tint:before{content:\"\uF043\"}.fa-edit:before,.fa-pencil-square-o:before{content:\"\uF044\"}.fa-share-square-o:before{content:\"\uF045\"}.fa-check-square-o:before{content:\"\uF046\"}.fa-arrows:before{content:\"\uF047\"}.fa-step-backward:before{content:\"\uF048\"}.fa-fast-backward:before{content:\"\uF049\"}.fa-backward:before{content:\"\uF04A\"}.fa-play:before{content:\"\uF04B\"}.fa-pause:before{content:\"\uF04C\"}.fa-stop:before{content:\"\uF04D\"}.fa-forward:before{content:\"\uF04E\"}.fa-fast-forward:before{content:\"\uF050\"}.fa-step-forward:before{content:\"\uF051\"}.fa-eject:before{content:\"\uF052\"}.fa-chevron-left:before{content:\"\uF053\"}.fa-chevron-right:before{content:\"\uF054\"}.fa-plus-circle:before{content:\"\uF055\"}.fa-minus-circle:before{content:\"\uF056\"}.fa-times-circle:before{content:\"\uF057\"}.fa-check-circle:before{content:\"\uF058\"}.fa-question-circle:before{content:\"\uF059\"}.fa-info-circle:before{content:\"\uF05A\"}.fa-crosshairs:before{content:\"\uF05B\"}.fa-times-circle-o:before{content:\"\uF05C\"}.fa-check-circle-o:before{content:\"\uF05D\"}.fa-ban:before{content:\"\uF05E\"}.fa-arrow-left:before{content:\"\uF060\"}.fa-arrow-right:before{content:\"\uF061\"}.fa-arrow-up:before{content:\"\uF062\"}.fa-arrow-down:before{content:\"\uF063\"}.fa-mail-forward:before,.fa-share:before{content:\"\uF064\"}.fa-expand:before{content:\"\uF065\"}.fa-compress:before{content:\"\uF066\"}.fa-plus:before{content:\"\uF067\"}.fa-minus:before{content:\"\uF068\"}.fa-asterisk:before{content:\"\uF069\"}.fa-exclamation-circle:before{content:\"\uF06A\"}.fa-gift:before{content:\"\uF06B\"}.fa-leaf:before{content:\"\uF06C\"}.fa-fire:before{content:\"\uF06D\"}.fa-eye:before{content:\"\uF06E\"}.fa-eye-slash:before{content:\"\uF070\"}.fa-exclamation-triangle:before,.fa-warning:before{content:\"\uF071\"}.fa-plane:before{content:\"\uF072\"}.fa-calendar:before{content:\"\uF073\"}.fa-random:before{content:\"\uF074\"}.fa-comment:before{content:\"\uF075\"}.fa-magnet:before{content:\"\uF076\"}.fa-chevron-up:before{content:\"\uF077\"}.fa-chevron-down:before{content:\"\uF078\"}.fa-retweet:before{content:\"\uF079\"}.fa-shopping-cart:before{content:\"\uF07A\"}.fa-folder:before{content:\"\uF07B\"}.fa-folder-open:before{content:\"\uF07C\"}.fa-arrows-v:before{content:\"\uF07D\"}.fa-arrows-h:before{content:\"\uF07E\"}.fa-bar-chart-o:before,.fa-bar-chart:before{content:\"\uF080\"}.fa-twitter-square:before{content:\"\uF081\"}.fa-facebook-square:before{content:\"\uF082\"}.fa-camera-retro:before{content:\"\uF083\"}.fa-key:before{content:\"\uF084\"}.fa-cogs:before,.fa-gears:before{content:\"\uF085\"}.fa-comments:before{content:\"\uF086\"}.fa-thumbs-o-up:before{content:\"\uF087\"}.fa-thumbs-o-down:before{content:\"\uF088\"}.fa-star-half:before{content:\"\uF089\"}.fa-heart-o:before{content:\"\uF08A\"}.fa-sign-out:before{content:\"\uF08B\"}.fa-linkedin-square:before{content:\"\uF08C\"}.fa-thumb-tack:before{content:\"\uF08D\"}.fa-external-link:before{content:\"\uF08E\"}.fa-sign-in:before{content:\"\uF090\"}.fa-trophy:before{content:\"\uF091\"}.fa-github-square:before{content:\"\uF092\"}.fa-upload:before{content:\"\uF093\"}.fa-lemon-o:before{content:\"\uF094\"}.fa-phone:before{content:\"\uF095\"}.fa-square-o:before{content:\"\uF096\"}.fa-bookmark-o:before{content:\"\uF097\"}.fa-phone-square:before{content:\"\uF098\"}.fa-twitter:before{content:\"\uF099\"}.fa-facebook-f:before,.fa-facebook:before{content:\"\uF09A\"}.fa-github:before{content:\"\uF09B\"}.fa-unlock:before{content:\"\uF09C\"}.fa-credit-card:before{content:\"\uF09D\"}.fa-feed:before,.fa-rss:before{content:\"\uF09E\"}.fa-hdd-o:before{content:\"\uF0A0\"}.fa-bullhorn:before{content:\"\uF0A1\"}.fa-bell:before{content:\"\uF0F3\"}.fa-certificate:before{content:\"\uF0A3\"}.fa-hand-o-right:before{content:\"\uF0A4\"}.fa-hand-o-left:before{content:\"\uF0A5\"}.fa-hand-o-up:before{content:\"\uF0A6\"}.fa-hand-o-down:before{content:\"\uF0A7\"}.fa-arrow-circle-left:before{content:\"\uF0A8\"}.fa-arrow-circle-right:before{content:\"\uF0A9\"}.fa-arrow-circle-up:before{content:\"\uF0AA\"}.fa-arrow-circle-down:before{content:\"\uF0AB\"}.fa-globe:before{content:\"\uF0AC\"}.fa-wrench:before{content:\"\uF0AD\"}.fa-tasks:before{content:\"\uF0AE\"}.fa-filter:before{content:\"\uF0B0\"}.fa-briefcase:before{content:\"\uF0B1\"}.fa-arrows-alt:before{content:\"\uF0B2\"}.fa-group:before,.fa-users:before{content:\"\uF0C0\"}.fa-chain:before,.fa-link:before{content:\"\uF0C1\"}.fa-cloud:before{content:\"\uF0C2\"}.fa-flask:before{content:\"\uF0C3\"}.fa-cut:before,.fa-scissors:before{content:\"\uF0C4\"}.fa-copy:before,.fa-files-o:before{content:\"\uF0C5\"}.fa-paperclip:before{content:\"\uF0C6\"}.fa-floppy-o:before,.fa-save:before{content:\"\uF0C7\"}.fa-square:before{content:\"\uF0C8\"}.fa-bars:before,.fa-navicon:before,.fa-reorder:before{content:\"\uF0C9\"}.fa-list-ul:before{content:\"\uF0CA\"}.fa-list-ol:before{content:\"\uF0CB\"}.fa-strikethrough:before{content:\"\uF0CC\"}.fa-underline:before{content:\"\uF0CD\"}.fa-table:before{content:\"\uF0CE\"}.fa-magic:before{content:\"\uF0D0\"}.fa-truck:before{content:\"\uF0D1\"}.fa-pinterest:before{content:\"\uF0D2\"}.fa-pinterest-square:before{content:\"\uF0D3\"}.fa-google-plus-square:before{content:\"\uF0D4\"}.fa-google-plus:before{content:\"\uF0D5\"}.fa-money:before{content:\"\uF0D6\"}.fa-caret-down:before{content:\"\uF0D7\"}.fa-caret-up:before{content:\"\uF0D8\"}.fa-caret-left:before{content:\"\uF0D9\"}.fa-caret-right:before{content:\"\uF0DA\"}.fa-columns:before{content:\"\uF0DB\"}.fa-sort:before,.fa-unsorted:before{content:\"\uF0DC\"}.fa-sort-desc:before,.fa-sort-down:before{content:\"\uF0DD\"}.fa-sort-asc:before,.fa-sort-up:before{content:\"\uF0DE\"}.fa-envelope:before{content:\"\uF0E0\"}.fa-linkedin:before{content:\"\uF0E1\"}.fa-rotate-left:before,.fa-undo:before{content:\"\uF0E2\"}.fa-gavel:before,.fa-legal:before{content:\"\uF0E3\"}.fa-dashboard:before,.fa-tachometer:before{content:\"\uF0E4\"}.fa-comment-o:before{content:\"\uF0E5\"}.fa-comments-o:before{content:\"\uF0E6\"}.fa-bolt:before,.fa-flash:before{content:\"\uF0E7\"}.fa-sitemap:before{content:\"\uF0E8\"}.fa-umbrella:before{content:\"\uF0E9\"}.fa-clipboard:before,.fa-paste:before{content:\"\uF0EA\"}.fa-lightbulb-o:before{content:\"\uF0EB\"}.fa-exchange:before{content:\"\uF0EC\"}.fa-cloud-download:before{content:\"\uF0ED\"}.fa-cloud-upload:before{content:\"\uF0EE\"}.fa-user-md:before{content:\"\uF0F0\"}.fa-stethoscope:before{content:\"\uF0F1\"}.fa-suitcase:before{content:\"\uF0F2\"}.fa-bell-o:before{content:\"\uF0A2\"}.fa-coffee:before{content:\"\uF0F4\"}.fa-cutlery:before{content:\"\uF0F5\"}.fa-file-text-o:before{content:\"\uF0F6\"}.fa-building-o:before{content:\"\uF0F7\"}.fa-hospital-o:before{content:\"\uF0F8\"}.fa-ambulance:before{content:\"\uF0F9\"}.fa-medkit:before{content:\"\uF0FA\"}.fa-fighter-jet:before{content:\"\uF0FB\"}.fa-beer:before{content:\"\uF0FC\"}.fa-h-square:before{content:\"\uF0FD\"}.fa-plus-square:before{content:\"\uF0FE\"}.fa-angle-double-left:before{content:\"\uF100\"}.fa-angle-double-right:before{content:\"\uF101\"}.fa-angle-double-up:before{content:\"\uF102\"}.fa-angle-double-down:before{content:\"\uF103\"}.fa-angle-left:before{content:\"\uF104\"}.fa-angle-right:before{content:\"\uF105\"}.fa-angle-up:before{content:\"\uF106\"}.fa-angle-down:before{content:\"\uF107\"}.fa-desktop:before{content:\"\uF108\"}.fa-laptop:before{content:\"\uF109\"}.fa-tablet:before{content:\"\uF10A\"}.fa-mobile-phone:before,.fa-mobile:before{content:\"\uF10B\"}.fa-circle-o:before{content:\"\uF10C\"}.fa-quote-left:before{content:\"\uF10D\"}.fa-quote-right:before{content:\"\uF10E\"}.fa-spinner:before{content:\"\uF110\"}.fa-circle:before{content:\"\uF111\"}.fa-mail-reply:before,.fa-reply:before{content:\"\uF112\"}.fa-github-alt:before{content:\"\uF113\"}.fa-folder-o:before{content:\"\uF114\"}.fa-folder-open-o:before{content:\"\uF115\"}.fa-smile-o:before{content:\"\uF118\"}.fa-frown-o:before{content:\"\uF119\"}.fa-meh-o:before{content:\"\uF11A\"}.fa-gamepad:before{content:\"\uF11B\"}.fa-keyboard-o:before{content:\"\uF11C\"}.fa-flag-o:before{content:\"\uF11D\"}.fa-flag-checkered:before{content:\"\uF11E\"}.fa-terminal:before{content:\"\uF120\"}.fa-code:before{content:\"\uF121\"}.fa-mail-reply-all:before,.fa-reply-all:before{content:\"\uF122\"}.fa-star-half-empty:before,.fa-star-half-full:before,.fa-star-half-o:before{content:\"\uF123\"}.fa-location-arrow:before{content:\"\uF124\"}.fa-crop:before{content:\"\uF125\"}.fa-code-fork:before{content:\"\uF126\"}.fa-chain-broken:before,.fa-unlink:before{content:\"\uF127\"}.fa-question:before{content:\"\uF128\"}.fa-info:before{content:\"\uF129\"}.fa-exclamation:before{content:\"\uF12A\"}.fa-superscript:before{content:\"\uF12B\"}.fa-subscript:before{content:\"\uF12C\"}.fa-eraser:before{content:\"\uF12D\"}.fa-puzzle-piece:before{content:\"\uF12E\"}.fa-microphone:before{content:\"\uF130\"}.fa-microphone-slash:before{content:\"\uF131\"}.fa-shield:before{content:\"\uF132\"}.fa-calendar-o:before{content:\"\uF133\"}.fa-fire-extinguisher:before{content:\"\uF134\"}.fa-rocket:before{content:\"\uF135\"}.fa-maxcdn:before{content:\"\uF136\"}.fa-chevron-circle-left:before{content:\"\uF137\"}.fa-chevron-circle-right:before{content:\"\uF138\"}.fa-chevron-circle-up:before{content:\"\uF139\"}.fa-chevron-circle-down:before{content:\"\uF13A\"}.fa-html5:before{content:\"\uF13B\"}.fa-css3:before{content:\"\uF13C\"}.fa-anchor:before{content:\"\uF13D\"}.fa-unlock-alt:before{content:\"\uF13E\"}.fa-bullseye:before{content:\"\uF140\"}.fa-ellipsis-h:before{content:\"\uF141\"}.fa-ellipsis-v:before{content:\"\uF142\"}.fa-rss-square:before{content:\"\uF143\"}.fa-play-circle:before{content:\"\uF144\"}.fa-ticket:before{content:\"\uF145\"}.fa-minus-square:before{content:\"\uF146\"}.fa-minus-square-o:before{content:\"\uF147\"}.fa-level-up:before{content:\"\uF148\"}.fa-level-down:before{content:\"\uF149\"}.fa-check-square:before{content:\"\uF14A\"}.fa-pencil-square:before{content:\"\uF14B\"}.fa-external-link-square:before{content:\"\uF14C\"}.fa-share-square:before{content:\"\uF14D\"}.fa-compass:before{content:\"\uF14E\"}.fa-caret-square-o-down:before,.fa-toggle-down:before{content:\"\uF150\"}.fa-caret-square-o-up:before,.fa-toggle-up:before{content:\"\uF151\"}.fa-caret-square-o-right:before,.fa-toggle-right:before{content:\"\uF152\"}.fa-eur:before,.fa-euro:before{content:\"\uF153\"}.fa-gbp:before{content:\"\uF154\"}.fa-dollar:before,.fa-usd:before{content:\"\uF155\"}.fa-inr:before,.fa-rupee:before{content:\"\uF156\"}.fa-cny:before,.fa-jpy:before,.fa-rmb:before,.fa-yen:before{content:\"\uF157\"}.fa-rouble:before,.fa-rub:before,.fa-ruble:before{content:\"\uF158\"}.fa-krw:before,.fa-won:before{content:\"\uF159\"}.fa-bitcoin:before,.fa-btc:before{content:\"\uF15A\"}.fa-file:before{content:\"\uF15B\"}.fa-file-text:before{content:\"\uF15C\"}.fa-sort-alpha-asc:before{content:\"\uF15D\"}.fa-sort-alpha-desc:before{content:\"\uF15E\"}.fa-sort-amount-asc:before{content:\"\uF160\"}.fa-sort-amount-desc:before{content:\"\uF161\"}.fa-sort-numeric-asc:before{content:\"\uF162\"}.fa-sort-numeric-desc:before{content:\"\uF163\"}.fa-thumbs-up:before{content:\"\uF164\"}.fa-thumbs-down:before{content:\"\uF165\"}.fa-youtube-square:before{content:\"\uF166\"}.fa-youtube:before{content:\"\uF167\"}.fa-xing:before{content:\"\uF168\"}.fa-xing-square:before{content:\"\uF169\"}.fa-youtube-play:before{content:\"\uF16A\"}.fa-dropbox:before{content:\"\uF16B\"}.fa-stack-overflow:before{content:\"\uF16C\"}.fa-instagram:before{content:\"\uF16D\"}.fa-flickr:before{content:\"\uF16E\"}.fa-adn:before{content:\"\uF170\"}.fa-bitbucket:before{content:\"\uF171\"}.fa-bitbucket-square:before{content:\"\uF172\"}.fa-tumblr:before{content:\"\uF173\"}.fa-tumblr-square:before{content:\"\uF174\"}.fa-long-arrow-down:before{content:\"\uF175\"}.fa-long-arrow-up:before{content:\"\uF176\"}.fa-long-arrow-left:before{content:\"\uF177\"}.fa-long-arrow-right:before{content:\"\uF178\"}.fa-apple:before{content:\"\uF179\"}.fa-windows:before{content:\"\uF17A\"}.fa-android:before{content:\"\uF17B\"}.fa-linux:before{content:\"\uF17C\"}.fa-dribbble:before{content:\"\uF17D\"}.fa-skype:before{content:\"\uF17E\"}.fa-foursquare:before{content:\"\uF180\"}.fa-trello:before{content:\"\uF181\"}.fa-female:before{content:\"\uF182\"}.fa-male:before{content:\"\uF183\"}.fa-gittip:before,.fa-gratipay:before{content:\"\uF184\"}.fa-sun-o:before{content:\"\uF185\"}.fa-moon-o:before{content:\"\uF186\"}.fa-archive:before{content:\"\uF187\"}.fa-bug:before{content:\"\uF188\"}.fa-vk:before{content:\"\uF189\"}.fa-weibo:before{content:\"\uF18A\"}.fa-renren:before{content:\"\uF18B\"}.fa-pagelines:before{content:\"\uF18C\"}.fa-stack-exchange:before{content:\"\uF18D\"}.fa-arrow-circle-o-right:before{content:\"\uF18E\"}.fa-arrow-circle-o-left:before{content:\"\uF190\"}.fa-caret-square-o-left:before,.fa-toggle-left:before{content:\"\uF191\"}.fa-dot-circle-o:before{content:\"\uF192\"}.fa-wheelchair:before{content:\"\uF193\"}.fa-vimeo-square:before{content:\"\uF194\"}.fa-try:before,.fa-turkish-lira:before{content:\"\uF195\"}.fa-plus-square-o: