Description
Show a brief toast/snackbar notification when content is copied to clipboard.
Why Needed
- Confirms action was successful
- Standard UX feedback pattern
- Prevents user uncertainty
Implementation Details
- Create reusable Toast component
- Show 'Copied!' message for 2-3 seconds
- Position at bottom or top of screen
- Auto-dismiss with fade animation
Files to Create/Modify
src/components/shared/Toast.svelte (new)
src/lib/toast.ts (toast store)
- Update copy button components
Code Example
<script>
import { showToast } from '$lib/toast';
function handleCopy() {
navigator.clipboard.writeText(url);
showToast('Copied to clipboard!');
}
</script>
Acceptance Criteria
Time Estimates
- With AI: 100 minutes
- Without AI: 660 minutes
Description
Show a brief toast/snackbar notification when content is copied to clipboard.
Why Needed
Implementation Details
Files to Create/Modify
src/components/shared/Toast.svelte(new)src/lib/toast.ts(toast store)Code Example
Acceptance Criteria
Time Estimates