Skip to content

Commit b8ec987

Browse files
fix(settings): lowercase info rows with inline copy-on-hover
Drop the forced text-transform: uppercase on team info labels and values, and remove the onCopy override that existed only to mask it. Reveal the existing CopyButton inline on row hover / keyboard focus using the project's group/row + group-has-[:focus-visible] pattern. Co-Authored-By: Craft Agent <agents-noreply@craft.do>
1 parent b9d6672 commit b8ec987

1 file changed

Lines changed: 15 additions & 19 deletions

File tree

src/features/dashboard/settings/general/team-info.tsx

Lines changed: 15 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,30 +1,26 @@
11
'use client'
22

3-
import { ClipboardEvent } from 'react'
43
import { useDashboard } from '@/features/dashboard/context'
54
import { formatDate } from '@/lib/utils/formatting'
5+
import CopyButton from '@/ui/copy-button'
66

7-
const InfoRow = ({ label, value }: { label: string; value: string }) => {
8-
const handleCopy = (e: ClipboardEvent<HTMLSpanElement>) => {
9-
if (!window.getSelection()?.toString()) return
10-
e.preventDefault()
11-
e.clipboardData.setData('text/plain', value)
12-
}
13-
14-
return (
15-
<div className="flex flex-col gap-1 sm:flex-row sm:items-center sm:justify-between sm:gap-4">
16-
<span className="text-fg-tertiary shrink-0 text-xs leading-[17px] font-normal uppercase">
17-
{label}
18-
</span>
19-
<span
20-
className="text-fg-secondary font-mono text-base leading-5 font-semibold tracking-[-0.16px] uppercase [overflow-wrap:anywhere]"
21-
onCopy={handleCopy}
22-
>
7+
const InfoRow = ({ label, value }: { label: string; value: string }) => (
8+
<div className="group/row flex flex-col gap-1 sm:flex-row sm:items-center sm:justify-between sm:gap-4">
9+
<span className="text-fg-tertiary shrink-0 text-xs leading-[17px] font-normal">
10+
{label}
11+
</span>
12+
<div className="flex min-w-0 items-center gap-2">
13+
<span className="text-fg-secondary font-mono text-base leading-5 font-semibold tracking-[-0.16px] [overflow-wrap:anywhere]">
2314
{value}
2415
</span>
16+
<CopyButton
17+
value={value}
18+
aria-label={`Copy ${label}`}
19+
className="opacity-0 transition-opacity group-hover/row:opacity-100 group-has-[:focus-visible]/row:opacity-100 focus-visible:opacity-100"
20+
/>
2521
</div>
26-
)
27-
}
22+
</div>
23+
)
2824

2925
export const TeamInfo = () => {
3026
const { team } = useDashboard()

0 commit comments

Comments
 (0)