From 822493735158b58b9df5db9e22a1a5c9f659a032 Mon Sep 17 00:00:00 2001
From: tiantian <1012874180@qq.com>
Date: Thu, 9 Jan 2025 11:42:35 +0800
Subject: [PATCH] change css
---
frontend/src/assets/chat.scss | 6 ++---
.../src/components/localchat/AiChatMain.vue | 3 ++-
frontend/src/components/setting/setStyle.css | 27 ++++++++++++++++++-
3 files changed, 30 insertions(+), 6 deletions(-)
diff --git a/frontend/src/assets/chat.scss b/frontend/src/assets/chat.scss
index 3a8e140..7e1f5ce 100644
--- a/frontend/src/assets/chat.scss
+++ b/frontend/src/assets/chat.scss
@@ -108,11 +108,9 @@
@media screen and (max-width: 768px) {
.chat-bot{
.input-area{
+ padding: 0;
.file-btn{
- margin-left: vw(-20);
- }
- .websearch-btn{
- margin-left: vw(-5);
+ margin-left: vw(-10);
}
}
}
diff --git a/frontend/src/components/localchat/AiChatMain.vue b/frontend/src/components/localchat/AiChatMain.vue
index 8512bd0..003564b 100644
--- a/frontend/src/components/localchat/AiChatMain.vue
+++ b/frontend/src/components/localchat/AiChatMain.vue
@@ -7,6 +7,7 @@ import { ElScrollbar } from "element-plus";
import { getSystemConfig } from "@/system/config";
import { Vue3Lottie } from "vue3-lottie";
import { file } from "jszip";
+import { isMobileDevice } from "@/util/device";
const chatStore = useAiChatStore();
const modelStore = useModelStore();
const isPadding = ref(false); //是否发送中
@@ -242,7 +243,7 @@ const uploadImage = async (event: any) => {
+ @keydown="handleKeydown" :autofocus="isMobileDevice() ? false : true" class="ai-input-area" />
diff --git a/frontend/src/components/setting/setStyle.css b/frontend/src/components/setting/setStyle.css
index f9ada8f..7629113 100644
--- a/frontend/src/components/setting/setStyle.css
+++ b/frontend/src/components/setting/setStyle.css
@@ -74,8 +74,33 @@
text-align: right;
}
@media screen and (max-width: 768px) {
+ .container {
+ flex-direction: column;
+ }
.nav {
- width: 25%;
+ background-color: #f9f9f9;
+ width: 100%;
+ }
+ .nav ul {
+ display: grid;
+ grid-template-columns: repeat(auto-fill, minmax(33.3%, 1fr));
+ }
+ .nav li {
+ padding: 10px 0;
+ text-align: center;
+ }
+ .nav li.active {
+ background-color: #fff;
+ }
+ .nav li.active:hover {
+ background-color: #fff;
+ }
+ .nav li.active::after {
+ background-color: #80bbe9;
+ }
+ .setting {
+ margin-top: 20px;
+ box-sizing: border-box;
}
.setting-item:first-child {
margin-top: 0px !important;