[IMP] playground: use fontawesome for icons

closes #68

playground/index.html

@@ -7,6 +7,8 @@
 
     <script src="../libs/ace.js" type="text/javascript" charset="utf-8"></script>
     <script src="../libs/owl.js"></script>
+  <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/solid.css" integrity="sha384-QokYePQSOwpBDuhlHOsX0ymF6R/vLk/UQVz3WHa6wygxI5oGTmDTv8wahFOSspdm" crossorigin="anonymous">
+  <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/fontawesome.css" integrity="sha384-vd1e11sR28tEK9YANUtpIOdjGW14pS87bUBuOIoBILVWLFnS+MCX9T6MMf0VdPGq" crossorigin="anonymous">
 
     <!-- Application JS/CSS -->
     <link rel="stylesheet" href="playground.css">

playground/playground.css

@@ -48,7 +48,7 @@ body {
 }
 
 .menubar select {
-  margin-right: 15px;
+  margin: 10px;
   font-size: 16px;
   height: 25px;
 }
@@ -76,17 +76,11 @@ body {
 }
 
 .layout-selector {
-  font-size: 33px;
   cursor: pointer;
-  color: #cccccc;
-  transform: rotate(90deg);
-  padding: 0 5px;
+  padding: 5px;
+  margin: 5px;
 }
 
-.layout-selector.active {
-  font-weight: bold;
-  color: white;
-}
 /* TABBED EDITOR ****************************************/
 
 .tabbed-editor {

playground/templates.xml

@@ -17,8 +17,8 @@
               <t t-esc="sample.description"/>
             </option>
           </select>
-          <a class="btn flash" t-on-click="downloadCode" title="Download a Zip with this Code">↓</a>
-          <a class="layout-selector flash" t-att-class="{active:state.splitLayout}" t-on-click="toggleLayout" title="Toggle Layout">◫</a>
+          <a class="btn flash" t-on-click="downloadCode" title="Download a Zip with this Code"><i class="fas fa-download"></i></a>
+          <a class="layout-selector flash" t-on-click="toggleLayout" title="Toggle Layout"><i class="fas"  t-att-class="state.splitLayout ?  'fa-toggle-on' : 'fa-toggle-off'"></i></a>
         </div>
         <t t-if="!state.splitLayout">
           <t t-widget="TabbedEditor" t-props="{js:state.js, css:state.css, xml: state.xml, display: 'js|xml|css'}" t-on-updateCode="updateCode"/>