implemented the color info and accent for theme default

src/client/js/components/Page/NotFoundAlert.jsx

@@ -13,16 +13,16 @@ const NotFoundAlert = (props) => {
   }
 
   return (
-    <div className="grw-not-found-alert border m-4 p-4">
+    <div className="grw-not-found-alert m-4 p-4">
       <div className="col-md-12">
-        <h2 className="text-muted not-found-text">
+        <h2 className="not-found-alert-text lead">
           <i className="icon-info" aria-hidden="true"></i>
           {/* Todo make the message supported by i18n GW4050 */ }
           このページは存在しません。新たに作成する必要があります。
         </h2>
         <button
           type="button"
-          className="m-2 p-2"
+          className="m-2 p-2 btn create-page-btn"
           onClick={() => { clickHandler('edit') }}
         >
           <i className="icon-note icon-fw" />

src/client/styles/scss/theme/_apply-colors.scss

@@ -497,3 +497,18 @@ mark.rbt-highlight-text {
 .grw-btn-page-management:focus {
   background-color: rgba($color-link, 0.15);
 }
+
+/*
+ * Not Found Alert
+ */
+
+.grw-not-found-alert {
+  .not-found-alert-text {
+    color: $info;
+  }
+  .create-page-btn {
+    color: white;
+    background-color: $info;
+  }
+  border: 1px solid $info;
+}

src/client/styles/scss/theme/default.scss

@@ -110,6 +110,19 @@ html[light] {
       @include three-stranded-button($primary, lighten($primary, 65%), lighten($primary, 70%));
     }
   }
+
+  /*
+  * Not Found Alert
+  */
+  .grw-not-found-alert {
+    .not-found-alert-text {
+      color: $accent;
+    }
+    .create-page-btn {
+      background-color: $accent;
+    }
+    border: 1px solid $accent;
+  }
 }
 
 //== Dark Mode