fix: 聊天UI优化 #957

frontend_nuxt/assets/global.css

@@ -239,8 +239,16 @@ body {
 }
 
 .info-content-text img {
-  max-width: 100%;
+  max-width: 400px;
+  max-height: 600px;
   height: auto;
+  cursor: pointer;
+  box-shadow: 4px 12px 48px 0 rgba(0, 0, 0, 0.11);
+  transition: box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.info-content-text img:hover {
+  box-shadow: 4px 12px 48px 0 rgba(0, 0, 0, 0.35);
 }
 
 .info-content-text table {

frontend_nuxt/components/MessageEditor.vue

@@ -70,22 +70,6 @@ export default {
     onMounted(() => {
       vditorInstance.value = createVditor(editorId.value, {
         placeholder: '输入消息...',
-        toolbar: [
-          'emoji',
-          'bold',
-          'italic',
-          'strike',
-          'link',
-          '|',
-          'list',
-          '|',
-          'line',
-          'quote',
-          'code',
-          'inline-code',
-          '|',
-          'upload',
-        ],
         preview: {
           actions: [],
           markdown: { toc: false },
@@ -148,11 +132,17 @@ export default {
   border-radius: 8px;
 }
 
+.vditor {
+  min-height: 50px;
+  max-height: 150px;
+}
+
 .message-bottom-container {
   display: flex;
   flex-direction: row;
   justify-content: flex-end;
-  padding: 10px;
+  margin-top: 10px;
+  margin-bottom: 10px;
   background-color: var(--bg-color-soft);
   border-top: 1px solid var(--border-color);
   border-bottom-left-radius: 8px;
@@ -178,10 +168,4 @@ export default {
 .message-submit:not(.disabled):hover {
   background-color: var(--primary-color-hover);
 }
-
-.message-editor-container .vditor {
-  min-height: 80px;
-  max-height: 150px;
-  overflow-y: auto;
-}
 </style>

frontend_nuxt/pages/message-box/[id].vue

@@ -703,13 +703,6 @@ function goBack() {
   opacity: 0.5;
 }
 
-.info-content-text img,
-.reply-content img {
-  max-width: 600px;
-  width: 100%;
-  cursor: pointer;
-}
-
 .reply-btn {
   cursor: pointer;
   padding: 4px;