shiyue/ittoview
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: restore option highlight and reduce height

Browse Source
This commit is contained in:
ittoview
2026-05-13 19:15:25 +01:00
parent ea2413cb24
commit bf81e6d225
1 changed files with 6 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/pages/PerformanceDomainPracticePage.tsx
View File

@@ -339,25 +339,25 @@ export default function PerformanceDomainPracticePage() {
onClick={() => handleSelect(domain.id)}
disabled={optionDisabled}
className={clsx(
'relative flex h-[128px] flex-col gap-3 overflow-hidden rounded-xl border bg-white p-3 text-left shadow-sm transition-colors dark:bg-gray-800',
'relative flex h-[112px] flex-col gap-2 overflow-hidden rounded-xl border bg-white p-3 text-left shadow-sm transition-colors dark:bg-gray-800',
'border-gray-100 hover:border-indigo-200 hover:bg-indigo-50/40 dark:border-gray-700 dark:hover:border-indigo-700 dark:hover:bg-indigo-950/20',
optionDisabled && 'cursor-default hover:bg-white dark:hover:bg-gray-800',
currentKindDone && !isAnswerShown && 'bg-gray-50 opacity-55 dark:bg-gray-800/70',
shouldHighlightCorrect &&
'border-emerald-400 bg-emerald-50 dark:border-emerald-500 dark:bg-emerald-950/30',
'border-emerald-400 bg-emerald-50 shadow-[inset_0_0_0_2px_rgba(52,211,153,0.65)] dark:border-emerald-500 dark:bg-emerald-950/30 dark:shadow-[inset_0_0_0_2px_rgba(16,185,129,0.45)]',
isWrongSelected &&
'border-rose-300 bg-rose-50 dark:border-rose-600 dark:bg-rose-950/30'
'border-rose-300 bg-rose-50 shadow-[inset_0_0_0_2px_rgba(251,113,133,0.65)] dark:border-rose-600 dark:bg-rose-950/30 dark:shadow-[inset_0_0_0_2px_rgba(244,63,94,0.45)]'
)}
>
<div className="flex items-center gap-3">
<div
className={clsx(
'flex h-11 w-11 shrink-0 items-center justify-center rounded-lg text-white',
'flex h-10 w-10 shrink-0 items-center justify-center rounded-lg text-white',
currentKindDone && !isAnswerShown && 'grayscale'
)}
style={{ backgroundColor: domain.color }}
>
<Icon size={20} />
<Icon size={18} />
</div>
<div className="min-w-0 flex-1 pr-8">
<div className="text-sm font-semibold text-gray-900 dark:text-white">
@@ -381,7 +381,7 @@ export default function PerformanceDomainPracticePage() {
<span>{item.label}</span>
<span>{item.data.completed}/{item.data.total}</span>
</div>
<div className="h-1.5 overflow-hidden rounded-full bg-gray-100 dark:bg-gray-700">
<div className="h-1 overflow-hidden rounded-full bg-gray-100 dark:bg-gray-700">
<div
className={clsx(
'h-full rounded-full transition-all duration-300',