kevisual/cnb-center
1
0
Fork 0
generated from kevisual/vite-react-template
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 优化 RepoCard 组件，添加条件渲染和样式调整

Browse Source
This commit is contained in:
熊潇
2026-02-27 02:24:19 +08:00
parent 58563ece93
commit f05aab2430
1 changed files with 24 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
src/pages/repos/components/RepoCard.tsx
View File

@@ -21,6 +21,7 @@ import { myOrgs } from '../store/build'
import { app, cnb } from '@/agents/app' import { app, cnb } from '@/agents/app'
import { toast } from 'sonner' import { toast } from 'sonner'
import { useNavigate } from '@tanstack/react-router' import { useNavigate } from '@tanstack/react-router'
import clsx from 'clsx'
interface RepoCardProps { interface RepoCardProps {
repo: any repo: any
@@ -298,25 +299,30 @@ export function RepoCard({ showReturn = false, repo }: RepoCardProps) {
)} )}
<Badge variant="outline" className="text-xs border-neutral-300 text-neutral-700 hover:bg-neutral-100 transition-colors">{repo.visibility_level}</Badge> <Badge variant="outline" className="text-xs border-neutral-300 text-neutral-700 hover:bg-neutral-100 transition-colors">{repo.visibility_level}</Badge>
</div> </div>
<div className={clsx("flex flex-col sm:flex-row sm:items-center gap-4", !showReturn && "cursor-pointer")} onClick={() => {
{repo.site && ( if (!showReturn) {
<div window.open(repo.site, '_blank')
className="text-xs text-neutral-500 hover:text-neutral-900 hover:underline flex transition-colors" }
onClick={() => { }}>
window.open(repo.site, '_blank') {repo.site && (
}} <div
> className="text-xs text-neutral-500 hover:text-neutral-900 hover:underline flex transition-colors"
<LinkIcon className="w-4 h-4 shrink-0 mr-2" /> onClick={() => {
<div className='truncate grow'> window.open(repo.site, '_blank')
{repo.site} }}
>
<LinkIcon className="w-4 h-4 shrink-0 mr-2" />
<div className='truncate grow'>
{repo.site}
</div>
</div> </div>
</div> )}
)} {repo.description && (
{repo.description && ( <p className="ml-2 text-sm text-neutral-600 line-clamp-2 min-h-10 grow">
<p className="ml-2 text-sm text-neutral-600 line-clamp-2 min-h-10 grow"> {repo.description}
{repo.description} </p>
</p> )}
)} </div>
<div className="absolute bottom-0 left-0 right-0 flex items-center gap-4 text-xs text-neutral-500 px-6 py-3 border-t border-neutral-100 bg-neutral-50"> <div className="absolute bottom-0 left-0 right-0 flex items-center gap-4 text-xs text-neutral-500 px-6 py-3 border-t border-neutral-100 bg-neutral-50">