Merge pull request #1340 from weseek/i18n-customize-layout

I18n customize layout(英⇨日)

resource/locales/en-US/translation.json

@@ -649,6 +649,7 @@
   },
 
   "customize_page": {
+    "recommended":"Recommended",
     "Behavior": "Behavior",
     "Layout": "Layout",
     "Function": "Function",
@@ -679,7 +680,21 @@
     "recently_created_n_draft_num_desc": "Number of recently created pages and drafts displayed on user page",
     "update_layout_success": "Succeeded to update layout",
     "update_behavior_success": "Succeeded to update behavior",
-    "update_function_success": "Succeeded to update function"
+    "update_function_success": "Succeeded to update function",
+    "layout_description":{
+      "growi_title":"Simple and Clear",
+      "growi_text1":"Full screen layout and thin margins/paddings",
+      "growi_text2":"Show and post comments at the bottom of the page",
+      "growi_text3":"Affix Table-of-contents",
+      "kibela_title":"Easy Viewing Structure",
+      "kibela_text1":"Center aligned contents",
+      "kibela_text2":"Show and post comments at the bottom of the page",
+      "kibela_text3":"Affix Table-of-contents",
+      "crowi_title":"Separated Functions",
+      "crowi_text1":"Collapsible Sidebar",
+      "crowi_text2":"Show and post comments in Sidebar",
+      "crowi_text3":"Collapsible Table-of-contents"
+    }
   },
 
   "user_management": {

resource/locales/ja/translation.json

@@ -633,7 +633,8 @@
   },
 
   "customize_page": {
-    "Behavior": "挙動",
+    "recommended":"おすすめ",
+    "Behavior": "動作",
     "Layout": "レイアウト",
     "Function": "機能",
     "function_choose": "機能の有効/無効を選択できます。",
@@ -662,8 +663,22 @@
     "recent_created__n_draft_num_desc": "最近作成したページと下書きの表示数",
     "recently_created_n_draft_num_desc": "ホーム画面の Recently Created での、1ページの表示数を設定します。",
     "update_layout_success": "レイアウトを更新しました",
-    "update_behavior_success": "挙動を更新しました",
-    "update_function_success": "機能を更新しました"
+    "update_behavior_success": "動作を更新しました",
+    "update_function_success": "機能を更新しました",
+    "layout_description":{
+      "growi_title":"シンプル・明瞭",
+      "growi_text1":"全画面レイアウトで、余白は少なくなります。",
+      "growi_text2":"コメントはページの下部に表示されます。",
+      "growi_text3":"ページ情報は下部に表示されます。",
+      "kibela_title":"閲覧重視の構造",
+      "kibela_text1":"コンテンツが中心に表示されます。",
+      "kibela_text2":"コメントはページの下部に表示されます。",
+      "kibela_text3":"ページ情報は下部に表示されます。",
+      "crowi_title":"ビュー・コントロールの分離",
+      "crowi_text1":"サイドバーを開くと情報が表示されます。",
+      "crowi_text2":"コメントはサイドバーに表示されます。",
+      "crowi_text3":"ページ情報はサイドバーに表示されます。"
+    }
   },
 
   "user_management": {

src/client/js/components/Admin/Customize/CustomizeLayoutOptions.jsx

@@ -11,7 +11,7 @@ import CustomizeLayoutOption from './CustomizeLayoutOption';
 class CustomizeLayoutOptions extends React.Component {
 
   render() {
-    const { adminCustomizeContainer } = this.props;
+    const { t, adminCustomizeContainer } = this.props;
 
     return (
       <div className="row">
@@ -20,14 +20,13 @@ class CustomizeLayoutOptions extends React.Component {
             layoutType="crowi-plus"
             isSelected={adminCustomizeContainer.state.currentLayout === 'growi'}
             onSelected={() => adminCustomizeContainer.switchLayoutType('growi')}
-            labelHtml={'GROWI Enhanced Layout <small class="text-success">(Recommended)</small>'}
+            labelHtml={`GROWI Enhanced Layout <small class="text-success">${t('customize_page.recommended')}</small>`}
           >
-            {/* TODO i18n */}
-            <h4>Simple and Clear</h4>
+            <h4>{t('customize_page.layout_description.growi_title')}</h4>
             <ul>
-              <li>Full screen layout and thin margins/paddings</li>
-              <li>Show and post comments at the bottom of the page</li>
-              <li>Affix Table-of-contents</li>
+              <li>{t('customize_page.layout_description.growi_text1')}</li>
+              <li>{t('customize_page.layout_description.growi_text2')}</li>
+              <li>{t('customize_page.layout_description.growi_text3')}</li>
             </ul>
           </CustomizeLayoutOption>
         </div>
@@ -39,12 +38,11 @@ class CustomizeLayoutOptions extends React.Component {
             onSelected={() => adminCustomizeContainer.switchLayoutType('kibela')}
             labelHtml="Kibela Like Layout"
           >
-            {/* TODO i18n */}
-            <h4>Easy Viewing Structure</h4>
+            <h4>{t('customize_page.layout_description.kibela_title')}</h4>
             <ul>
-              <li>Center aligned contents</li>
-              <li>Show and post comments at the bottom of the page</li>
-              <li>Affix Table-of-contents</li>
+              <li>{t('customize_page.layout_description.kibela_text1')}</li>
+              <li>{t('customize_page.layout_description.kibela_text2')}</li>
+              <li>{t('customize_page.layout_description.kibela_text3')}</li>
             </ul>
           </CustomizeLayoutOption>
         </div>
@@ -56,12 +54,11 @@ class CustomizeLayoutOptions extends React.Component {
             onSelected={() => adminCustomizeContainer.switchLayoutType('crowi')}
             labelHtml="Crowi Classic Layout"
           >
-            {/* TODO i18n */}
-            <h4>Separated Functions</h4>
+            <h4>{t('customize_page.layout_description.crowi_title')}</h4>
             <ul>
-              <li>Collapsible Sidebar</li>
-              <li>Show and post comments in Sidebar</li>
-              <li>Collapsible Table-of-contents</li>
+              <li>{t('customize_page.layout_description.crowi_text1')}</li>
+              <li>{t('customize_page.layout_description.crowi_text2')}</li>
+              <li>{t('customize_page.layout_description.crowi_text3')}</li>
             </ul>
           </CustomizeLayoutOption>
         </div>