fix: #977, normalize class name for Link

This commit is contained in:
haitao(lj) 2022-10-09 17:39:46 +08:00 committed by mingcheng
parent 13a7bffc74
commit 852756c9ba
19 changed files with 33 additions and 38 deletions

View File

@ -107,7 +107,7 @@ const Index: FC<Props> = ({ className, data }) => {
onClick={() => handleVote('up')}>
<Icon name="hand-thumbs-up-fill" />
</Button>
<Button variant="outline-secondary text-body" disabled>
<Button variant="outline-dark text-body" disabled>
{votes}
</Button>
<Button

View File

@ -17,7 +17,7 @@ const Index: FC<Props> = ({
className = 'fs-14',
}) => {
return (
<div className={`text-secondary ${className}`}>
<div className={`link-secondary ${className}`}>
{data?.status !== 'deleted' ? (
<Link to={`/users/${data?.username}`}>
{showAvatar && (

View File

@ -23,7 +23,7 @@ const ActionBar = ({
return (
<div className="d-flex justify-content-between fs-14">
<div className="d-flex align-items-center text-secondary">
<div className="d-flex align-items-center link-secondary">
{userStatus !== 'deleted' ? (
<Link to={`/users/${username}`}>{nickName}</Link>
) : (
@ -34,7 +34,7 @@ const ActionBar = ({
<Button
variant="link"
size="sm"
className={`me-3 btn-no-border p-0 ${isVote ? '' : 'text-secondary'}`}
className={`me-3 btn-no-border p-0 ${isVote ? '' : 'link-secondary'}`}
onClick={onVote}>
<Icon name="hand-thumbs-up-fill" />
{voteCount > 0 && <span className="ms-2">{voteCount}</span>}
@ -42,7 +42,7 @@ const ActionBar = ({
<Button
variant="link"
size="sm"
className="text-secondary m-0 p-0 btn-no-border"
className="link-secondary m-0 p-0 btn-no-border"
onClick={onReply}>
{t('btn_reply')}
</Button>
@ -55,7 +55,7 @@ const ActionBar = ({
variant="link"
size="sm"
className={classNames(
'text-secondary btn-no-border m-0 p-0',
'link-secondary btn-no-border m-0 p-0',
index > 0 && 'ms-3',
)}
onClick={() => onAction(action)}>

View File

@ -31,13 +31,13 @@ const HotQuestions: FC = () => {
as={Link}
to={`/questions/${li.id}`}
action>
<div className="text-body">{li.title}</div>
<div className="link-dark">{li.title}</div>
{li.answer_count > 0 ? (
<div
className={`d-flex align-items-center fs-14 mt-1 ${
li.accepted_answer_id > 0
? 'text-success'
: 'text-secondary'
? 'link-success'
: 'link-secondary'
}`}>
{li.accepted_answer_id >= 1 ? (
<Icon name="check-circle-fill" />

View File

@ -8,7 +8,7 @@ interface IProps {
pageUsers;
}
const MAXRECODE = 5;
const MAX_RECODE = 5;
const Mentions: FC<IProps> = ({ children, pageUsers }) => {
const menuRef = useRef<HTMLDivElement>(null);
@ -125,18 +125,18 @@ const Mentions: FC<IProps> = ({ children, pageUsers }) => {
onKeyDown={handleKeyDown}>
{children}
<Dropdown.Menu
className={filterData.length > 0 ? 'visabled' : 'hidden'}
className={filterData.length > 0 ? 'visible' : 'invisible'}
ref={menuRef}>
{filterData
.filter((_, index) => index < MAXRECODE)
.filter((_, index) => index < MAX_RECODE)
.map((item, index) => {
return (
<Dropdown.Item
className={`${cursor === index ? 'bg-gray-200' : ''}`}
key={item.displayName}
onClick={() => handleClick(item)}>
<span className="text-body me-1">{item.displayName}</span>
<small className="text-secondary">@{item.userName}</small>
<span className="link-dark me-1">{item.displayName}</span>
<small className="link-secondary">@{item.userName}</small>
</Dropdown.Item>
);
})}

View File

@ -123,7 +123,7 @@ const Index: FC<IProps> = ({
<Link
key={item.action}
to={editUrl}
className="text-secondary p-0 fs-14 me-3"
className="link-secondary p-0 fs-14 me-3"
style={{ lineHeight: '23px' }}>
{item.name}
</Link>
@ -133,7 +133,7 @@ const Index: FC<IProps> = ({
<Button
key={item.action}
variant="link"
className="text-secondary p-0 fs-14 me-3"
className="link-secondary p-0 fs-14 me-3"
onClick={() => handleAction(item.action)}>
{item.name}
</Button>

View File

@ -133,7 +133,7 @@ const QuestionList: FC<Props> = ({ source }) => {
return (
<ListGroup.Item key={li.id} className="border-bottom py-3 px-0">
<h5 className="text-wrap text-break">
<NavLink to={`/questions/${li.id}`} className="text-body">
<NavLink to={`/questions/${li.id}`} className="link-dark">
{li.title}
{li.status === 2 ? ` [${t('closed')}]` : ''}
</NavLink>

View File

@ -59,7 +59,7 @@ const Index: FC<IProps> = ({ type, qid, aid, title }) => {
<Dropdown.Toggle
id="dropdown-share"
as="a"
className="no-toggle fs-14 text-secondary pointer me-3"
className="no-toggle fs-14 link-secondary pointer me-3"
onClick={() => setShow(true)}
style={{ lineHeight: '23px' }}>
{t('share.name')}

View File

@ -19,7 +19,7 @@ const Index: FC<Props> = ({ data, time, preFix }) => {
) : (
<Avatar avatar={data?.avatar} size="40px" className="me-2" />
)}
<div className="fs-14 text-secondary">
<div className="fs-14 link-secondary">
<div>
{data?.status !== 'deleted' ? (
<Link to={`/users/${data?.username}`} className="me-1 text-break">

View File

@ -7,7 +7,7 @@ const Index = () => {
return (
<Container className="d-flex flex-column justify-content-center align-items-center page-wrap">
<div
className="mb-4 text-secondary"
className="mb-4 text-secondary"
style={{ fontSize: '120px', lineHeight: 1.2 }}>
(=x=)
</div>

View File

@ -7,7 +7,7 @@ const Index = () => {
return (
<Container className="d-flex flex-column justify-content-center align-items-center page-wrap">
<div
className="mb-4 text-secondary"
className="mb-4 text-secondary"
style={{ fontSize: '120px', lineHeight: 1.2 }}>
(=T^T=)
</div>

View File

@ -26,7 +26,7 @@ const SearchQuestion = ({ similarQuestions }) => {
<ListGroup.Item
action
as="a"
className="text-body"
className="link-dark"
key={item.id}
href={`/questions/${item.id}`}
target="_blank">

View File

@ -58,7 +58,7 @@ const Index: FC<Props> = ({ data, initPage, hasAnswer }) => {
return (
<div>
<h1 className="fs-3 mb-3 text-wrap text-break">
<Link className="text-body" reloadDocument to={`/questions/${data.id}`}>
<Link className="link-dark" reloadDocument to={`/questions/${data.id}`}>
{data.title}
{data.status === 2
? ` [${t('closed', { keyPrefix: 'question' })}]`

View File

@ -33,13 +33,13 @@ const Index: FC<Props> = ({ id }) => {
key={item.id}
as={Link}
to={`/questions/${item.id}`}>
<div className="text-body">{item.title}</div>
<div className="link-dark">{item.title}</div>
{item.answer_count > 0 && (
<div
className={`mt-1 fs-14 me-2 ${
item.accepted_answer_id > 0
? 'text-success'
: 'text-secondary'
? 'link-success'
: 'link-secondary'
}`}>
<Icon
name={

View File

@ -41,7 +41,7 @@ const Index: FC<Props> = ({ data }) => {
</div>
{options?.length && (
<div>
<span className="text-secondary">{t('options')} </span>
<span className="text-secondary">{t('options')}</span>
{options?.map((item) => {
return <code key={item}>{item} </code>;
})}

View File

@ -23,7 +23,7 @@ const Index: FC<Props> = ({ data }) => {
{data.object_type === 'question' ? 'Q' : 'A'}
</Badge>
<a
className="h5 mb-0 text-body text-break"
className="h5 mb-0 link-dark text-break"
href={`/questions/${data.object.id}`}>
{data.object.title}
{data.object.status === 'closed'

View File

@ -64,7 +64,7 @@ const Questions: FC = () => {
<Link
to={`/tags/${tagInfo?.slug_name}`}
replace
className="text-body">
className="link-dark">
{tagInfo.display_name}
</Link>
</h3>

View File

@ -98,7 +98,7 @@ const TagIntroduction = () => {
<Link
to={`/tags/${tagInfo?.slug_name}`}
replace
className="text-body">
className="link-dark">
{tagInfo.display_name}
</Link>
</h3>
@ -123,7 +123,7 @@ const TagIntroduction = () => {
key={action.name}
variant="link"
className={classNames(
'text-secondary btn-no-border p-0 fs-14',
'link-secondary btn-no-border p-0 fs-14',
index > 0 && 'ms-3',
)}
onClick={() => onAction(action)}>

View File

@ -30,12 +30,12 @@ const Index: FC<Props> = ({ data }) => {
{data?.status !== 'deleted' ? (
<Link
to={`/users/${data.username}`}
className="text-body h3 mb-0"
className="link-dark h3 mb-0"
reloadDocument>
{data.display_name}
</Link>
) : (
<span className="text-body h3 mb-0">{data.display_name}</span>
<span className="link-dark h3 mb-0">{data.display_name}</span>
)}
{data?.is_admin && (
<div className="ms-2">
@ -56,11 +56,6 @@ const Index: FC<Props> = ({ data }) => {
<strong className="fs-5">{data.rank || 0}</strong>
<span className="text-secondary"> {t('x_reputation')}</span>
</div>
{/* <div className="me-3">
<strong className="fs-5">{data?.votes_count || 0}</strong>
<span className="text-secondary"> {t('x_votes')}</span>
</div> */}
<div className="me-3">
<strong className="fs-5">{data.answer_count || 0}</strong>
<span className="text-secondary"> {t('x_answers')}</span>