Переглянути джерело

feat: 调整对话界面的样式

主要涉及到要素之间的距离
zhupei@smartai.com 1 рік тому
батько
коміт
7bd19e03e6

+ 1 - 1
src/modules/conversation-chat/DialogItem.vue

@@ -109,6 +109,6 @@ const handleSelectChat = () => {
 <style lang="css" scoped>
 .dialog-item-container {
   margin-top: 10px;
-  margin-bottom: 10px;
+  margin-bottom: 35px;
 }
 </style>

+ 2 - 2
src/modules/conversation-content/DialogContent.vue

@@ -52,8 +52,8 @@ const custom_style = computed(() => {
 .dialog-chat-answer-content {
   background-color: var(--color-bg-1);
   color: var(--color-text-1);
-  border-radius: 10px;
-  padding: 18px;
+  border-radius: 12px;
+  padding: 31px;
   /* box-shadow: 0 0 5px #dedede; */
   /* box-shadow: 0 0 5px var(--color-text-4); */
 }

+ 1 - 1
src/modules/conversation-item/DialogAnswer.vue

@@ -283,7 +283,7 @@ onMounted(() => {
 }
 
 .answer-icon {
-  margin-right: 5px;
+  margin-right: 22px;
 }
 .answer-icon img {
   width: 100%;

+ 1 - 1
src/modules/conversation-item/DialogQuestion.vue

@@ -78,7 +78,7 @@ const handleSelectChange = () => {
   color: #fff;
 }
 .question-icon {
-  margin-left: 5px;
+  margin-left: 22px;
 }
 
 .question-icon img {

+ 5 - 1
src/views/conversation/ConversationChatContainer.vue

@@ -753,7 +753,9 @@ onUnmounted(() => {
   margin-left: auto;
   margin-right: auto;
 
-  height: 100%;
+  height: calc(100% - 52px);
+
+  padding-top: 52px;
 }
 
 .conversation-chat-left {
@@ -783,6 +785,8 @@ onUnmounted(() => {
   flex-direction: column;
 
   overflow: hidden;
+
+  padding-top: 8px;
 }
 .conversation-chat-main-container {
   /* height: 80%; */