p90524618
/
answer
mirror of https://gitee.com/answerdev/answer.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

refactor: responsive optimization

This commit is contained in:
robin 2022-10-14 17:30:16 +08:00
parent 6382c10e31
commit 868bdf09d4
1 changed files with 31 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

60
ui/src/components/Questions/index.tsx
View File

@ -32,7 +32,7 @@ const QuestionLastUpdate = ({ q }) => {
if (q.update_time > q.edit_time) {
// question answered
return (
<>
<div className="d-flex">
<BaseUserCard
data={q.last_answered_user_info}
showAvatar={false}
@ -44,14 +44,14 @@ const QuestionLastUpdate = ({ q }) => {
className="text-secondary mx-1"
preFix={t('answered')}
/>
</>
</div>
);
}
if (q.edit_time > q.update_time) {
// question modified
return (
<>
<div className="d-flex">
<BaseUserCard
data={q.update_user_info}
showAvatar={false}
@ -63,13 +63,13 @@ const QuestionLastUpdate = ({ q }) => {
className="text-secondary mx-1"
preFix={t('modified')}
/>
</>
</div>
);
}
// default: asked
return (
<>
<div className="d-flex">
<BaseUserCard data={q.user_info} showAvatar={false} className="me-1" />
•
<FormatTime
@ -77,7 +77,7 @@ const QuestionLastUpdate = ({ q }) => {
preFix={t('asked')}
className="text-secondary mx-1"
/>
</>
</div>
);
};
@ -131,31 +131,33 @@ const QuestionList: FC<Props> = ({ source }) => {
{li.status === 2 ? ` [${t('closed')}]` : ''}
</NavLink>
</h5>
<div className="d-flex align-items-center fs-14 text-secondary">
<div className="d-flex flex-column flex-md-row align-items-md-center fs-14 text-secondary">
<QuestionLastUpdate q={li} />
<span className="ms-3">
<Icon name="hand-thumbs-up-fill" />
<em className="fst-normal mx-1">{li.vote_count}</em>
</span>
<span
className={`ms-3 ${
li.accepted_answer_id >= 1 ? 'text-success' : ''
}`}>
<Icon
name={
li.accepted_answer_id >= 1
? 'check-circle-fill'
: 'chat-square-text-fill'
}
/>
<em className="fst-normal mx-1">{li.answer_count}</em>
</span>
<span className="summary-stat ms-3">
<Icon name="eye-fill" />
<em className="fst-normal mx-1">{li.view_count}</em>
</span>
<div className="ms-0 ms-md-3 mt-2 mt-md-0">
<span>
<Icon name="hand-thumbs-up-fill" />
<em className="fst-normal mx-1">{li.vote_count}</em>
</span>
<span
className={`ms-3 ${
li.accepted_answer_id >= 1 ? 'text-success' : ''
}`}>
<Icon
name={
li.accepted_answer_id >= 1
? 'check-circle-fill'
: 'chat-square-text-fill'
}
/>
<em className="fst-normal mx-1">{li.answer_count}</em>
</span>
<span className="summary-stat ms-3">
<Icon name="eye-fill" />
<em className="fst-normal mx-1">{li.view_count}</em>
</span>
</div>
</div>
<div className="question-tags mx-n1">
<div className="question-tags mx-n1 mt-2">
{Array.isArray(li.tags)
? li.tags.map((tag) => {
return (