finished refactor chat page UI

web/src/assets/css/chat-plus.styl

@@ -114,10 +114,13 @@ $borderColor = #4676d0;
 
       .tool-box {
         display: flex;
-        justify-content: flex-end;
-        align-items: center;
-        padding 0 20px 10px 20px;
+        justify-content: center;
+        padding-top 12px
         border-top 1px solid #3c3c3c;
+
+        .iconfont {
+          margin-right 5px
+        }
       }
     }
 
@@ -126,52 +129,6 @@ $borderColor = #4676d0;
       --el-main-padding: 0;
       margin: 0;
 
-      .chat-head {
-        width: 100%;
-        height: 50px;
-        background-color: #28292A
-
-        .chat-config {
-          display flex
-          flex-direction row
-          align-items: center;
-          justify-content center;
-          padding-top 10px;
-
-          .role-select-label {
-            color #ffffff
-          }
-
-          .el-select {
-            max-width 150px;
-            margin-right 10px;
-          }
-
-          .role-select {
-            max-width 130px;
-          }
-
-          .el-button {
-            .el-icon {
-              margin-right 5px;
-            }
-          }
-        }
-
-        .iconfont {
-          margin-right 5px;
-        }
-
-        .is-circle {
-          margin-left 5px
-
-          .iconfont {
-            margin-right 0
-          }
-        }
-      }
-
-
       .chat-box {
         min-width: 0;
         flex: 1;
@@ -207,23 +164,6 @@ $borderColor = #4676d0;
             }
           }
 
-          .re-generate {
-            position: relative;
-            display: flex;
-            justify-content: center;
-
-            .btn-box {
-              position: absolute
-              bottom: 10px;
-
-              .el-button {
-                .el-icon {
-                  margin-right 5px;
-                }
-              }
-            }
-          }
-
           .input-box {
             background-color: #ffffff
             display: flex;
@@ -232,6 +172,26 @@ $borderColor = #4676d0;
             box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1);
             padding 0 15px;
 
+            .tool-item {
+              margin-right 15px
+              border-radius: 6px;
+              color: #19c37d;
+              display flex
+              justify-content center
+              justify-items center
+              padding 6px
+              cursor pointer
+              background #F2F2F2
+
+              &:hover {
+                background #D5FAD3
+              }
+
+              .iconfont {
+                font-size: 24px;
+              }
+            }
+
             .input-container {
               width 100%
               margin: 0;
@@ -242,7 +202,6 @@ $borderColor = #4676d0;
               position relative
 
               .el-textarea {
-
                 .el-textarea__inner::-webkit-scrollbar {
                   width: 0;
                   height: 0;
@@ -263,8 +222,6 @@ $borderColor = #4676d0;
                 .el-button {
                   padding 8px 5px;
                   border-radius 6px;
-                  background: rgb(25, 195, 125)
-                  color #ffffff;
                   font-size 20px;
                 }
               }

web/src/assets/css/home.styl

@@ -35,6 +35,23 @@
     }
 
     .navbar {
+      display flex
+      flex-flow row
+
+      .link-button {
+        margin-right 15px
+        color #e1e1e1
+        padding 0 10px
+
+        &:hover {
+          background-color #414141
+        }
+
+        .iconfont {
+          font-size 24px
+        }
+      }
+
       .user-info {
         width 100%
         padding 5px 0;
@@ -153,4 +170,18 @@
       background-color #f1f1f1
     }
   }
+
+  .user-info-menu {
+    li {
+      a {
+        width 100%
+        justify-content left
+
+        &:hover {
+          text-decoration none !important
+          color var(--el-primary-text-color)
+        }
+      }
+    }
+  }
 }

web/src/assets/iconfont/iconfont.css

@@ -1,8 +1,8 @@
 @font-face {
   font-family: "iconfont"; /* Project id 4125778 */
-  src: url('iconfont.woff2?t=1713766977199') format('woff2'),
-       url('iconfont.woff?t=1713766977199') format('woff'),
-       url('iconfont.ttf?t=1713766977199') format('truetype');
+  src: url('iconfont.woff2?t=1715938850931') format('woff2'),
+       url('iconfont.woff?t=1715938850931') format('woff'),
+       url('iconfont.ttf?t=1715938850931') format('truetype');
 }
 
 .iconfont {
@@ -13,6 +13,38 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-mic-bold:before {
+  content: "\e683";
+}
+
+.icon-mic-thin:before {
+  content: "\e8c2";
+}
+
+.icon-attachment-cl:before {
+  content: "\e66a";
+}
+
+.icon-attachment-st:before {
+  content: "\e63b";
+}
+
+.icon-speaker:before {
+  content: "\e607";
+}
+
+.icon-clear:before {
+  content: "\e900";
+}
+
+.icon-bbs:before {
+  content: "\e623";
+}
+
+.icon-license:before {
+  content: "\e65a";
+}
+
 .icon-more:before {
   content: "\e63c";
 }

web/src/assets/iconfont/iconfont.json

@@ -5,6 +5,62 @@
   "css_prefix_text": "icon-",
   "description": "",
   "glyphs": [
+    {
+      "icon_id": "6539424",
+      "name": "麦克风",
+      "font_class": "mic-bold",
+      "unicode": "e683",
+      "unicode_decimal": 59011
+    },
+    {
+      "icon_id": "1727442",
+      "name": "213麦克风",
+      "font_class": "mic-thin",
+      "unicode": "e8c2",
+      "unicode_decimal": 59586
+    },
+    {
+      "icon_id": "3730725",
+      "name": "attach-attachment-cl",
+      "font_class": "attachment-cl",
+      "unicode": "e66a",
+      "unicode_decimal": 58986
+    },
+    {
+      "icon_id": "15748474",
+      "name": "st-attachment",
+      "font_class": "attachment-st",
+      "unicode": "e63b",
+      "unicode_decimal": 58939
+    },
+    {
+      "icon_id": "1010",
+      "name": "扬声器",
+      "font_class": "speaker",
+      "unicode": "e607",
+      "unicode_decimal": 58887
+    },
+    {
+      "icon_id": "8094805",
+      "name": "clear",
+      "font_class": "clear",
+      "unicode": "e900",
+      "unicode_decimal": 59648
+    },
+    {
+      "icon_id": "34803640",
+      "name": "论坛",
+      "font_class": "bbs",
+      "unicode": "e623",
+      "unicode_decimal": 58915
+    },
+    {
+      "icon_id": "310708",
+      "name": "license",
+      "font_class": "license",
+      "unicode": "e65a",
+      "unicode_decimal": 58970
+    },
     {
       "icon_id": "1421807",
       "name": "更多",