Add a subset of FontAwesome icons using Fontello

Most of the code here has been taken from @LaKing's #2554.

Only icons required for etherpad have been added. Here is a
list of the code points that are being used:

 0xe800 0xe801 0xe802 0xe803
 0xe804 0xe805 0xe806 0xe807
 0xe808 0xe809 0xe80a 0xe80b
 0xe80c 0xe80d 0xe80e 0xe80f
 0xe810 0xe811 0xe812 0xe813
 0xe814 0xe815 0xe816 0xe817

Their related icon names can be seen in:
/src/static/css/fontawesome-etherpad.css

Even though this patch *adds* all the required icons it only
uses them in the in toolbar. The switch to using only FontAwesome
icons and the removal of old PNG files will only happen after the
timeslider interface has been updated.

This is the first step for #2253

6 files changed, 158 insertions, 43 deletions

diff --git a/src/static/css/fontawesome-etherpad.css b/src/static/css/fontawesome-etherpad.css
new file mode 100644
index 00000000..13f28f2b
--- /dev/null
+++ b/src/static/css/fontawesome-etherpad.css
@@ -0,0 +1,76 @@
+@font-face {
+  font-family: 'fontawesome-etherpad';
+  src: url('../font/fontawesome-etherpad.eot?81419457');
+  src: url('../font/fontawesome-etherpad.eot?81419457#iefix') format('embedded-opentype'),
+       url('../font/fontawesome-etherpad.woff?81419457') format('woff'),
+       url('../font/fontawesome-etherpad.ttf?81419457') format('truetype'),
+       url('../font/fontawesome-etherpad.svg?81419457#fontawesome-etherpad') format('svg');
+  font-weight: normal;
+  font-style: normal;
+}
+/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
+/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
+/*
+@media screen and (-webkit-min-device-pixel-ratio:0) {
+  @font-face {
+    font-family: 'fontawesome-etherpad';
+    src: url('../font/fontawesome-etherpad.svg?81419457#fontawesome-etherpad') format('svg');
+  }
+}
+*/
+ 
+ [class^="icon-"]:before, [class*=" icon-"]:before {
+  font-family: "fontawesome-etherpad";
+  font-style: normal;
+  font-weight: normal;
+  speak: none;
+ 
+  display: inline-block;
+  text-decoration: inherit;
+  width: 1em;
+  margin-right: .2em;
+  text-align: center;
+  /* opacity: .8; */
+ 
+  /* For safety - reset parent styles, that can break glyph codes*/
+  font-variant: normal;
+  text-transform: none;
+     
+  /* fix buttons height, for twitter bootstrap */
+  line-height: 1em;
+ 
+  /* Animation center compensation - margins should be symmetric */
+  /* remove if not needed */
+  margin-left: .2em;
+ 
+  /* you can be more comfortable with increased icons size */
+  /* font-size: 120%; */
+ 
+  /* Uncomment for 3D effect */
+  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
+}
+ 
+.icon-users:before { content: '\e800'; } /* '' */
+.icon-star:before { content: '\e801'; } /* '' */
+.icon-cog:before { content: '\e802'; } /* '' */
+.icon-bold:before { content: '\e803'; } /* '' */
+.icon-italic:before { content: '\e804'; } /* '' */
+.icon-indent-left:before { content: '\e805'; } /* '' */
+.icon-indent-right:before { content: '\e806'; } /* '' */
+.icon-list-bullet:before { content: '\e807'; } /* '' */
+.icon-list-numbered:before { content: '\e808'; } /* '' */
+.icon-strike:before { content: '\e809'; } /* '' */
+.icon-underline:before { content: '\e80a'; } /* '' */
+.icon-cw:before { content: '\e80b'; } /* '' */
+.icon-ccw:before { content: '\e80c'; } /* '' */
+.icon-clock:before { content: '\e80d'; } /* '' */
+.icon-eye-off:before { content: '\e80e'; } /* '' */
+.icon-eye:before { content: '\e80f'; } /* '' */
+.icon-play:before { content: '\e810'; } /* '' */
+.icon-fast-bw:before { content: '\e811'; } /* '' */
+.icon-fast-fw:before { content: '\e812'; } /* '' */
+.icon-pause:before { content: '\e813'; } /* '' */
+.icon-glass:before { content: '\e814'; } /* '' */
+.icon-code:before { content: '\e815'; } /* '' */
+.icon-exchange:before { content: '\e816'; } /* '' */
+.icon-chat:before { content: '\e817'; } /* '' */
\ No newline at end of file
diff --git a/src/static/css/pad.css b/src/static/css/pad.css
index 309eb833..599b9fd4 100644
--- a/src/static/css/pad.css
+++ b/src/static/css/pad.css
@@ -669,64 +669,68 @@ table#otheruserstable {
 .buttonicon {
   width: 16px;
   height: 16px;
-  background-image: url('../../static/img/etherpad_lite_icons.png');
-  background-repeat: no-repeat;
   display: inline-block;
   vertical-align: middle;
+
+  font-family: "fontawesome-etherpad";
+  font-size: 15px;
+  font-style: normal;
+  font-weight: normal;
+  color: #666;
 }
-.buttonicon-bold {
-  background-position: 0px -116px
+.buttonicon-bold:before {
+  content: "\e803";
 }
-.buttonicon-italic {
-  background-position: 0px 0px
+.buttonicon-italic:before {
+  content: "\e804";
 }
-.buttonicon-underline {
-  background-position: 0px -236px
+.buttonicon-underline:before {
+  content: "\e80a";
 }
-.buttonicon-strikethrough {
-  background-position: 0px -200px
+.buttonicon-strikethrough:before {
+  content: "\e809";
 }
-.buttonicon-insertorderedlist {
-  background-position: 0px -477px
+.buttonicon-insertorderedlist:before {
+  content: "\e808";
 }
-.buttonicon-insertunorderedlist {
-  background-position: 0px -34px
+.buttonicon-insertunorderedlist:before {
+  content: "\e807";
 }
-.buttonicon-indent {
-  background-position: 0px -52px
+.buttonicon-indent:before {
+  content: "\e806";
 }
-.buttonicon-outdent {
-  background-position: 0px -134px
+.buttonicon-outdent:before {
+  content: "\e805";
 }
-.buttonicon-undo {
-  background-position: 0px -255px
+.buttonicon-undo:before {
+  content: "\e80c";
 }
-.buttonicon-redo {
-  background-position: 0px -166px
+.buttonicon-redo:before {
+  content: "\e80b";
 }
-.buttonicon-clearauthorship {
-  background-position: 0px -86px
+.buttonicon-clearauthorship:before {
+  content: "\e80e";
 }
-.buttonicon-settings {
-  background-position: 0px -436px
+.buttonicon-settings:before {
+  content: "\e802";
 }
-.buttonicon-import_export {
-  background-position: 0px -68px
+.buttonicon-import_export:before {
+  content: "\e816";
 }
-.buttonicon-embed {
-  background-position: 0px -18px
+.buttonicon-embed:before {
+  content: "\e815";
 }
-.buttonicon-history {
-  background-position: 0px -218px
+.buttonicon-history:before {
+  content: "\e80d";
 }
-.buttonicon-chat {
-  background-position: 0px -102px;
+.buttonicon-chat:before {
+  content: "\e817";
 }
-.buttonicon-showusers {
-  background-position: 0px -183px;
+.buttonicon-showusers:before {
+  content: "\e800";
 }
-.buttonicon-savedRevision {
-  background-position: 0px -493px
+.buttonicon-savedRevision:before {
+  content: "\e801";
 }
 #focusprotector {
   z-index: 100;
@@ -838,7 +842,7 @@ input[type=checkbox] {
   border-left: 1px solid #ccc !important;
   width: 185px !important;
 }
-@media screen and (max-width: 600px) { 
+@media screen and (max-width: 600px) {
     .toolbar ul li.separator {
       display: none;
     }
@@ -856,7 +860,7 @@ input[type=checkbox] {
     left:0px;
     right:0px;
     color:#000;
-  } 
+  }
   .gritter-close {
     display:block !important;
     left: auto !important;
@@ -884,13 +888,13 @@ input[type=checkbox] {
   .gritter-item-wrapper > div{
     background: none;
   }
-  #editorcontainer { 
+  #editorcontainer {
     top: 68px;
   }
-  #editbar { 
+  #editbar {
     height: 62px;
   }
-  .toolbar ul.menu_right { 
+  .toolbar ul.menu_right {
     float: left;
     margin-top:2px;
   }
diff --git a/src/static/font/fontawesome-etherpad.eot b/src/static/font/fontawesome-etherpad.eot
new file mode 100644
index 00000000..9a24fc67
--- /dev/null
+++ b/src/static/font/fontawesome-etherpad.eot
diff --git a/src/static/font/fontawesome-etherpad.svg b/src/static/font/fontawesome-etherpad.svg
new file mode 100644
index 00000000..ba49c31c
--- /dev/null
+++ b/src/static/font/fontawesome-etherpad.svg
@@ -0,0 +1,35 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg">
+<metadata>Copyright (C) 2014 by original authors @ fontello.com</metadata>
+<defs>
+<font id="fontawesome-etherpad" horiz-adv-x="1000" >
+<font-face font-family="fontawesome-etherpad" font-weight="400" font-stretch="normal" units-per-em="1000" ascent="850" descent="-150" />
+<missing-glyph horiz-adv-x="1000" />
+<glyph glyph-name="users" unicode="&#xe800;" d="m0 367q0 197 69 197 4 0 25-11t54-24 66-12q38 0 75 13-3-21-3-37 0-78 45-143-90-3-148-72h-75q-45 0-77 23t-31 66z m71 340q0 59 42 101t101 42 101-42 42-101-42-101-101-42-101 42-42 101z m72-713q0 30 2 58t8 61 14 61 24 54 35 45 48 30 62 11q6 0 24-12t41-26 59-27 76-12 75 12 60 27 41 26 23 12q35 0 63-11t47-30 35-45 24-54 15-61 8-61 2-58q0-66-41-105t-108-39h-488q-68 0-108 39t-41 105z m178 499q0 89 63 151t152 63 151-63 63-151-63-152-151-63-152 63-63 152z m393 214q0 59 42 101t101 42 101-42 42-101-42-101-101-42-101 42-42 101z m27-357q45 65 45 143 0 16-3 37 37-13 74-13 33 0 67 12t54 24 24 11q69 0 69-197 0-43-31-66t-77-22h-75q-57 68-147 71z" horiz-adv-x="1071.4" />
+<glyph glyph-name="star" unicode="&#xe801;" d="m0 489q0 21 31 26l280 40 126 254q11 23 27 23t28-23l125-254 280-40q32-5 32-26 0-12-15-27l-203-197 48-279q1-4 1-12 0-11-6-19t-17-9q-10 0-22 7l-251 132-250-132q-13-7-23-7-11 0-17 9t-6 19q0 4 1 12l48 279-203 197q-14 15-14 27z" horiz-adv-x="928.6" />
+<glyph glyph-name="cog" unicode="&#xe802;" d="m0 289v124q0 7 5 13t10 7l104 16q8 25 22 51-23 32-60 77-6 7-6 14 0 5 5 12 15 20 55 60t53 40q7 0 15-5l77-60q24 13 50 21 9 76 17 104 3 15 20 15h124q7 0 13-4t7-12l15-103q28-9 50-21l80 60q5 5 13 5 7 0 14-5 72-67 92-95 4-5 4-13 0-6-4-12-9-12-29-38t-30-39q14-28 23-55l102-15q7-1 12-7t4-13v-124q0-7-4-13t-11-7l-104-16q-10-30-21-51 19-28 59-77 6-6 6-14t-5-12q-15-21-55-61t-53-39q-7 0-14 5l-77 60q-25-13-51-21-9-76-16-104-4-16-20-16h-124q-8 0-14 5t-6 12l-16 103q-27 9-50 20l-79-59q-6-5-14-5-8 0-14 6-70 63-92 94-4 5-4 12 0 7 5 13 8 12 28 37t30 40q-15 28-23 55l-102 15q-7 1-11 7t-5 13z m286 61q0-59 42-101t101-42 101 42 41 101-41 101-101 42-101-42-42-101z" horiz-adv-x="857.1" />
+<glyph glyph-name="bold" unicode="&#xe803;" d="m0-79l1 53q9 2 48 9t59 15q4 7 7 15t4 19 4 18 1 21 0 19v36q0 548-12 572-2 5-12 8t-25 6-28 4-27 3-17 2l-2 46q55 1 190 6t208 5q13 0 38 0t38 0q39 0 76-7t72-24 60-39 41-59 16-76q0-29-9-54t-22-40-36-32-41-25-47-22q86-20 144-75t57-139q0-55-20-100t-52-73-77-47-91-27-98-8q-25 0-74 2t-74 1q-59 0-171-6t-129-7z m297 793q0-28 3-84t2-85q0-15 0-45t-1-44q0-26 1-38 23-4 61-4 46 0 80 7t61 25 41 50 15 79q0 39-16 68t-45 46-60 24-69 8q-28 0-73-7z m4-629q0-21 2-47t7-37q41-18 78-18 210 0 210 187 0 64-23 101-15 24-35 41t-37 26-45 14-47 6-53 1q-40 0-56-6 0-29 0-88t-1-89q0-4 0-37t0-54z" horiz-adv-x="785.7" />
+<glyph glyph-name="italic" unicode="&#xe804;" d="m0-78l10 48q3 1 45 12t62 21q16 19 23 56 1 4 35 162t63 303 29 165v14q-13 7-30 11t-39 4-32 3l10 58q19-2 67-4t84-4 67-1q27 0 55 1t67 4 55 4q-2-22-10-50-17-6-57-16t-60-19q-5-10-8-23t-5-23-4-25-4-24q-15-82-49-234t-43-198q-1-5-7-32t-11-51-9-46-4-32l1-10q9-3 103-18-2-24-9-55-6 0-18-1t-18-1q-16 0-49 6t-48 6q-77 1-115 1-28 0-79-5t-68-6z" horiz-adv-x="571.4" />
+<glyph glyph-name="indent-left" unicode="&#xe805;" d="m0 11v107q0 7 5 12t13 6h964q7 0 13-6t5-12v-107q0-8-5-13t-13-5h-964q-7 0-13 5t-5 13z m0 643v107q0 7 5 12t13 6h964q7 0 13-6t5-12v-107q0-8-5-13t-13-5h-964q-7 0-13 5t-5 13z m18-268q0 8 5 13l161 160q5 5 12 5 8 0 13-5t5-13v-321q0-7-5-13t-13-5q-7 0-12 5l-161 161q-5 5-5 13z m339-161v107q0 7 5 13t13 5h607q7 0 13-5t5-13v-107q0-7-5-13t-13-5h-607q-7 0-13 5t-5 13z m0 214v107q0 8 5 13t13 5h607q7 0 13-5t5-13v-107q0-7-5-12t-13-6h-607q-7 0-13 6t-5 12z" horiz-adv-x="1000" />
+<glyph glyph-name="indent-right" unicode="&#xe806;" d="m0 11v107q0 7 5 12t13 6h964q7 0 13-6t5-12v-107q0-8-5-13t-13-5h-964q-7 0-13 5t-5 13z m0 214v321q0 8 5 13t13 5q8 0 13-5l160-160q5-5 5-13t-5-13l-160-161q-5-5-13-5-7 0-13 5t-5 13z m0 429v107q0 7 5 12t13 6h964q7 0 13-6t5-12v-107q0-8-5-13t-13-5h-964q-7 0-13 5t-5 13z m357-429v107q0 7 5 13t13 5h607q7 0 13-5t5-13v-107q0-7-5-13t-13-5h-607q-7 0-13 5t-5 13z m0 214v107q0 8 5 13t13 5h607q7 0 13-5t5-13v-107q0-7-5-12t-13-6h-607q-7 0-13 6t-5 12z" horiz-adv-x="1000" />
+<glyph glyph-name="list-bullet" unicode="&#xe807;" d="m0 64q0 45 31 76t76 31 76-31 31-76-31-76-76-31-76 31-31 76z m0 286q0 45 31 76t76 31 76-31 31-76-31-76-76-31-76 31-31 76z m0 286q0 44 31 76t76 31 76-31 31-76-31-76-76-31-76 31-31 76z m286-625v107q0 7 5 12t13 6h678q7 0 13-6t5-12v-107q0-7-5-13t-13-5h-678q-8 0-13 5t-5 13z m0 285v108q0 7 5 12t13 5h678q7 0 13-5t5-12v-108q0-7-5-12t-13-5h-678q-8 0-13 5t-5 12z m0 286v107q0 8 5 13t13 5h678q7 0 13-5t5-13v-107q0-7-5-12t-13-6h-678q-8 0-13 6t-5 12z" horiz-adv-x="1000" />
+<glyph glyph-name="list-numbered" unicode="&#xe808;" d="m8 237q0 29 14 52t31 38 37 27 31 24 14 25q0 14-9 22t-22 7q-25 0-45-32l-47 33q13 28 40 44t59 16q40 0 68-23t28-63q0-28-19-51t-42-36-42-28-20-30h71v34h59v-89h-202q-4 20-4 30z m3-350l31 49q28-25 60-25 16 0 28 8t12 24q0 35-59 31l-14 31q4 6 18 24t24 31 20 21v1q-9 0-27-1t-27 0v-30h-59v85h186v-49l-53-65q28-6 45-27t17-49q0-45-31-70t-75-26q-60 0-96 37z m8 887l76 71h59v-225h60v-56h-187v56h60q0 22 0 68t1 67v7h-1q-5-10-28-30z m267-763v107q0 8 5 13t13 5h678q7 0 13-6t5-12v-107q0-8-5-13t-13-5h-678q-8 0-13 5t-5 13z m0 285v108q0 7 5 12t13 5h678q7 0 13-5t5-12v-108q0-7-5-12t-13-5h-678q-8 0-13 5t-5 12z m0 286v107q0 8 5 13t13 5h678q7 0 13-5t5-13v-107q0-7-5-12t-13-6h-678q-8 0-13 6t-5 12z" horiz-adv-x="1000" />
+<glyph glyph-name="strike" unicode="&#xe809;" d="m0 296v36q0 8 5 13t13 5h964q8 0 13-5t5-13v-36q0-7-5-12t-13-5h-964q-8 0-13 5t-5 12z m214 239q0 101 75 173 74 71 219 71 28 0 94-11 36-7 98-27 6-21 12-66 8-68 8-102 0-10-3-25l-7-2-46 4-8 1q-28 83-58 114-49 51-117 51-64 0-102-33-37-32-37-81 0-41 37-79t156-72q38-11 96-36 33-16 53-29h-414q-16 19-29 44-27 54-27 105z m17-456q0 17 0 38l1 20v25l57 1q8-19 17-40t12-31 7-15q20-32 45-52 24-20 59-32 33-12 73-12 36 0 78 15 43 14 68 48 26 34 26 72 0 47-45 87-19 16-77 40h230q4-22 4-51 0-62-23-119-13-30-40-58-20-19-61-45-44-27-85-37-45-12-113-12-64 0-109 13l-78 23q-32 9-40 15-5 5-5 13v7q0 60-1 87z" horiz-adv-x="1000" />
+<glyph glyph-name="underline" unicode="&#xe80a;" d="m0-25v-36q0-8 5-13t13-5h821q8 0 13 5t5 13v36q0 8-5 13t-13 5h-821q-8 0-13-5t-5-13z m0 802q7 0 22 0 34 0 63-2 74-4 92-4 48 0 94 2 65 2 82 3 31 0 48 1l-1-8 1-36v-5q-33-5-69-5-33 0-44-14-7-7-7-73 0-8 0-18t0-15l1-128 8-156q3-69 28-112 20-33 54-52 49-26 98-26 58 0 107 16 31 10 55 28 27 20 37 36 20 31 29 63 12 41 12 128 0 44-2 72t-6 68-8 89l-2 33q-3 37-13 49-19 20-43 19l-56-1-8 2 1 48h47l114-6q43-2 110 6l10-2q3-21 3-28 0-4-2-17-25-7-47-8-41-6-44-9-8-9-8-23 0-4 0-15t1-17q5-11 13-221 3-109-9-170-8-42-23-68-21-36-62-69-42-32-102-49-61-19-142-19-93 0-159 26-66 26-99 68-34 42-47 109-9 44-9 132v186q0 105-9 119-14 20-82 21-21 2-25 3z" horiz-adv-x="857.1" />
+<glyph glyph-name="cw" unicode="&#xe80b;" d="m0 350q0 87 34 166t92 137 136 92 167 34q82 0 158-31t137-88l72 72q16 18 39 8 22-9 22-33v-250q0-14-10-25t-26-11h-250q-23 0-32 23-10 22 7 38l77 77q-82 77-194 77-58 0-111-23t-91-61-62-91-22-111 22-111 62-91 91-61 111-23q66 0 125 29t100 82q4 6 13 7 8 0 14-5l76-77q5-4 6-11t-5-13q-60-74-147-114t-182-41q-87 0-167 34t-136 92-92 137-34 166z" horiz-adv-x="857.1" />
+<glyph glyph-name="ccw" unicode="&#xe80c;" d="m0 457v250q0 24 22 33 22 10 39-8l72-72q60 57 137 88t159 31q87 0 166-34t137-92 91-137 34-166-34-166-91-137-137-92-166-34q-96 0-183 41t-147 114q-4 6-4 12t5 12l76 77q6 5 14 5 9-1 13-7 41-53 100-82t126-29q58 0 110 23t92 61 61 91 22 111-22 111-61 91-92 61-110 23q-55 0-105-20t-90-57l77-77q17-16 8-38-10-23-33-23h-250q-15 0-25 11t-11 25z" horiz-adv-x="857.1" />
+<glyph glyph-name="clock" unicode="&#xe80d;" d="m0 350q0 117 58 215t155 156 216 58 215-58 156-156 57-215-57-215-156-156-215-58-216 58-155 156-58 215z m125 0q0-83 41-152t110-111 153-41 152 41 110 111 41 152-41 152-110 111-152 41-153-41-110-111-41-152z m161-54v36q0 8 5 13t13 5h125v196q0 8 5 13t12 5h36q8 0 13-5t5-13v-250q0-7-5-12t-13-5h-178q-8 0-13 5t-5 12z" horiz-adv-x="857.1" />
+<glyph glyph-name="eye-off" unicode="&#xe80e;" d="m0 314q0 22 11 39 86 131 212 207t277 76q50 0 100-10l31 54q5 9 15 9 3 0 10-3t18-9 18-10 18-10 10-7q9-5 9-15 0-4 0-5-59-105-176-316t-176-316l-28-50q-5-9-15-9-7 0-75 39-9 6-9 16 0 7 25 48-80 37-147 97t-117 137q-11 17-11 38z m71 0q94-144 239-209l43 79q-48 35-76 88t-27 114q0 67 34 125-128-65-213-197z m259 72q0-11 8-19t19-8 19 8 8 19q0 48 34 82t82 34q11 0 19 8t8 19-8 19-19 7q-70 0-120-50t-50-119z m170-393l41 74q119 10 219 76t169 171q-65 100-158 164l35 63q53-36 102-86t81-102q11-19 11-39t-11-38q-22-36-61-81-84-96-194-149t-234-53z m89 159l157 281q4-26 4-47 0-78-44-142t-117-92z" horiz-adv-x="1000" />
+<glyph glyph-name="eye" unicode="&#xe80f;" d="m0 314q0 19 11 39 78 128 210 205t279 78 279-78 210-205q11-20 11-39t-11-38q-78-129-210-206t-279-77-279 77-210 206q-11 19-11 38z m71 0q75-114 187-182t242-68 242 68 187 182q-85 132-213 197 34-58 34-125 0-104-73-177t-177-73-177 73-73 177q0 67 34 125-128-65-213-197z m259 72q0-11 8-19t19-8 19 8 8 19q0 48 34 82t82 34q11 0 19 8t8 19-8 19-19 7q-70 0-120-50t-50-119z" horiz-adv-x="1000" />
+<glyph glyph-name="play" unicode="&#xe810;" d="m0-61v822q0 14 9 20t22-2l741-412q13-7 13-17t-13-17l-741-412q-13-7-22-2t-9 20z" horiz-adv-x="785.7" />
+<glyph glyph-name="fast-bw" unicode="&#xe811;" d="m68 350q0 15 11 25l396 396q11 11 18 8t7-18v-396q3 6 7 10l396 396q11 11 18 8t8-18v-822q0-14-8-18t-18 8l-396 396q-4 5-7 11v-397q0-14-7-18t-18 8l-396 396q-11 11-11 25z" horiz-adv-x="928.6" />
+<glyph glyph-name="fast-fw" unicode="&#xe812;" d="m0-61v822q0 14 7 18t18-8l396-396q5-4 8-11v397q0 14 7 18t18-8l396-396q10-11 10-25t-10-25l-396-396q-11-11-18-8t-7 18v396q-3-5-8-10l-396-396q-10-11-18-8t-7 18z" horiz-adv-x="928.6" />
+<glyph glyph-name="pause" unicode="&#xe813;" d="m0-43v786q0 14 11 25t25 11h285q15 0 26-11t10-25v-786q0-14-10-25t-26-11h-285q-15 0-25 11t-11 25z m500 0v786q0 14 11 25t25 11h285q15 0 26-11t10-25v-786q0-14-10-25t-26-11h-285q-15 0-25 11t-11 25z" horiz-adv-x="857.1" />
+<glyph glyph-name="glass" unicode="&#xe814;" d="m52 746q0 13 10 21t21 9 24 3h786q13 0 24-3t21-9 10-21q0-19-24-43l-353-353v-429h179q15 0 25-10t11-25-11-25-25-11h-500q-14 0-25 11t-11 25 11 25 25 10h179v429l-353 353q-24 24-24 43z" horiz-adv-x="1000" />
+<glyph glyph-name="code" unicode="&#xe815;" d="m25 314q0 8 6 13l260 260q5 6 13 6t12-6l28-28q6-5 6-13t-6-12l-219-220 219-219q6-6 6-13t-6-13l-28-28q-5-5-12-5t-13 5l-260 260q-6 6-6 13z m372-350l208 720q3 8 9 11t13 2l35-10q7-2 11-9t1-13l-208-721q-2-7-9-11t-13-1l-34 9q-8 3-11 9t-2 14z m325 118q0 7 5 13l219 219-219 220q-5 5-5 12t5 13l28 28q6 6 13 6t13-6l260-260q5-5 5-13t-5-13l-260-260q-6-5-13-5t-13 5l-28 28q-5 6-5 13z" horiz-adv-x="1071.4" />
+<glyph glyph-name="exchange" unicode="&#xe816;" d="m0 136q0 8 5 13l179 178q5 5 12 5 8 0 13-5t5-13v-107h768q7 0 13-5t5-13v-107q0-7-5-12t-13-6h-768v-107q0-7-5-12t-13-6q-6 0-13 6l-178 178q-5 5-5 13z m0 303v107q0 8 5 13t13 5h768v107q0 8 5 13t13 5q6 0 13-5l178-178q5-5 5-13t-5-13l-179-179q-5-5-12-5-8 0-13 6t-5 12v107h-768q-7 0-13 6t-5 12z" horiz-adv-x="1000" />
+<glyph glyph-name="chat" unicode="&#xe817;" d="m0 421q0 78 53 144t143 104 197 38 197-38 143-104 53-144-53-143-143-104-197-38q-48 0-98 9-70-50-155-72-21-5-48-9h-2q-6 0-12 5t-6 11q-1 2-1 4t1 4 1 3l1 3t2 3 2 3 3 2 2 3q3 3 13 14t15 16 12 17 14 21 11 25q-69 40-108 98t-40 125z m344-354q32-3 49-3 90 0 172 25t148 72q69 52 107 119t37 141q0 43-13 85 72-39 114-99t42-128q0-67-40-126t-108-98q5-14 11-25t14-21 13-16 14-17 13-14q0 0 2-2t3-3 2-3 2-3l1-3t1-3 1-4-1-3q-2-8-7-13t-13-4q-27 4-48 9-85 23-155 72-50-9-98-9-151 0-263 74z" horiz-adv-x="1000" />
+</font>
+</defs>
+</svg>
\ No newline at end of file
diff --git a/src/static/font/fontawesome-etherpad.ttf b/src/static/font/fontawesome-etherpad.ttf
new file mode 100644
index 00000000..a179bd19
--- /dev/null
+++ b/src/static/font/fontawesome-etherpad.ttf
diff --git a/src/static/font/fontawesome-etherpad.woff b/src/static/font/fontawesome-etherpad.woff
new file mode 100644
index 00000000..1015d8e2
--- /dev/null
+++ b/src/static/font/fontawesome-etherpad.woff