apply colors to bot type desc

resource/locales/ja_JP/admin/admin.json

@@ -270,7 +270,6 @@
       "difficult": "むずかしい",
       "possible": "可能",
       "impossible": "不可能"
-
     },
     "bot_reset_successful": "Botの設定を消去しました。",
     "copied_to_clipboard": "クリップボードにコピーされました。",

src/client/js/components/Admin/SlackIntegration/SlackIntegration.jsx

@@ -110,7 +110,7 @@ const SlackIntegration = (props) => {
     return <span>{t(`admin:slack_integration.selecting_bot_types.${label}`)}</span>;
   };
   const showBotTypeDiscription = (desc) => {
-    return <span className="text-blue">{t(`admin:slack_integration.selecting_bot_types.${desc}`)}</span>;
+    return <span className={`bot-type-disc-${desc}`}>{t(`admin:slack_integration.selecting_bot_types.${desc}`)}</span>;
   };
 
   return (
@@ -200,7 +200,7 @@ const SlackIntegration = (props) => {
                   <div className="mt-4">
                     <div className="d-flex justify-content-between mb-2">
                       {showBotTypeLabel('set_up_to_take_time')}
-                      {showBotTypeDiscription('easy')}
+                      {showBotTypeDiscription('normal')}
                     </div>
                     <div className="d-flex justify-content-between mb-2">
                       {showBotTypeLabel('integration_to_multi_workspaces')}
@@ -233,7 +233,7 @@ const SlackIntegration = (props) => {
                   <div className="mt-4">
                     <div className="d-flex justify-content-between mb-2">
                       {showBotTypeLabel('set_up_to_take_time')}
-                      {showBotTypeDiscription('easy')}
+                      {showBotTypeDiscription('difficult')}
                     </div>
                     <div className="d-flex justify-content-between mb-2">
                       {showBotTypeLabel('integration_to_multi_workspaces')}

src/client/styles/scss/_admin.scss

@@ -199,4 +199,19 @@
   .border-primary {
     border-width: 2px;
   }
+  .bot-type-disc-easy {
+    color: #33d541;
+  }
+  .bot-type-disc-normal {
+    color: #e6a63c;
+  }
+  .bot-type-disc-difficult {
+    color: #ff5757;
+  }
+  .bot-type-disc-possible {
+    color: #33d541;
+  }
+  .bot-type-disc-impossible {
+    color: #ff5757;
+  }
 }