bugfix: 自动加空格时没有忽略html标签，导致界面混乱

public/docs/_includes/_side-nav.jade

@@ -83,7 +83,7 @@ nav.side-nav.l-pinned-left.l-layer-4.l-offset-nav
       .nav-ordered-lists(class="#{isCollapsed(anyItemSelected(basics))}")
         ul
           each item, index in basics
-            li(class="nav-list-item translated-cn #{item.class}"): a(href="#{item.href}" title="#{item.tooltip}") #{index + 1}. #{item.navTitle}
+            li(class="nav-list-item #{item.class}"): a(href="#{item.href}" title="#{item.tooltip}") #{index + 1}. #{item.navTitle}
 
     .nav-blocks
       a(class="nav-title #{anyItemSelected(guide)}" href="#{guide[0].href}" title="#{guide[0].tooltip}") 开发指南
@@ -92,7 +92,7 @@ nav.side-nav.l-pinned-left.l-layer-4.l-offset-nav
       .nav-unordered-lists(class="#{isCollapsed(anyItemSelected(guide))}")
         ul
           each item in guide
-            li(class="nav-list-item translated-cn #{item.class}"): a(href="#{item.href}" title="#{item.tooltip}") #{item.navTitle}
+            li(class="nav-list-item #{item.class}"): a(href="#{item.href}" title="#{item.tooltip}") #{item.navTitle}
 
     .nav-blocks
       a(class="nav-title #{anyItemSelected(cookbook)}" href="#{cookbook[0].href}" title="#{cookbook[0].tooltip}") 烹饪宝典
@@ -104,7 +104,7 @@ nav.side-nav.l-pinned-left.l-layer-4.l-offset-nav
             li(class="nav-list-item #{item.class}"): a(href="#{item.href}" title="#{item.tooltip}") #{item.navTitle}
 
     .nav-blocks
-      a(class="nav-title translated-cn #{isApiReferenceSelected()}" href="#{reference[0].href}" title="#{reference[0].tooltip}") API参考手册
+      a(class="nav-title #{isApiReferenceSelected()}" href="#{reference[0].href}" title="#{reference[0].tooltip}") API参考手册
 
 script.
   // Could put in appCtrl but only needed here and clear here

public/docs/ts/latest/guide/index.jade

@@ -31,22 +31,22 @@ figure
 // #enddocregion how-to-read-1
 // #docregion how-to-read-2
 - var top="vertical-align:top"
-table(width="100%")
+table.vertical-table(width="100%")
   col(width="15%")
   col
   tr(style=top)
-    td 
-      p <b>QuickStart</b>
-      p <b>快速起步</b>
+    th 
+      p QuickStart
+      p 快速起步
     td
       :marked
         The foundation for every chapter and sample in this documentation.
         
         本文档中每一个章节和范例的基础工作。
   tr(style=top)
-    td
-      p <b>Tutorial</b>
-      p <b>教程</b>
+    th
+      p Tutorial
+      p 教程
     td
       :marked
         A step-by-step, immersive approach to learning Angular that
@@ -54,36 +54,36 @@ table(width="100%")
         
         按部就班、沉浸式的Angular学习之旅，在应用场景中介绍了Angular的各个主要特性。
   tr(style=top)
-    td
-      p <b>Basics</b>
-      p <b>基础</b>
+    th
+      p Basics
+      p 基础
     td
       :marked
         The essential ingredients of Angular development.
         
         Angular开发中必不可少的要素。
   tr(style=top)
-    td
-      p <b>Developer Guide</b>
-      p <b>开发指南</b>
+    th
+      p Developer Guide
+      p 开发指南
     td
       :marked
         In-depth analysis of Angular features and development practices.
         
         深入分析Angular的特性和开发实践。
   tr(style=top)
-    td
-      p <b>Cookbook</b> 
-      p <b>烹饪宝典</b>
+    th
+      p Cookbook 
+      p 烹饪宝典
     td
       :marked
         Recipes for specific application challenges, mostly code snippets with a minimum of exposition.
         
         一组解决实际应用中某些特定挑战的食谱，大部分是代码片段，也有少量的详细阐述。
   tr(style=top)
-    td
-      p <b>API Reference</b> 
-      p <b>API 参考</b>
+    th
+      p API Reference 
+      p API参考手册
     td
       :marked
         Authoritative details about each member of the Angular libraries.

public/resources/css/_translate.scss

@@ -20,6 +20,9 @@ td, th {
     margin-left: 0.2em;
     margin-right: 0.2em;
   }
+  span[lang=english] {
+    display: inline-block;
+  }
 }
 
 .about-cn-translation {
@@ -32,3 +35,9 @@ td, th {
 body, .main-nav .main-nav-button,.translated-cn code {
   font-family: "Helvetica Neue", Arial, STHeiti, "Microsoft YaHei", sans-serif, Helvetica, "DroidSansFallback", FreeSans, Arimo, "Droid Sans", "wenquanyi micro hei", "Hiragino Sans GB", "Hiragino Sans GB W3" !important;
 }
+
+.vertical-table {
+  th {
+    white-space: nowrap;
+  }
+}

public/translate/cn/translate.js

@@ -62,7 +62,15 @@ var sourceVisible = localStorage.getItem('source-visible') === 'true';
     var nodes = document.querySelectorAll('.translated-cn');
     _.each(nodes, function (node) {
       var text = node.innerHTML;
-      text = text.replace(/([\x20-\xff]+)/g, '<span lang="english">$1</span>');
+      text = text.replace(/([\x20-\xff]+)/g, function (word) {
+        if (!word.replace(/\s/, '')) {
+          return '';
+        } else if (/<[^>]*>/.test(word)) {
+          return word;
+        } else {
+          return '<span lang="english">' + word + '</span>';
+        }
+      });
       node.innerHTML = text;
     });
   }