fonts: improve default fonts & font picker

- change default font for colibris and for no-skin
- add roboto and quicksand font files
- simplify font picker: directly use the name of the font, and reduce their
  number

src/static/css/pad.css

@@ -13,9 +13,9 @@
 @import url("pad/loadingbox.css");
 
 html {
-  font-size: 13px;
-  font-family: Arial, sans-serif;
-  line-height: 16px;
+  font-size: 14px;
+  font-family: Cantarell, Roboto, "Open Sans", "Helvetica Neue", Arial, sans-serif;
+  line-height: 20px;
   color: #3e3e3e;
 }
 .clear {

src/static/css/pad/fonts.css

@@ -17,8 +17,6 @@
   font-family: opendyslexic;
   src: url("../../../static/font/opendyslexic.otf") format("opentype");
 }
-
-/* Roboto Mono */
 @font-face {
     font-family: "RobotoMono";
     src: url("../../../static/font/RobotoMono-Regular.ttf") format("truetype");
@@ -31,4 +29,33 @@
     font-weight: bold;
     font-style: normal;
 }
-/* End of Roboto Mono */
+@font-face {
+    font-family: "Quicksand";
+    src: url("../../../static/font/Quicksand-Regular.ttf") format("truetype");
+    font-weight: 300;
+    font-style: normal;
+}
+@font-face {
+    font-family: "Quicksand";
+    src: url("../../../static/font/Quicksand-Medium.ttf") format("truetype");
+    font-weight: normal;
+    font-style: normal;
+}
+@font-face {
+    font-family: "Quicksand";
+    src: url("../../../static/font/Quicksand-Bold.ttf") format("truetype");
+    font-weight: bold;
+    font-style: normal;
+}
+@font-face {
+    font-family: "Roboto";
+    src: url("../../../static/font/Roboto-Regular.ttf") format("truetype");
+    font-weight: normal;
+    font-style: normal;
+}
+@font-face {
+    font-family: "Roboto";
+    src: url("../../../static/font/Roboto-Bold.ttf") format("truetype");
+    font-weight: bold;
+    font-style: normal;
+}

src/static/js/pad_editor.js

@@ -141,29 +141,7 @@ var padeditor = (function()
         self.ace.setProperty("showsauthorcolors", !settings.noColors);
       }
 
-      var fontFamily = newOptions['padFontFamily'];
-      switch (fontFamily) {
-        case "monospace": self.ace.setProperty("textface", "monospace"); break;
-        case "montserrat": self.ace.setProperty("textface", "Montserrat"); break;
-        case "opendyslexic": self.ace.setProperty("textface", "OpenDyslexic"); break;
-        case "comicsans": self.ace.setProperty("textface", "'Comic Sans MS','Comic Sans',cursive"); break;
-        case "georgia": self.ace.setProperty("textface", "Georgia,'Bitstream Charter',serif"); break;
-        case "impact": self.ace.setProperty("textface", "Impact,Haettenschweiler,'Arial Black',sans-serif"); break;
-        case "lucida": self.ace.setProperty("textface", "Lucida,'Lucida Serif','Lucida Bright',serif"); break;
-        case "lucidasans": self.ace.setProperty("textface", "'Lucida Sans','Lucida Grande','Lucida Sans Unicode','Luxi Sans',sans-serif"); break;
-        case "palatino": self.ace.setProperty("textface", "Palatino,'Palatino Linotype','URW Palladio L',Georgia,serif"); break;
-        case "robotomono": self.ace.setProperty("textface", "RobotoMono"); break;
-        case "tahoma": self.ace.setProperty("textface", "Tahoma,sans-serif"); break;
-        case "timesnewroman": self.ace.setProperty("textface", "'Times New Roman',Times,serif"); break;
-        case "trebuchet": self.ace.setProperty("textface", "'Trebuchet MS',sans-serif"); break;
-        case "verdana": self.ace.setProperty("textface", "Verdana,'DejaVu Sans',sans-serif"); break;
-        case "symbol": self.ace.setProperty("textface", "Symbol"); break;
-        case "webdings": self.ace.setProperty("textface", "Webdings"); break;
-        case "wingdings": self.ace.setProperty("textface", "Wingdings"); break;
-        case "sansserif": self.ace.setProperty("textface", "sans-serif"); break;
-        case "serif": self.ace.setProperty("textface", "serif"); break;
-        default: self.ace.setProperty("textface", "");   break;
-      }
+      self.ace.setProperty("textface", newOptions['padFontFamily'] || "");
     },
     dispose: function()
     {

src/static/js/timeslider.js

@@ -165,33 +165,9 @@ function handleClientVars(message)
 
   // font family change
   $("#viewfontmenu").change(function(){
-    var font = $("#viewfontmenu").val();
-    switch (font) {
-      case "monospace": setFont("Courier new");break;
-      case "opendyslexic": setFont("OpenDyslexic");break;
-      case "comicsans": setFont("Comic Sans MS");break;
-      case "georgia": setFont("Georgia");break;
-      case "impact": setFont("Impact");break;
-      case "lucida": setFont("Lucida");break;
-      case "lucidasans": setFont("Lucida Sans Unicode");break;
-      case "palatino": setFont("Palatino Linotype");break;
-      case "tahoma": setFont("Tahoma");break;
-      case "timesnewroman": setFont("Times New Roman");break;
-      case "trebuchet": setFont("Trebuchet MS");break;
-      case "verdana": setFont("Verdana");break;
-      case "symbol": setFont("Symbol");break;
-      case "webdings": setFont("Webdings");break;
-      case "wingdings": setFont("Wingdings");break;
-      case "sansserif": setFont("MS Sans Serif");break;
-      case "serif": setFont("MS Serif");break;
-      default: setFont("");break;
-    }
+    $('#innerdocbody').css("font-family", $(this).val() || "");
   });
 }
 
-function setFont(font){
-  $('#innerdocbody').css("font-family", font);
-}
-
 exports.baseURL = '';
 exports.init = init;

src/static/skins/colibris/pad.css

@@ -95,21 +95,5 @@ p[data-l10n-id="ep_comments_page.comment"],
   background-color: #f9f9f9 !important;
 }
 
-
-/* NEUTRAL FONT */
-body
-{ font-family: Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif; }
-
-/* PRIMARY FONT */
-h1,
-#titlelabel,
-#chatlabel,
-.btn,
-.yui-skin-sam .yui-panel .hd,
-.reply-suggestion p:not(.reply-comment-suggest-from-p),
-p[data-l10n-id="ep_comments_page.comment"],
-#newComment.sidebar-comment input[type=submit],
-.comment-changeTo-approve input[type=submit],
-#sidedivinner>div:before
-{ font-family: Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif !important;  }
-
+/* FONT */
+body { font-family: Quicksand, Cantarell, "Open Sans", "Helvetica Neue", sans-serif; }