fix(adev): 翻译文档框架

Author: asnowwolf

adev/BUILD.bazel

@@ -25,6 +25,8 @@ APPLICATION_FILES = [
     "//adev/src/assets:content",
     "//adev/src/assets:context",
     "//adev/src/content/examples:embeddable",
+    "//adev/src/assets/css",
+    "//adev/src/assets/fonts",
 ] + glob(
     ["src/**/*"],
     exclude = ["src/**/*.spec.ts"],

adev/angular.json

@@ -46,7 +46,8 @@
           },
           "configurations": {
             "production": {
-              "outputHashing": "all"
+              "outputHashing": "all",
+              "ssr": false
             },
             "development": {
               "optimization": false,

adev/shared-docs/components/cookie-popup/cookie-popup.component.html

@@ -1,21 +1,21 @@
 @if (!hasAccepted()) {
 <div class="docs-cookies-popup docs-invert-mode">
-  <p>This site uses cookies from Google to deliver its services and to analyze traffic.</p>
+  <p>本网站使用 Google 的 Cookie 来提供服务并分析流量。</p>
 
   <div>
     <a href="https://policies.google.com/technologies/cookies" target="_blank" rel="noopener">
-      <button class="docs-primary-btn" [attr.text]="'Learn more'" aria-label="Learn More">
-        Learn more
+      <button class="docs-primary-btn" [attr.text]="'了解更多'" aria-label="了解更多">
+        了解更多
       </button>
     </a>
     <button
       type="button"
       (click)="accept()"
       class="docs-primary-btn"
-      [attr.text]="'Ok, Got it'"
-      aria-label="Ok, Got it"
+      [attr.text]="'好的，我知道了'"
+      aria-label="好的，我知道了"
     >
-      Ok, Got it
+      好的，我知道了
     </button>
   </div>
 </div>

adev/shared-docs/components/navigation-list/navigation-list.component.html

@@ -75,7 +75,7 @@
             <button
               type="button"
               (click)="toggle(item)"
-              [attr.aria-label]="(item.isExpanded ? 'Collapse' : 'Expand') + ' ' + item.label"
+              [attr.aria-label]="(item.isExpanded ? '收起' : '展开') + ' ' + item.label"
               [attr.aria-expanded]="item.isExpanded"
               class="docs-secondary-nav-button"
               [class.docs-faceted-list-item-active]="item | isActiveNavigationItem: activeItem()"
@@ -111,8 +111,8 @@
 
 <ng-template let-item #itemStatus>
   @if (item.status === 'new') {
-    <span class="tag docs-new-item">New</span>
+    <span class="tag docs-new-item">新增</span>
   } @else if (item.status === 'updated') {
-    <span class="tag docs-updated-item">Updated</span>
+    <span class="tag docs-updated-item">已更新</span>
   }
 </ng-template>

adev/shared-docs/components/search-dialog/search-dialog.component.html

@@ -4,9 +4,9 @@
       [autofocus]="true"
       [hideIcon]="true"
       [formControl]="searchControl"
-      [resetLabel]="'Clear the search'"
+      [resetLabel]="'清除搜索'"
       class="docs-search-input"
-      placeholder="Search docs"
+      placeholder="搜索文档"
     />
 
     @if (searchResults().length) {
@@ -51,11 +51,11 @@
       <div class="docs-search-results docs-mini-scroll-track">
         @if (!resultsResource.hasValue()) {
           <div class="docs-search-results__start-typing">
-            <span>Start typing to see results</span>
+            <span>开始输入以查看结果</span>
           </div>
         } @else if (searchResults().length === 0) {
           <div class="docs-search-results__no-results">
-            <span>No results found</span>
+            <span>未找到结果</span>
           </div>
         }
       </div>
@@ -64,8 +64,9 @@
     <div class="docs-search-footer">
       <ul class="docs-search-commands">
         <li>
+          按
           <kbd class="docs-search-commands-key">
-            <svg width="15" height="15" aria-label="Enter key" role="img">
+            <svg width="15" height="15" aria-label="回车键" role="img">
               <g
                 fill="none"
                 stroke="currentColor"
@@ -77,11 +78,12 @@
               </g>
             </svg>
           </kbd>
-          <span>to select</span>
+          <span>选取</span>
         </li>
         <li>
+          按
           <kbd class="docs-search-commands-key">
-            <svg width="15" height="15" aria-label="Arrow down" role="img">
+            <svg width="15" height="15" aria-label="向下箭头" role="img">
               <g
                 fill="none"
                 stroke="currentColor"
@@ -94,7 +96,7 @@
             </svg>
           </kbd>
           <kbd class="docs-search-commands-key">
-            <svg width="15" height="15" aria-label="Arrow up" role="img">
+            <svg width="15" height="15" aria-label="向上箭头" role="img">
               <g
                 fill="none"
                 stroke="currentColor"
@@ -106,11 +108,11 @@
               </g>
             </svg>
           </kbd>
-          <span>to navigate</span>
+          <span>导航</span>
         </li>
         <li>
           <kbd class="docs-search-commands-key"
-            ><svg width="15" height="15" aria-label="Escape key" role="img">
+            ><svg width="15" height="15" aria-label="Escape 键" role="img">
               <g
                 fill="none"
                 stroke="currentColor"
@@ -124,18 +126,19 @@
               </g>
             </svg>
           </kbd>
-          <span>to close</span>
+          <span>关闭</span>
         </li>
       </ul>
       <div class="docs-algolia">
-        <span>Search by</span>
+        <span>由</span>
         <a
           target="_blank"
           rel="noopener"
           href="https://www.algolia.com/developers/?utm_source=angular.dev&utm_medium=referral&utm_content=powered_by&utm_campaign=docsearch"
         >
           <docs-algolia-icon />
         </a>
+        <span>提供搜索支持</span>
       </div>
     </div>
   </div>

adev/shared-docs/components/search-history/search-history.component.html

@@ -1,7 +1,7 @@
 @let items = history.items();
 
 @if (items.recent.length) {
-  <p class="title">Recent</p>
+  <p class="title">最近</p>
   <ul class="history-results recent">
     @for (item of items.recent; track item.id; let idx = $index) {
       <li docsSearchItem [item]="item" (mouseenter)="onMouseEnter($event, idx)">
@@ -18,15 +18,15 @@
           type="button"
           class="fav-btn"
           (click)="history.makeFavorite(item)"
-          title="Make favorite"
+          title="收藏"
         >
           <i role="presentation" class="material-symbols-outlined" aria-hidden="true"> star </i>
         </button>
         <button
           type="button"
           class="remove-btn"
           (click)="history.removeItem(item)"
-          title="Remove item"
+          title="移除"
         >
           <i role="presentation" class="material-symbols-outlined" aria-hidden="true"> close </i>
         </button>
@@ -36,7 +36,7 @@
 }
 
 @if (items.favorite.length) {
-  <p class="title">Favorite</p>
+  <p class="title">收藏</p>
   <ul class="history-results favorite">
     @for (item of items.favorite; track item.id; let idx = $index) {
       <li
@@ -56,7 +56,7 @@
           type="button"
           class="remove-btn"
           (click)="history.removeItem(item)"
-          title="Remove item"
+          title="移除"
         >
           <i role="presentation" class="material-symbols-outlined" aria-hidden="true"> close </i>
         </button>

adev/shared-docs/components/table-of-contents/table-of-contents.component.html

@@ -1,7 +1,7 @@
 <aside>
   <nav>
     <header>
-      <h2 class="docs-title">On this page</h2>
+      <h2 class="docs-title">在本页中</h2>
     </header>
     <ul class="docs-faceted-list">
       <!-- TODO: Hide li elements with class docs-toc-item-h3 for laptop, table and phone screen resolutions  -->
@@ -18,6 +18,6 @@ <h2 class="docs-title">On this page</h2>
   </nav>
   <button type="button" (click)="scrollToTop()">
     <docs-icon role="presentation">arrow_upward_alt</docs-icon>
-    Back to the top
+    返回顶部
   </button>
-</aside>
+</aside>

adev/shared-docs/components/viewers/example-viewer/example-viewer.component.html

@@ -23,19 +23,19 @@
         role="switch"
         class="docs-example-code-toggle"
         [attr.aria-checked]="showCode()"
-        [attr.aria-label]="showCode() ? 'Hide code' : 'Show code'"
+        [attr.aria-label]="showCode() ? '隐藏代码' : '显示代码'"
         (click)="showCode.set(!showCode())"
-        [matTooltip]="showCode() ? 'Hide code' : 'Show code'"
+        [matTooltip]="showCode() ? '隐藏代码' : '显示代码'"
         matTooltipPosition="above"
       >
         <docs-icon>{{showCode() ? 'code_off' : 'code'}}</docs-icon>
       </button>
       <button
         type="button"
         class="docs-example-copy-link"
-        [attr.aria-label]="'Copy link to ' + exampleMetadata()?.title + ' example to the clipboard'"
+        [attr.aria-label]="'将 ' + exampleMetadata()?.title + ' 示例的链接复制到剪贴板'"
         (click)="copyLink()"
-        matTooltip="Copy link to example"
+        matTooltip="复制示例链接"
         matTooltipPosition="above"
       >
         <i aria-hidden="true">
@@ -60,8 +60,8 @@
         <button
           type="button"
           (click)="toggleExampleVisibility()"
-          [attr.aria-label]="(expanded() ? 'Collapse' : 'Expand') + ' code example'"
-          matTooltip="{{ expanded() ? 'Collapse' : 'Expand' }} example"
+          [attr.aria-label]="(expanded() ? '收起' : '展开') + ' 代码示例'"
+          matTooltip="{{ expanded() ? '收起' : '展开' }}示例"
           matTooltipPosition="above"
         >
           <i aria-hidden="true">
@@ -123,8 +123,8 @@
           [href]="githubUrl()"
           target="_blank"
           class="docs-example-github-link"
-          aria-label="Open example on GitHub"
-          matTooltip="Open example on GitHub"
+          aria-label="在 GitHub 上打开示例"
+          matTooltip="在 GitHub 上打开示例"
           matTooltipPosition="above"
         >
           <i aria-hidden="true">
@@ -151,8 +151,8 @@
           [href]="stackblitzUrl()"
           target="_blank"
           class="docs-example-stackblitz-link"
-          aria-label="Edit example in StackBlitz"
-          matTooltip="Edit example in StackBlitz"
+          aria-label="在 StackBlitz 中编辑示例"
+          matTooltip="在 StackBlitz 中编辑示例"
           matTooltipPosition="above"
         >
           <i aria-hidden="true">

adev/src/app/app.component.html

@@ -1,8 +1,8 @@
-<button (click)="focusFirstHeading()" class="adev-skip">Skip to main content</button>
+<button (click)="focusFirstHeading()" class="adev-skip">跳转到主要内容</button>
 
 @defer (when isBrowser) {
   <adev-progress-bar />
-  <docs-top-level-banner expiry="2024-12-10" id="state-of-js-2024" link="https://survey.devographics.com/en-US/survey/state-of-js/2024?source=angular_homepage" text="Share your experience with Angular in The State of JavaScript 2024 survey"  />
+  <docs-top-level-banner expiry="2024-12-10" id="state-of-js-2024" link="https://survey.devographics.com/en-US/survey/state-of-js/2024?source=angular_homepage" text="在 The State of JavaScript 2024 survey 中分享您的 Angular 体验"  />
 }
 
 <div class="adev-nav"></div>