Spaces:
Sleeping
Sleeping
Keldos
commited on
Commit
·
afdec9a
1
Parent(s):
41ff8f3
refractor: 调整亮暗色切换写法,适配gradio本意
Browse files- README.md +3 -3
- assets/custom.css +25 -27
- assets/custom.js +2 -1
README.md
CHANGED
@@ -17,9 +17,9 @@
|
|
17 |
<img alt="GitHub pull requests" src="https://img.shields.io/badge/Telegram-Group-blue.svg?logo=telegram" />
|
18 |
</a>
|
19 |
<p>
|
20 |
-
|
21 |
-
|
22 |
-
|
23 |
</p>
|
24 |
<a href="https://www.bilibili.com/video/BV1mo4y1r7eE"><strong>视频教程</strong></a>
|
25 |
·
|
|
|
17 |
<img alt="GitHub pull requests" src="https://img.shields.io/badge/Telegram-Group-blue.svg?logo=telegram" />
|
18 |
</a>
|
19 |
<p>
|
20 |
+
实时回复 / 无限对话 / 保存对话记录 / 预设Prompt集 / 联网搜索 / 根据文件回答 <br />
|
21 |
+
渲染LaTeX / 渲染表格 / 代码高亮 / 自动亮暗色切换 / 自适应输入框位置 / “小而美”的体验 <br />
|
22 |
+
自定义api-Host / 多API Key均衡负载 / 多用户显示 / 适配GPT-4
|
23 |
</p>
|
24 |
<a href="https://www.bilibili.com/video/BV1mo4y1r7eE"><strong>视频教程</strong></a>
|
25 |
·
|
assets/custom.css
CHANGED
@@ -65,9 +65,12 @@ footer {
|
|
65 |
color: var(--body-text-color-subdued);
|
66 |
}
|
67 |
|
68 |
-
#
|
69 |
transition: all 0.6s;
|
70 |
}
|
|
|
|
|
|
|
71 |
|
72 |
/* usage_display */
|
73 |
#usage_display {
|
@@ -127,36 +130,31 @@ ol:not(.options), ul:not(.options) {
|
|
127 |
padding-inline-start: 2em !important;
|
128 |
}
|
129 |
|
130 |
-
/*
|
131 |
-
|
132 |
-
|
133 |
-
|
134 |
-
|
135 |
-
|
136 |
-
|
137 |
-
|
138 |
-
|
139 |
-
|
140 |
-
background-color: #95EC69 !important;
|
141 |
-
}
|
142 |
}
|
143 |
/* 暗色 */
|
144 |
-
|
145 |
-
|
146 |
-
|
147 |
-
|
148 |
-
|
149 |
-
|
150 |
-
background-color: #2C2C2C !important;
|
151 |
-
}
|
152 |
-
[data-testid = "user"] {
|
153 |
-
background-color: #26B561 !important;
|
154 |
-
}
|
155 |
-
body {
|
156 |
-
background-color: var(--neutral-950) !important;
|
157 |
-
}
|
158 |
}
|
|
|
|
|
|
|
|
|
159 |
/* 屏幕宽度大于等于500px的设备 */
|
|
|
160 |
@media screen and (min-width: 500px) {
|
161 |
#chuanhu_chatbot {
|
162 |
height: calc(100vh - 200px);
|
|
|
65 |
color: var(--body-text-color-subdued);
|
66 |
}
|
67 |
|
68 |
+
#status_display {
|
69 |
transition: all 0.6s;
|
70 |
}
|
71 |
+
#chuanhu_chatbot {
|
72 |
+
transition: height 0.3s ease;
|
73 |
+
}
|
74 |
|
75 |
/* usage_display */
|
76 |
#usage_display {
|
|
|
130 |
padding-inline-start: 2em !important;
|
131 |
}
|
132 |
|
133 |
+
/* 亮色(默认) */
|
134 |
+
#chuanhu_chatbot {
|
135 |
+
background-color: var(--chatbot-color-light) !important;
|
136 |
+
color: #000000 !important;
|
137 |
+
}
|
138 |
+
[data-testid = "bot"] {
|
139 |
+
background-color: #FFFFFF !important;
|
140 |
+
}
|
141 |
+
[data-testid = "user"] {
|
142 |
+
background-color: #95EC69 !important;
|
|
|
|
|
143 |
}
|
144 |
/* 暗色 */
|
145 |
+
.dark #chuanhu_chatbot {
|
146 |
+
background-color: var(--chatbot-color-dark) !important;
|
147 |
+
color: #FFFFFF !important;
|
148 |
+
}
|
149 |
+
.dark [data-testid = "bot"] {
|
150 |
+
background-color: #2C2C2C !important;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
151 |
}
|
152 |
+
.dark [data-testid = "user"] {
|
153 |
+
background-color: #26B561 !important;
|
154 |
+
}
|
155 |
+
|
156 |
/* 屏幕宽度大于等于500px的设备 */
|
157 |
+
/* update on 2023.4.8: 高度的细致调整已写入JavaScript */
|
158 |
@media screen and (min-width: 500px) {
|
159 |
#chuanhu_chatbot {
|
160 |
height: calc(100vh - 200px);
|
assets/custom.js
CHANGED
@@ -161,9 +161,10 @@ function toggleDarkMode(isEnabled) {
|
|
161 |
gradioContainer = document.querySelector(".gradio-container");
|
162 |
if (isEnabled) {
|
163 |
gradioContainer.classList.add("dark");
|
164 |
-
document.body.style.
|
165 |
} else {
|
166 |
gradioContainer.classList.remove("dark");
|
|
|
167 |
}
|
168 |
}
|
169 |
function adjustDarkMode() {
|
|
|
161 |
gradioContainer = document.querySelector(".gradio-container");
|
162 |
if (isEnabled) {
|
163 |
gradioContainer.classList.add("dark");
|
164 |
+
document.body.style.setProperty("background-color", "var(--neutral-950)", "important");
|
165 |
} else {
|
166 |
gradioContainer.classList.remove("dark");
|
167 |
+
document.body.style.backgroundColor = "";
|
168 |
}
|
169 |
}
|
170 |
function adjustDarkMode() {
|