feat(s2a): Improve ProfileCard layout with flexbox for consistent height
- Add flex flex-col and h-full to Card component for full height layout - Update CardContent with flex flex-col flex-1 for proper content distribution - Move action buttons to bottom with mt-auto pt-4 spacing - Ensures profile cards maintain consistent heights in grid layout and action buttons align to bottom
This commit is contained in:
@@ -603,14 +603,14 @@ function ProfileCard({ profile, isActive, isActivating, groupNameCache, onActiva
|
||||
try { parsedGroups = JSON.parse(profile.group_ids || '[]') } catch { /* ignore */ }
|
||||
|
||||
return (
|
||||
<Card className={`relative transition-all ${isActive ? 'ring-2 ring-green-500 dark:ring-green-400' : ''}`}>
|
||||
<Card className={`relative transition-all flex flex-col h-full ${isActive ? 'ring-2 ring-green-500 dark:ring-green-400' : ''}`}>
|
||||
{/* 活动标记 */}
|
||||
{isActive && (
|
||||
<div className="absolute -top-2 -right-2 bg-green-500 text-white text-xs px-2 py-0.5 rounded-full font-medium shadow-sm">
|
||||
使用中
|
||||
</div>
|
||||
)}
|
||||
<CardContent>
|
||||
<CardContent className="flex flex-col flex-1">
|
||||
{/* 名称 + 操作 */}
|
||||
<div className="flex items-start justify-between mb-3">
|
||||
<div className="flex-1 min-w-0">
|
||||
@@ -647,7 +647,7 @@ function ProfileCard({ profile, isActive, isActivating, groupNameCache, onActiva
|
||||
)}
|
||||
|
||||
{/* 操作按钮 */}
|
||||
<div className="flex items-center gap-2">
|
||||
<div className="flex items-center gap-2 mt-auto pt-4">
|
||||
{!isActive ? (
|
||||
<Button
|
||||
onClick={onActivate}
|
||||
|
||||
Reference in New Issue
Block a user