lisonallen commited on
Commit
a99823b
·
1 Parent(s): 183a1ff

优化错误消息样式和处理逻辑,增强用户界面体验

Browse files
Files changed (1) hide show
  1. app.py +41 -32
app.py CHANGED
@@ -1133,56 +1133,65 @@ def make_custom_css():
1133
  /* 进度条样式增强 */
1134
  .progress-container {
1135
  margin-top: 10px;
1136
- margin-bottom: 10px;
1137
  }
1138
 
1139
  /* 错误消息样式 */
1140
- #error-message {
1141
- color: #ff4444;
1142
- font-weight: bold;
1143
- padding: 10px;
1144
- border-radius: 4px;
1145
- margin-top: 10px;
1146
- }
1147
-
1148
- /* 确保错误容器正确显示 */
1149
  .error-message {
1150
- background-color: rgba(255, 0, 0, 0.1);
1151
- padding: 10px;
1152
- border-radius: 4px;
1153
- margin-top: 10px;
1154
- border: 1px solid #ffcccc;
 
 
 
 
1155
  }
1156
 
1157
- /* 处理多语言错误消息 */
1158
- .error-msg-en, .error-msg-zh {
1159
- font-weight: bold;
 
 
 
1160
  }
1161
 
1162
- /* 错误图标 */
1163
  .error-icon {
1164
- color: #ff4444;
1165
- font-size: 18px;
1166
  margin-right: 8px;
 
1167
  }
1168
 
1169
- /* 确保空错误消息不显示背景和边框 */
1170
- #error-message:empty {
1171
- background-color: transparent;
1172
- border: none;
1173
- padding: 0;
1174
- margin: 0;
 
 
1175
  }
1176
 
1177
- /* 修复Gradio默认错误显示 */
1178
- .error {
 
1179
  display: none !important;
 
 
 
 
 
 
 
 
 
 
 
 
 
1180
  }
1181
  """
1182
 
1183
- # 合并CSS
1184
- combined_css = progress_bar_css + responsive_css
1185
- return combined_css
1186
 
1187
 
1188
  css = make_custom_css()
 
1133
  /* 进度条样式增强 */
1134
  .progress-container {
1135
  margin-top: 10px;
 
1136
  }
1137
 
1138
  /* 错误消息样式 */
 
 
 
 
 
 
 
 
 
1139
  .error-message {
1140
+ background-color: rgba(255, 220, 220, 0.95);
1141
+ border: 1px solid #ff0000;
1142
+ border-radius: 5px;
1143
+ padding: 12px 15px;
1144
+ margin: 15px 0;
1145
+ font-size: 15px;
1146
+ display: flex;
1147
+ flex-direction: column;
1148
+ gap: 4px;
1149
  }
1150
 
1151
+ .error-message:empty {
1152
+ display: none;
1153
+ background: none;
1154
+ border: none;
1155
+ padding: 0;
1156
+ margin: 0;
1157
  }
1158
 
 
1159
  .error-icon {
 
 
1160
  margin-right: 8px;
1161
+ font-size: 16px;
1162
  }
1163
 
1164
+ .error-msg-en, .error-msg-zh {
1165
+ padding: 4px 0;
1166
+ line-height: 1.4;
1167
+ }
1168
+
1169
+ /* 确保Gradio默认错误消息不与我们的冲突 */
1170
+ #custom-error-container + .error {
1171
+ display: none !important;
1172
  }
1173
 
1174
+ /* 空错误消息不显示 */
1175
+ #error-message:empty,
1176
+ #custom-error-container:empty {
1177
  display: none !important;
1178
+ background: none !important;
1179
+ border: none !important;
1180
+ padding: 0 !important;
1181
+ margin: 0 !important;
1182
+ }
1183
+
1184
+ /* 黑暗模式下的错误消息 */
1185
+ @media (prefers-color-scheme: dark) {
1186
+ .error-message {
1187
+ background-color: rgba(80, 0, 0, 0.95);
1188
+ border-color: #ff5555;
1189
+ color: #ffdddd;
1190
+ }
1191
  }
1192
  """
1193
 
1194
+ return progress_bar_css + responsive_css
 
 
1195
 
1196
 
1197
  css = make_custom_css()