Snippet — אפליקציית PWA לניהול קטעי טקסט שאתה מעתיק שוב ושוב — אימיילים, פקודות shell, כתובות, חתימות, תשובות מהירות לקוחות, קישורים. במקום לחפש או להקליד אותם מחדש — שמור פעם אחת, העתק לעולם בלחיצה אחת.
הזרימה המלאה
5 שניות מחיפוש להעתקה: הקלד 2 אותיות בשדה החיפוש → לחץ על כפתור ההעתקה הירוק → הקליפבורד מוכן.
- שמור snippet — כותרת, תוכן (multi-line, עד 5K תווים), קטגוריה (מתוך 8 צבעוניות), tags
- חפש — בכותרת, תוכן, ו-tags במקביל. תוצאות מתעדכנות בזמן הקלדה
- לחץ העתק — Clipboard API + ויברציה + toast notification + visual feedback על הכרטיס
- המערכת לומדת — מונה שימוש מצבר אוטומטית, וה-snippets הנפוצים ביותר עולים למעלה
8 קטגוריות צבעוניות
| קטגוריה | אייקון | למה זה |
|---|---|---|
| קוד ⌘ | lavender-blue | פקודות shell, snippet-ים של קוד, regex |
| אימייל ✉ | ice-blue | תגובות אוטומטיות, תבניות, hello/bye |
| תשובות 💬 | emerald | תשובות מהירות לקוחות, FAQ |
| כתובות 📍 | rose | כתובת בית, משרד, חברה |
| קישורים 🔗 | sky | URLs שכיחים, bio links |
| חתימות ✍ | gold | חתימות אימייל, פרופיל מקצועי |
| טלפונים 📱 | violet | מספרי טלפון משלך/משפחה |
| אחר ✨ | cream | כל השאר |
פיצ'רים חכמים
- RTL/LTR auto-detection — האפליקציה מזהה אם התוכן עברי (Hebrew Unicode
0x0590-0x05FF) או אנגלי ומציגה את ה-preview בכיוון הנכון. קוד תמיד LTR גם אם הכותרת עברית. - 📌 Pinning — snippets מוצמדים תמיד ראשונים, גם מעל הנפוצים
- Use count tracking — מצבר על כל copy, מציג ×N על כרטיס. אלגוריתם המיון: pinned → useCount DESC → createdAt DESC
- Filter modes: הכל / 📌 מוצמדים / ⚡ אחרונים (לפי lastUsed)
- Category filter — לחיצה על category chip מסננת רק לקטגוריה הזו
- Real-time search highlighting — המילה המחופשת מודגשת בצהוב בכותרת
- Visual copy feedback — הכרטיס מקבל border ירוק, הכפתור הופך ל-"✓ הועתק", toast למטה — הכל סינכרוני
- Empty state מצויר — clipboard SVG עם 5 שורות טקסט וצ'ק-מארק
טכנולוגיות
- Clipboard API עם
navigator.clipboard.writeText— async/await pattern, error handling - Custom RTL detection — Unicode range scan על 200 התווים הראשונים
- In-memory full-text search — substring match על title + content + tags במקביל
- IndexedDB single-store עם simple keyPath
- Vibration API — pattern של 3 פולסים על copy
- CSS color-mix() ל-glow אדפטיבי לפי קטגוריה
- Service Worker + PWA installable
עיצוב
פלטה ice-blue + warm-cream + emerald accents — אסתטיקת editor קוד פרימיום. רקע עמוק כמעט-שחור #070a14 · ice-blue #bae6fd · emerald copy button #86efac · cream highlights #fef9c3. Body של ה-snippets ב-IBM Plex Mono על רקע שחור-מאוד עם fade gradient בתחתית — מרגיש כמו terminal.
טיפוגרפיה — Heebo + Frank Ruhl Libre לכותרות + IBM Plex Mono לתוכן ה-snippets. Glassmorphic surfaces, ambient ice-blue + emerald orbs נעות ברקע.