This is an automated email from the ASF dual-hosted git repository.
shuai pushed a commit to branch test
in repository https://gitbox.apache.org/repos/asf/answer.git
The following commit(s) were added to refs/heads/test by this push:
new d088d37c fix: pinned styles adjusted, hover effect added to list,
footer spacing optimized
d088d37c is described below
commit d088d37ca2d563f6c9db8964f9403085f3490048
Author: shuai <[email protected]>
AuthorDate: Mon Feb 24 11:39:38 2025 +0800
fix: pinned styles adjusted, hover effect added to list, footer spacing
optimized
---
ui/src/components/Counts/index.tsx | 2 +-
ui/src/components/Footer/index.tsx | 4 ++--
ui/src/components/PinList/index.tsx | 25 +++++++++++-----------
ui/src/components/QuestionList/index.tsx | 13 ++++++-----
ui/src/pages/Admin/Answers/index.tsx | 5 +++--
ui/src/pages/Admin/Questions/index.tsx | 5 +++--
ui/src/pages/Admin/Users/index.tsx | 5 +++--
.../Questions/Detail/components/Question/index.tsx | 17 +++++++++------
8 files changed, 41 insertions(+), 35 deletions(-)
diff --git a/ui/src/components/Counts/index.tsx
b/ui/src/components/Counts/index.tsx
index e83d1ee8..ade4fc51 100644
--- a/ui/src/components/Counts/index.tsx
+++ b/ui/src/components/Counts/index.tsx
@@ -69,7 +69,7 @@ const Index: FC<Props> = ({
{showAnswers && (
<div
className={`d-flex flex-shrink-0 align-items-center ms-3 ${
- isAccepted ? 'text-bg-success rounded-2 px-2 py-1 lh-1' : ''
+ isAccepted ? 'text-bg-success rounded-pill px-2 ' : ''
}`}>
{isAccepted ? (
<Icon name="check-circle-fill me-1" />
diff --git a/ui/src/components/Footer/index.tsx
b/ui/src/components/Footer/index.tsx
index d5aeaf03..a61ebe60 100644
--- a/ui/src/components/Footer/index.tsx
+++ b/ui/src/components/Footer/index.tsx
@@ -33,11 +33,11 @@ const Index = () => {
const cc = `${fullYear} ${siteName}`;
return (
- <footer className="bg-light">
+ <footer className="py-3 bg-light">
<Container>
<p className="text-center mb-0 small">
{/* Link to Terms of Service with right margin */}
- <Link to="/tos" className="me-2">
+ <Link to="/tos" className="me-3">
{t('label', { keyPrefix: 'admin.legal.terms_of_service' })}
</Link>
diff --git a/ui/src/components/PinList/index.tsx
b/ui/src/components/PinList/index.tsx
index a91dabd9..7907b462 100644
--- a/ui/src/components/PinList/index.tsx
+++ b/ui/src/components/PinList/index.tsx
@@ -18,7 +18,7 @@
*/
import { FC } from 'react';
-import { ListGroup, Stack, Card } from 'react-bootstrap';
+import { ListGroup, Stack } from 'react-bootstrap';
import { NavLink } from 'react-router-dom';
import { useTranslation } from 'react-i18next';
@@ -41,20 +41,21 @@ const PinList: FC<IProps> = ({ data }) => {
className="overflow-x-auto align-items-stretch">
{data.map((item) => {
return (
- <Card
+ <ListGroup.Item
+ action
+ as="li"
key={item.id}
+ className="rounded border-top p-3"
style={{
minWidth: '238px',
width: `${100 / data.length}%`,
}}>
- <Card.Body>
- <h6 className="text-wrap text-break">
- <NavLink
- to={pathFactory.questionLanding(item.id, item.url_title)}
- className="link-dark text-truncate-2">
- {item.title}
- {item.status === 2 ? ` [${t('closed')}]` : ''}
- </NavLink>
+ <NavLink
+ to={pathFactory.questionLanding(item.id, item.url_title)}
+ className="h-100 d-flex flex-column justify-content-between">
+ <h6 className="text-wrap link-dark text-break text-truncate-2">
+ {item.title}
+ {item.status === 2 ? ` [${t('closed')}]` : ''}
</h6>
<Counts
@@ -67,8 +68,8 @@ const PinList: FC<IProps> = ({ data }) => {
showViews={false}
className="mt-2 mt-md-0 small text-secondary"
/>
- </Card.Body>
- </Card>
+ </NavLink>
+ </ListGroup.Item>
);
})}
</Stack>
diff --git a/ui/src/components/QuestionList/index.tsx
b/ui/src/components/QuestionList/index.tsx
index 5399da70..dfcd8cb9 100644
--- a/ui/src/components/QuestionList/index.tsx
+++ b/ui/src/components/QuestionList/index.tsx
@@ -139,7 +139,10 @@ const QuestionList: FC<Props> = ({
return (
<ListGroup.Item
key={li.id}
- className="bg-transparent py-3 px-2 border-start-0
border-end-0">
+ action
+ as={NavLink}
+ to={pathFactory.questionLanding(li.id, li.url_title)}
+ className="py-3 px-2 border-start-0 border-end-0">
<div className="d-flex flex-wrap text-secondary small mb-12">
<BaseUserCard
data={li.operator}
@@ -160,12 +163,8 @@ const QuestionList: FC<Props> = ({
/>
</div>
<h5 className="text-wrap text-break">
- <NavLink
- to={pathFactory.questionLanding(li.id, li.url_title)}
- className="link-dark">
- {li.title}
- {li.status === 2 ? ` [${t('closed')}]` : ''}
- </NavLink>
+ {li.title}
+ {li.status === 2 ? ` [${t('closed')}]` : ''}
</h5>
{viewType === 'card' && (
<p
diff --git a/ui/src/pages/Admin/Answers/index.tsx
b/ui/src/pages/Admin/Answers/index.tsx
index 7ab2e80a..96598734 100644
--- a/ui/src/pages/Admin/Answers/index.tsx
+++ b/ui/src/pages/Admin/Answers/index.tsx
@@ -75,7 +75,8 @@ const Answers: FC = () => {
title: t('title', { keyPrefix: 'delete_permanently' }),
content: t('content', { keyPrefix: 'delete_permanently' }),
cancelBtnVariant: 'link',
- confirmText: t('ok', { keyPrefix: 'btns' }),
+ confirmText: t('delete', { keyPrefix: 'btns' }),
+ confirmBtnVariant: 'danger',
onConfirm: () => {
deletePermanently('answers').then(() => {
toastStore.getState().show({
@@ -104,7 +105,7 @@ const Answers: FC = () => {
sortKey="status"
i18nKeyPrefix="btns"
/>
- {curFilter === 'deleted' ? (
+ {curFilter === 'deleted' && count > 0 ? (
<Button
variant="outline-danger"
size="sm"
diff --git a/ui/src/pages/Admin/Questions/index.tsx
b/ui/src/pages/Admin/Questions/index.tsx
index 116984b2..e0456c2b 100644
--- a/ui/src/pages/Admin/Questions/index.tsx
+++ b/ui/src/pages/Admin/Questions/index.tsx
@@ -73,7 +73,8 @@ const Questions: FC = () => {
title: t('title', { keyPrefix: 'delete_permanently' }),
content: t('content', { keyPrefix: 'delete_permanently' }),
cancelBtnVariant: 'link',
- confirmText: t('ok', { keyPrefix: 'btns' }),
+ confirmText: t('delete', { keyPrefix: 'btns' }),
+ confirmBtnVariant: 'danger',
onConfirm: () => {
deletePermanently('questions').then(() => {
toastStore.getState().show({
@@ -102,7 +103,7 @@ const Questions: FC = () => {
sortKey="status"
i18nKeyPrefix="btns"
/>
- {curFilter === 'deleted' ? (
+ {curFilter === 'deleted' && count > 0 ? (
<Button
variant="outline-danger"
size="sm"
diff --git a/ui/src/pages/Admin/Users/index.tsx
b/ui/src/pages/Admin/Users/index.tsx
index f97a4b5e..fd9c81f3 100644
--- a/ui/src/pages/Admin/Users/index.tsx
+++ b/ui/src/pages/Admin/Users/index.tsx
@@ -158,7 +158,8 @@ const Users: FC = () => {
title: t('title', { keyPrefix: 'delete_permanently' }),
content: t('content', { keyPrefix: 'delete_permanently' }),
cancelBtnVariant: 'link',
- confirmText: t('ok', { keyPrefix: 'btns' }),
+ confirmText: t('delete', { keyPrefix: 'btns' }),
+ confirmBtnVariant: 'danger',
onConfirm: () => {
deletePermanently('users').then(() => {
toastStore.getState().show({
@@ -197,7 +198,7 @@ const Users: FC = () => {
sortKey="filter"
i18nKeyPrefix="admin.users"
/>
- {curFilter === 'deleted' ? (
+ {curFilter === 'deleted' && Number(data?.count) > 0 ? (
<Button
variant="outline-danger"
size="sm"
diff --git a/ui/src/pages/Questions/Detail/components/Question/index.tsx
b/ui/src/pages/Questions/Detail/components/Question/index.tsx
index 081c8759..86c1ba83 100644
--- a/ui/src/pages/Questions/Detail/components/Question/index.tsx
+++ b/ui/src/pages/Questions/Detail/components/Question/index.tsx
@@ -92,13 +92,6 @@ const Index: FC<Props> = ({ data, initPage, hasAnswer,
isLogged }) => {
return (
<div>
<h1 className="h3 mb-3 text-wrap text-break">
- {data?.pin === 2 && (
- <Icon
- name="pin-fill"
- className="me-1"
- title={t('pinned', { keyPrefix: 'btns' })}
- />
- )}
<Link
className="link-dark"
reloadDocument
@@ -111,6 +104,16 @@ const Index: FC<Props> = ({ data, initPage, hasAnswer,
isLogged }) => {
</h1>
<div className="d-flex flex-wrap align-items-center small mb-3
text-secondary">
+ {data?.pin === 2 && (
+ <div className="me-3">
+ <Icon
+ name="pin-fill"
+ className="me-1"
+ title={t('pinned', { keyPrefix: 'btns' })}
+ />
+ <span>{t('pinned', { keyPrefix: 'btns' })}</span>
+ </div>
+ )}
<FormatTime
time={data.create_time}
preFix={t('Asked')}
