Replace the press-to-play demo and the "see how it works" button with an example that keeps playing on the right: hold Right Alt, the capsule appears with live wave bars, elapsed time and the partial transcript, releasing shows the processing bar, and the cleaned sentence is pasted at the cursor of a notes window. It cycles through two samples per language. - Same numbers as apps/desktop recording-tip: 9 bars with cos weights, 100 ms updates, 0.5 smoothing, +/-35% jitter, 2-28 px, per-bar colours, 120 px progress bar min(95, (1 - 1/(1 + 1.5t)) * 100)%. - WCAG 2.2.2: a pause button; stops when off screen or the tab is hidden. Reduced motion shows one still frame. The animation is aria-hidden with a text description for screen readers. Chinese and Japanese transcripts appear three characters at a time. - Add 404.html so unknown paths stop falling back to the landing page, delete the duplicate accept-invite.html (/accept-invite/ is canonical) and link it straight to /#download, and move the legal pages off the retired orange accent (primary button contrast 5.2:1).
58 lines
2 KiB
TypeScript
58 lines
2 KiB
TypeScript
// 사이트 공용 아이콘. 모두 장식이므로 aria-hidden 이고, 의미는 옆 텍스트가 전달한다.
|
|
|
|
interface IconProps {
|
|
className?: string
|
|
}
|
|
|
|
export function DownloadIcon({ className = 'h-4 w-4' }: IconProps) {
|
|
return (
|
|
<svg aria-hidden="true" className={className} viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
|
|
<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" />
|
|
<polyline points="7 10 12 15 17 10" />
|
|
<line x1="12" y1="15" x2="12" y2="3" />
|
|
</svg>
|
|
)
|
|
}
|
|
|
|
export function ExternalIcon({ className = 'h-3.5 w-3.5' }: IconProps) {
|
|
return (
|
|
<svg aria-hidden="true" className={className} viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
|
|
<path d="M7 17 17 7" />
|
|
<path d="M8 7h9v9" />
|
|
</svg>
|
|
)
|
|
}
|
|
|
|
export function CheckIcon({ className = 'h-4 w-4' }: IconProps) {
|
|
return (
|
|
<svg aria-hidden="true" className={className} viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.25" strokeLinecap="round" strokeLinejoin="round">
|
|
<polyline points="20 6 9 17 4 12" />
|
|
</svg>
|
|
)
|
|
}
|
|
|
|
export function PlusIcon({ className = 'h-4 w-4' }: IconProps) {
|
|
return (
|
|
<svg aria-hidden="true" className={className} viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round">
|
|
<line x1="12" y1="5" x2="12" y2="19" />
|
|
<line x1="5" y1="12" x2="19" y2="12" />
|
|
</svg>
|
|
)
|
|
}
|
|
|
|
export function PlayIcon({ className = 'h-3.5 w-3.5' }: IconProps) {
|
|
return (
|
|
<svg aria-hidden="true" className={className} viewBox="0 0 24 24" fill="currentColor">
|
|
<path d="M7 4.5v15l13-7.5z" />
|
|
</svg>
|
|
)
|
|
}
|
|
|
|
export function PauseIcon({ className = 'h-3.5 w-3.5' }: IconProps) {
|
|
return (
|
|
<svg aria-hidden="true" className={className} viewBox="0 0 24 24" fill="currentColor">
|
|
<rect x="6" y="4.5" width="4" height="15" rx="1" />
|
|
<rect x="14" y="4.5" width="4" height="15" rx="1" />
|
|
</svg>
|
|
)
|
|
}
|