Skip to content

Commit 88a0201

Browse files
committed
style(chat): simplify suggestion copy and align hover with chat UI
Shorten follow-up and refresh labels across locales, and replace flashy suggestion card hovers with the same border, neutral background, and shadow treatment used elsewhere in the chat page.
1 parent a1d8f55 commit 88a0201

7 files changed

Lines changed: 46 additions & 99 deletions

File tree

frontend/src/components/chat/FollowUpSuggestions.vue

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -120,18 +120,19 @@ const dismiss = () => {
120120
gap: 12px;
121121
width: 100%;
122122
padding: 9px 11px;
123-
border: 1px solid transparent;
123+
border: 1px solid var(--td-component-stroke);
124124
border-radius: 8px;
125125
background: var(--td-bg-color-container);
126126
color: var(--td-text-color-primary);
127127
text-align: left;
128128
cursor: pointer;
129+
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
130+
transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
129131
}
130-
.follow-ups__item { transition: border-color .2s, box-shadow .2s, transform .2s; }
131132
.follow-ups__item:hover {
132133
border-color: var(--td-brand-color);
133-
box-shadow: 0 4px 14px rgba(0, 0, 0, .12);
134-
transform: translateY(-1px);
134+
background: var(--td-bg-color-container-hover);
135+
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
135136
}
136137
.follow-ups__item:hover .t-icon { color: var(--td-brand-color); }
137138
.is-spinning { animation: spin 1s linear infinite; }

frontend/src/components/css/suggested-questions.less

Lines changed: 7 additions & 63 deletions
Original file line numberDiff line numberDiff line change
@@ -68,7 +68,7 @@
6868
}
6969

7070
&:active:not(:disabled) {
71-
transform: scale(0.92);
71+
background: var(--td-bg-color-secondarycontainer);
7272
}
7373

7474
&:disabled {
@@ -114,63 +114,17 @@
114114
background: var(--td-bg-color-container);
115115
cursor: pointer;
116116
overflow: hidden;
117-
transition:
118-
background 0.25s @suggested-ease,
119-
border-color 0.25s @suggested-ease,
120-
box-shadow 0.25s @suggested-ease,
121-
transform 0.2s @suggested-ease;
122-
123-
// 左侧主题色渐隐高光,hover 时淡入,营造柔和的呼吸感
124-
&::before {
125-
content: "";
126-
position: absolute;
127-
inset: 0;
128-
border-radius: inherit;
129-
background: linear-gradient(
130-
105deg,
131-
var(--td-brand-color-light) 0%,
132-
transparent 55%
133-
);
134-
opacity: 0;
135-
transition: opacity 0.25s @suggested-ease;
136-
pointer-events: none;
137-
}
117+
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
118+
transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
138119

139120
&:not(.sq-card-skeleton):hover {
140-
border-color: var(--td-brand-color-light-active, var(--td-brand-color));
141-
background: var(--td-bg-color-container);
142-
box-shadow: 0 3px 10px -8px rgba(0, 0, 0, 0.14);
143-
transform: translateY(-1px);
144-
145-
&::before {
146-
opacity: 0.45;
147-
}
148-
}
149-
150-
// 右侧引导箭头:默认隐藏并向左收起,hover 时滑入
151-
&::after {
152-
content: "";
153-
position: relative;
154-
flex-shrink: 0;
155-
margin-left: -2px;
156-
font-size: 17px;
157-
line-height: 1;
158-
color: var(--td-brand-color);
159-
opacity: 0;
160-
transform: translateX(-6px);
161-
transition:
162-
opacity 0.25s @suggested-ease,
163-
transform 0.25s @suggested-ease;
121+
border-color: var(--td-brand-color);
122+
background: var(--td-bg-color-container-hover);
123+
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
164124
}
165125

166126
&:not(.sq-card-skeleton):active {
167-
transform: translateY(0) scale(0.99);
168-
box-shadow: 0 2px 8px -6px rgba(0, 0, 0, 0.2);
169-
}
170-
171-
&:not(.sq-card-skeleton):hover::after {
172-
opacity: 1;
173-
transform: translateX(0);
127+
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
174128
}
175129

176130
&.sq-card-skeleton {
@@ -196,11 +150,6 @@
196150
width: 210px;
197151
}
198152

199-
&::before,
200-
&::after {
201-
display: none;
202-
}
203-
204153
:deep(.t-skeleton) {
205154
width: 100%;
206155
}
@@ -226,11 +175,6 @@
226175
overflow: hidden;
227176
text-overflow: ellipsis;
228177
white-space: nowrap;
229-
transition: color 0.2s @suggested-ease;
230-
}
231-
232-
.suggested-question-card:not(.sq-card-skeleton):hover .suggested-question-text {
233-
color: var(--td-brand-color);
234178
}
235179

236180
.suggested-question-badge {

frontend/src/i18n/embed.ts

Lines changed: 18 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -76,10 +76,10 @@ const messages = {
7676
"title": "对话",
7777
"newChat": "新对话",
7878
"suggestedQuestions": "你可以这样问我",
79-
"suggestedQuestionsLoading": "正在加载推荐问题...",
80-
"followUpQuestions": "接下来可以继续问",
81-
"followUpQuestionsLoading": "整理后续问题",
82-
"refreshSuggestedQuestions": "换一批推荐问题",
79+
"suggestedQuestionsLoading": "加载中...",
80+
"followUpQuestions": "继续问",
81+
"followUpQuestionsLoading": "加载推荐问题",
82+
"refreshSuggestedQuestions": "换一批",
8383
"inputPlaceholder": "请输入您的消息...",
8484
"send": "发送",
8585
"thinking": "思考中...",
@@ -567,10 +567,10 @@ const messages = {
567567
"title": "Chat",
568568
"newChat": "New Chat",
569569
"suggestedQuestions": "You can ask me",
570-
"suggestedQuestionsLoading": "Loading suggestions...",
571-
"followUpQuestions": "Continue with a follow-up",
572-
"followUpQuestionsLoading": "Preparing follow-ups",
573-
"refreshSuggestedQuestions": "Refresh suggestions",
570+
"suggestedQuestionsLoading": "Loading...",
571+
"followUpQuestions": "Keep asking",
572+
"followUpQuestionsLoading": "Loading suggested questions",
573+
"refreshSuggestedQuestions": "More",
574574
"inputPlaceholder": "Enter your message...",
575575
"send": "Send",
576576
"thinking": "Thinking...",
@@ -1044,10 +1044,11 @@ const koEmbedPublish = {
10441044
},
10451045
chat: {
10461046
suggestedQuestions: '이렇게 물어보세요',
1047-
suggestedQuestionsLoading: '추천 질문 로딩 중...',
1048-
followUpQuestions: '이어서 질문해 보세요',
1049-
followUpQuestionsLoading: '후속 질문 준비 중',
1050-
refreshSuggestedQuestions: '추천 질문 새로고침',
1047+
suggestedQuestionsLoading: '로딩 중...',
1048+
followUpQuestions: '이어서 질문',
1049+
followUpQuestionsLoading: '추천 질문 로딩 중',
1050+
thinkingAlt: '생각 중',
1051+
refreshSuggestedQuestions: '다른 질문',
10511052
imageTooMany: '이미지는 최대 5장까지 업로드할 수 있습니다',
10521053
imageTypeSizeError: 'JPG/PNG/GIF/WEBP만 지원하며, 각 파일은 10MB 이하여야 합니다',
10531054
imageReadFailed: '이미지를 읽지 못했습니다',
@@ -1131,10 +1132,11 @@ const ruEmbedPublish = {
11311132
},
11321133
chat: {
11331134
suggestedQuestions: 'Вы можете спросить так',
1134-
suggestedQuestionsLoading: 'Загрузка предложений...',
1135-
followUpQuestions: 'Продолжите уточняющим вопросом',
1136-
followUpQuestionsLoading: 'Подготовка уточнений',
1137-
refreshSuggestedQuestions: 'Обновить предложения',
1135+
suggestedQuestionsLoading: 'Загрузка...',
1136+
followUpQuestions: 'Спрашивайте дальше',
1137+
followUpQuestionsLoading: 'Загрузка рекомендуемых вопросов',
1138+
thinkingAlt: 'Обдумывание...',
1139+
refreshSuggestedQuestions: 'Ещё',
11381140
imageTooMany: 'Можно загрузить не более 5 изображений',
11391141
imageTypeSizeError: 'Поддерживаются только JPG/PNG/GIF/WEBP, каждый файл до 10 МБ',
11401142
imageReadFailed: 'Не удалось прочитать изображение',

frontend/src/i18n/locales/en-US.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3132,10 +3132,10 @@ export default {
31323132
title: 'Chat',
31333133
newChat: 'New Chat',
31343134
suggestedQuestions: 'You can ask me',
3135-
followUpQuestions: 'Continue with a follow-up',
3136-
followUpQuestionsLoading: 'Preparing follow-ups',
3137-
suggestedQuestionsLoading: 'Loading suggestions...',
3138-
refreshSuggestedQuestions: 'Refresh suggestions',
3135+
followUpQuestions: 'Keep asking',
3136+
followUpQuestionsLoading: 'Loading suggested questions',
3137+
suggestedQuestionsLoading: 'Loading...',
3138+
refreshSuggestedQuestions: 'More',
31393139
inputPlaceholder: 'Enter your message...',
31403140
send: 'Send',
31413141
thinking: 'Thinking...',

frontend/src/i18n/locales/ko-KR.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -900,10 +900,10 @@ export default {
900900
title: "대화",
901901
newChat: "새 대화",
902902
suggestedQuestions: "이렇게 물어보세요",
903-
followUpQuestions: "이어서 질문해 보세요",
904-
followUpQuestionsLoading: "후속 질문 준비 중",
905-
suggestedQuestionsLoading: "추천 질문 로딩 중...",
906-
refreshSuggestedQuestions: "추천 질문 새로고침",
903+
followUpQuestions: "이어서 질문",
904+
followUpQuestionsLoading: "추천 질문 로딩 중",
905+
suggestedQuestionsLoading: "로딩 중...",
906+
refreshSuggestedQuestions: "다른 질문",
907907
inputPlaceholder: "메시지를 입력하세요...",
908908
send: "전송",
909909
thinking: "생각 중...",

frontend/src/i18n/locales/ru-RU.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3817,10 +3817,10 @@ export default {
38173817
title: 'Диалог',
38183818
newChat: 'Новый чат',
38193819
suggestedQuestions: 'Вы можете спросить меня',
3820-
followUpQuestions: 'Продолжите уточняющим вопросом',
3821-
followUpQuestionsLoading: 'Подготовка уточнений',
3822-
suggestedQuestionsLoading: 'Загрузка предложений...',
3823-
refreshSuggestedQuestions: 'Обновить предложения',
3820+
followUpQuestions: 'Спрашивайте дальше',
3821+
followUpQuestionsLoading: 'Загрузка рекомендуемых вопросов',
3822+
suggestedQuestionsLoading: 'Загрузка...',
3823+
refreshSuggestedQuestions: 'Ещё',
38243824
inputPlaceholder: 'Введите ваше сообщение...',
38253825
send: 'Отправить',
38263826
thinking: 'Думаю...',

frontend/src/i18n/locales/zh-CN.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -898,10 +898,10 @@ export default {
898898
title: "对话",
899899
newChat: "新对话",
900900
suggestedQuestions: "你可以这样问我",
901-
followUpQuestions: "接下来可以继续问",
902-
followUpQuestionsLoading: "整理后续问题",
903-
suggestedQuestionsLoading: "正在加载推荐问题...",
904-
refreshSuggestedQuestions: "换一批推荐问题",
901+
followUpQuestions: "继续问",
902+
followUpQuestionsLoading: "加载推荐问题",
903+
suggestedQuestionsLoading: "加载中...",
904+
refreshSuggestedQuestions: "换一批",
905905
inputPlaceholder: "请输入您的消息...",
906906
send: "发送",
907907
thinking: "思考中...",

0 commit comments

Comments
 (0)