diff --git a/resources/assets/sass/components/report.scss b/resources/assets/sass/components/report.scss
index a9d4d8c6b..2229dc4eb 100644
--- a/resources/assets/sass/components/report.scss
+++ b/resources/assets/sass/components/report.scss
@@ -197,7 +197,7 @@
 
         .ivu-radio-wrapper-checked:not(.ivu-radio-wrapper-disabled) {
             background: #fff !important;
-            color: #8BCF70 !important;
+            color: $primary-color !important;
             box-shadow: none !important;
             border: none !important;
             border-radius: 4px !important;
@@ -225,7 +225,7 @@
             background: #F4F5F7 !important;
             box-shadow: none !important;
             border: none !important;
-            color: #8BCF70 !important;
+            color: $primary-color !important;
             height: 36px;
             line-height: 34px;
 
diff --git a/resources/assets/sass/components/right-bottom.scss b/resources/assets/sass/components/right-bottom.scss
index 25eab9dde..399d332ca 100644
--- a/resources/assets/sass/components/right-bottom.scss
+++ b/resources/assets/sass/components/right-bottom.scss
@@ -18,8 +18,8 @@
         font-size: 14px;
         border-radius: 4px;
         color: #fff;
-        background-color: #8bcf70;
-        border-color: #8bcf70;
+        background-color: $primary-color;
+        border-color: $primary-color;
         &:hover {
             color: #fff;
             opacity: 0.9;
diff --git a/resources/assets/sass/dark.scss b/resources/assets/sass/dark.scss
index 15e492723..e33f12b04 100644
--- a/resources/assets/sass/dark.scss
+++ b/resources/assets/sass/dark.scss
@@ -192,7 +192,7 @@ body.dark-mode-reverse {
                     .dialog-view {
                         .dialog-head {
                             .dialog-content {
-                                background-color: #8bcf70;
+                                background-color: $primary-color;
                                 .content-text {
                                     > pre {
                                         a {
diff --git a/resources/assets/sass/pages/components/chat-input.scss b/resources/assets/sass/pages/components/chat-input.scss
index 8a419b271..f9ef3ee52 100755
--- a/resources/assets/sass/pages/components/chat-input.scss
+++ b/resources/assets/sass/pages/components/chat-input.scss
@@ -143,7 +143,7 @@
                     border-radius: 50%;
                     text-align: center;
                     color: #ffffff;
-                    background-color: #8bcf70;
+                    background-color: $primary-color;
                     overflow: hidden;
                 }
 
@@ -275,7 +275,7 @@
                 left: 2px;
                 z-index: 1;
                 border-radius: 50%;
-                background-color: #8bcf70;
+                background-color: $primary-color;
                 display: flex;
                 align-items: center;
                 justify-content: center;
diff --git a/resources/assets/sass/pages/components/dialog-wrapper.scss b/resources/assets/sass/pages/components/dialog-wrapper.scss
index 68d5ec816..67b12da21 100644
--- a/resources/assets/sass/pages/components/dialog-wrapper.scss
+++ b/resources/assets/sass/pages/components/dialog-wrapper.scss
@@ -140,7 +140,7 @@
                         padding: 0 6px;
                         border-radius: 4px;
                         margin-left: 10px;
-                        background-color: #8BCF70;
+                        background-color: $primary-color;
                         color: #FFFFFF;
                         text-align: center;
                         white-space: nowrap;
@@ -162,6 +162,10 @@
                             color: #888888;
                         }
                     }
+
+                    &.online {
+                        color: $primary-color;
+                    }
                 }
             }
         }
diff --git a/resources/assets/sass/pages/components/file-content.scss b/resources/assets/sass/pages/components/file-content.scss
index 9402403e3..79b891de4 100644
--- a/resources/assets/sass/pages/components/file-content.scss
+++ b/resources/assets/sass/pages/components/file-content.scss
@@ -105,7 +105,7 @@
                         line-height: 24px;
                         font-size: 12px;
                         border: 2px solid #ffffff;
-                        background-color: #8bcf70;
+                        background-color: $primary-color;
                         color: #ffffff;
                         z-index: 1;
                         border-radius: 50%;
diff --git a/resources/assets/sass/pages/components/project-log.scss b/resources/assets/sass/pages/components/project-log.scss
index 8ef767351..b15c09a59 100644
--- a/resources/assets/sass/pages/components/project-log.scss
+++ b/resources/assets/sass/pages/components/project-log.scss
@@ -164,7 +164,7 @@
                 &:hover {
                     opacity: 1;
                     > em {
-                        color: #8bcf70;
+                        color: $primary-color;
                     }
                 }
                 > em {
diff --git a/resources/assets/sass/pages/components/project-panel.scss b/resources/assets/sass/pages/components/project-panel.scss
index 95c72b22a..d5abf534e 100644
--- a/resources/assets/sass/pages/components/project-panel.scss
+++ b/resources/assets/sass/pages/components/project-panel.scss
@@ -33,7 +33,7 @@
                 padding: 0 6px;
                 margin-top: 3px;
                 margin-left: 10px;
-                background-color: #8BCF70;
+                background-color: $primary-color;
                 color:#FFFFFF;
                 text-align: center;
                 white-space: nowrap;
@@ -410,8 +410,8 @@
                                     line-height: 18px;
                                     padding: 0 3px;
                                     border-radius: 3px;
-                                    color: #8bcf70;
-                                    border: 1px solid #8bcf70;
+                                    color: $primary-color;
+                                    border: 1px solid $primary-color;
                                     margin-right: 4px;
                                     text-align: center;
                                     &.start {
@@ -695,7 +695,7 @@
                             transition: color .2s ease-in-out;
                             font-size: 16px;
                             &.on {
-                                color: #8bcf70
+                                color: $primary-color
                             }
                             &:hover {
                                 color: inherit
@@ -775,8 +775,8 @@
                                 line-height: 16px;
                                 padding: 0 2px;
                                 border-radius: 3px;
-                                color: #8bcf70;
-                                border: 1px solid #8bcf70;
+                                color: $primary-color;
+                                border: 1px solid $primary-color;
                                 display: inline-block;
                                 vertical-align: top;
                                 margin-top: 3px;
diff --git a/resources/assets/sass/pages/components/task-add.scss b/resources/assets/sass/pages/components/task-add.scss
index 10ebb31c0..713a1c810 100644
--- a/resources/assets/sass/pages/components/task-add.scss
+++ b/resources/assets/sass/pages/components/task-add.scss
@@ -141,7 +141,7 @@
                     min-width: 20px;
                     line-height: 20px;
                     border-radius: 10px;
-                    background: #8bcf70;
+                    background: $primary-color;
                     color: #fff;
                     text-align: center;
                     padding: 0 6px;
diff --git a/resources/assets/sass/pages/components/task-detail.scss b/resources/assets/sass/pages/components/task-detail.scss
index 5c90e6992..af2397e99 100644
--- a/resources/assets/sass/pages/components/task-detail.scss
+++ b/resources/assets/sass/pages/components/task-detail.scss
@@ -56,8 +56,8 @@
                     line-height: 24px;
                     padding: 0 8px;
                     border-radius: 4px;
-                    color: #8bcf70;
-                    border: 1px solid #8bcf70;
+                    color: $primary-color;
+                    border: 1px solid $primary-color;
                     display: inline-block;
                     text-align: center;
                     cursor: pointer;
@@ -142,7 +142,7 @@
                     align-items: center;
                     .ivu-icon {
                         font-size: 22px;
-                        color: #606266;
+                        color: $primary-text-color;
                     }
                 }
             }
@@ -351,8 +351,8 @@
                                     line-height: 16px;
                                     padding: 0 2px;
                                     border-radius: 3px;
-                                    color: #8bcf70;
-                                    border: 1px solid #8bcf70;
+                                    color: $primary-color;
+                                    border: 1px solid $primary-color;
                                     display: inline-block;
                                     margin-right: 3px;
                                     text-align: center;
diff --git a/resources/assets/sass/pages/page-dashboard.scss b/resources/assets/sass/pages/page-dashboard.scss
index c667b4565..16d20ee8b 100644
--- a/resources/assets/sass/pages/page-dashboard.scss
+++ b/resources/assets/sass/pages/page-dashboard.scss
@@ -180,8 +180,8 @@
                             line-height: 16px;
                             padding: 0 2px;
                             border-radius: 3px;
-                            color: #8bcf70;
-                            border: 1px solid #8bcf70;
+                            color: $primary-color;
+                            border: 1px solid $primary-color;
                             display: inline-block;
                             vertical-align: top;
                             margin-top: 3px;
diff --git a/resources/assets/sass/pages/page-file.scss b/resources/assets/sass/pages/page-file.scss
index d26d323f1..af088865c 100644
--- a/resources/assets/sass/pages/page-file.scss
+++ b/resources/assets/sass/pages/page-file.scss
@@ -46,8 +46,8 @@
                 cursor: pointer;
                 > button {
                     color: #ffffff;
-                    background: #8bcf70;
-                    border-color: #8bcf70;
+                    background: $primary-color;
+                    border-color: $primary-color;
                 }
             }
             .file-search {
@@ -502,7 +502,7 @@
             .title {
                 font-weight: 700;
                 font-size: 16px;
-                color: #303133;
+                color: $primary-title-color;
                 margin: 0;
                 > em {
                     padding-left: 4px;
@@ -517,7 +517,7 @@
                 font-size: 14px;
                 line-height: 21px;
                 margin: 12px 0 0;
-                color: #606266;
+                color: $primary-text-color;
                 max-height: 500px;
                 max-width: 100%;
                 overflow: auto;
diff --git a/resources/assets/sass/pages/page-index.scss b/resources/assets/sass/pages/page-index.scss
index 65f30ccbe..f6ee0fd45 100644
--- a/resources/assets/sass/pages/page-index.scss
+++ b/resources/assets/sass/pages/page-index.scss
@@ -12,7 +12,7 @@
 
         .page-header {
             width: 100%;
-            background: #8bcf70;
+            background: $primary-color;
             position: relative;
             padding-bottom: 40px;
 
diff --git a/resources/assets/sass/pages/page-manage.scss b/resources/assets/sass/pages/page-manage.scss
index 7a65a4cf9..a60f1fb5b 100644
--- a/resources/assets/sass/pages/page-manage.scss
+++ b/resources/assets/sass/pages/page-manage.scss
@@ -357,8 +357,8 @@
             line-height: 16px;
             padding: 0 2px;
             border-radius: 3px;
-            color: #8bcf70;
-            border: 1px solid #8bcf70;
+            color: $primary-color;
+            border: 1px solid $primary-color;
             margin-right: 6px;
             &.start {
                 background-color: rgba($flow-status-start-color, 0.1);