Merge pull request #37 from jasonkliu/14652_frontpage_style

Fix Firefox icon, onclick icon, whitespace

Author: brson

css/style.css

@@ -18,7 +18,8 @@
 }
 @font-face {
     font-family: 'fontello';
-    src: url('../fonts/fontello.svg?32953337#fontello') format('svg');
+    src: url('data:application/octet-stream;base64,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') format('woff'),
+    url('data:application/octet-stream;base64,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BkUrIyA8IC4jOLEmARQrLbA8LLEIBCVCsAAWsAQlsAQlIC5HI0cjYSCwBCNCsAZFKyCwYFBYILBAUVizAiADIBuzAiYDGllCQiMgR7AEQ7CAYmAgsAArIIqKYSCwAkNgZCOwA0NhZFBYsAJDYRuwA0NgWbADJbCAYmGwAiVGYTgjIDwjOBshICBGI0ewACsjYTghWbEmARQrLbA9LLAwKy6xJgEUKy2wPiywMSshIyAgPLAEI0IjOLEmARQrsARDLrAmKy2wPyywABUgR7AAI0KyAAEBFRQTLrAsKi2wQCywABUgR7AAI0KyAAEBFRQTLrAsKi2wQSyxAAEUE7AtKi2wQiywLyotsEMssAAWRSMgLiBGiiNhOLEmARQrLbBELLAII0KwQystsEUssgAAPCstsEYssgABPCstsEcssgEAPCstsEgssgEBPCstsEkssgAAPSstsEossgABPSstsEsssgEAPSstsEwssgEBPSstsE0ssgAAOSstsE4ssgABOSstsE8ssgEAOSstsFAssgEBOSstsFEssgAAOystsFIssgABOystsFMssgEAOystsFQssgEBOystsFUssgAAPistsFYssgABPistsFcssgEAPistsFgssgEBPistsFkssgAAOistsFossgABOistsFsssgEAOistsFwssgEBOistsF0ssDIrLrEmARQrLbBeLLAyK7A2Ky2wXyywMiuwNystsGAssAAWsDIrsDgrLbBhLLAzKy6xJgEUKy2wYiywMyuwNistsGMssDMrsDcrLbBkLLAzK7A4Ky2wZSywNCsusSYBFCstsGYssDQrsDYrLbBnLLA0K7A3Ky2waCywNCuwOCstsGkssDUrLrEmARQrLbBqLLA1K7A2Ky2wayywNSuwNystsGwssDUrsDgrLbBtLCuwCGWwAyRQeLABFTAtAAAAS7gAyFJYsQEBjlm5CAAIAGMgsAEjRLADI3CyBCgJRVJEsgoCByqxBgFEsSQBiFFYsECIWLEGA0SxJgGIUVi4BACIWLEGAURZWVlZuAH/hbAEjbEFAEQAAA==') format('truetype');
     font-weight: normal;
     font-style: normal;
 }

fonts/fontello.svg

@@ -10,19 +10,20 @@
           that runs blazingly fast,
           prevents almost all crashes<span class="asterisk">*</span>,
           and eliminates data races.
-		  <br/>
-		  <a href="http://doc.rust-lang.org/master/intro.html">Show me more!</a>
+          <br/>
+          <a href="http://doc.rust-lang.org/master/intro.html">Show me more!</a>
         </p>
       </div>
       <div class="col-md-4 install-box">
-          <span class="version-rec-box-inner">
-            Recommended Version:<br>
-            <span id="install-version">
-              nightly
-              (<span>source</span>)
-            </span>
+        <span class="version-rec-box-inner">
+          Recommended Version:<br>
+          <span id="install-version">
+            nightly
+            (<span>source</span>)
           </span>
-        <a class="btn btn-primary" id="inst-link" href="http://static.rust-lang.org/dist/rust-nightly.tar.gz">Install</a>
+        </span>
+        <a class="btn btn-primary" id="inst-link"
+            href="http://static.rust-lang.org/dist/rust-nightly.tar.gz">Install</a>
         <a class="btn btn-default" href="install.html" role="button">Other Downloads</a>
       </div>
     </div>
@@ -46,7 +47,7 @@ <h2>Featuring</h2>
       <div class="col-md-8">
         <div id="active-code">
           <button type="button" class="btn btn-primary btn-sm" id="run-code">Run</button>
-          <div id="editor">// This code is editable and runnable!
+<div id="editor">// This code is editable and runnable!
 fn main() {
     // A simple integer calculator:
     // `+` or `-` means add or subtract by 1
@@ -69,33 +70,33 @@ <h2>Featuring</h2>
               program, accumulator);
 }</div>
           <div id="result">
-            <a id="playlink" onclick="f1()" href="http://play.rust-lang.org/"><i class="icon-link-ext"></i></a>
+            <a id="playlink" onclick="goPlayground()" ><i class="icon-link-ext"></i></a>
           </div>
         </div>
         <div id="static-code">
-<pre class='rust'>
-<span class='kw'>fn</span> main() {
-    <span class='comment'>// A simple integer calculator:
-    // `+` or `-` means add or subtract by 1
-    // `*` or `/` means multiply or divide by 2</span>
-
-    <span class='kw'>let</span> program = <span class='string'>"+ + * - /"</span>;
-    <span class='kw'>let</span> <span class='kw'>mut</span> accumulator = <span class='number'>0</span>;
-
-    <span class='kw'>for</span> token in program.chars() {
-        <span class='kw'>match</span> token {
-            <span class='string'>'+'</span> => accumulator <span class='op'>+=</span> <span class='number'>1</span>,
-            <span class='string'>'-'</span> => accumulator <span class='op'>-=</span> <span class='number'>1</span>,
-            <span class='string'>'*'</span> => accumulator <span class='op'>*=</span> <span class='number'>2</span>,
-            <span class='string'>'/'</span> => accumulator <span class='op'>/=</span> <span class='number'>2</span>,
-            _ => { <span class='comment'>/* ignore everything else */</span> }
-        }
-    }
-
-    <span class='prelude-val'>println!</span>(<span class='string'>"The program \"{}\" calculates the value {}"</span>,
-           program, accumulator);
-}
-</pre>
+          <pre class='rust'>
+          <span class='kw'>fn</span> main() {
+              <span class='comment'>// A simple integer calculator:
+              // `+` or `-` means add or subtract by 1
+              // `*` or `/` means multiply or divide by 2</span>
+
+              <span class='kw'>let</span> program = <span class='string'>"+ + * - /"</span>;
+              <span class='kw'>let</span> <span class='kw'>mut</span> accumulator = <span class='number'>0</span>;
+
+              <span class='kw'>for</span> token in program.chars() {
+                  <span class='kw'>match</span> token {
+                      <span class='string'>'+'</span> => accumulator <span class='op'>+=</span> <span class='number'>1</span>,
+                      <span class='string'>'-'</span> => accumulator <span class='op'>-=</span> <span class='number'>1</span>,
+                      <span class='string'>'*'</span> => accumulator <span class='op'>*=</span> <span class='number'>2</span>,
+                      <span class='string'>'/'</span> => accumulator <span class='op'>/=</span> <span class='number'>2</span>,
+                      _ => { <span class='comment'>/* ignore everything else */</span> }
+                  }
+              }
+
+              <span class='prelude-val'>println!</span>(<span class='string'>"The program \"{}\" calculates the value {}"</span>,
+                     program, accumulator);
+          }
+          </pre>
         </div>
       </div>
     </div>

fonts/fontello.woff

@@ -122,11 +122,11 @@ function handleResult(statusCode, message) {
   }
 }
 
-// Called on successful program run: display output and link to playground
+// Called on successful program run: display output and playground icon
 function handleSuccess(message) {
   resultDiv.style.backgroundColor = successColor;
   var program = encodeURIComponent(editor.getValue());
-  playLink.href = "http://play.rust-lang.org/?code=" + program + "&run=1"
+  // playLink.href = "http://play.rust-lang.org/?code=" + program + "&run=1"
   // console.log(playLink.href);
   resultDiv.innerHTML = '';        // clear resultDiv, then add
   resultDiv.appendChild(playLink); // playLink icon and message
@@ -171,7 +171,7 @@ function handleProblem(message, problem) {
 
   // Setting message
   var program = encodeURIComponent(editor.getValue());
-  playLink.href = "http://play.rust-lang.org/?code=" + program + "&run=1"
+  // playLink.href = "http://play.rust-lang.org/?code=" + program + "&run=1"
   // console.log(playLink.href);
   resultDiv.innerHTML = '';        // clear resultDiv, then add
   resultDiv.appendChild(playLink); // playLink icon and error message
@@ -221,6 +221,14 @@ runButton.addEventListener("click", function(ev) {
   runProgram(program, handleResult);
 });
 
+// When clicking on the playground icon, navigate to the playground itself
+function goPlayground() {
+  var program = "http://play.rust-lang.org/?code=" +
+      encodeURIComponent(editor.getValue()) + "&run=1"
+  window.location = program
+  //  console.log(program);
+}
+
 // Highlight active line when focused
 editor.on('focus', function() {
   editor.setHighlightActiveLine(true);