תבנית Pull Request

✨ תיאור קצר

• מה המשתמש מקבל:
  • הסרגל העליון: חלונית הקיצורים (🚀) ותפריט האפקטים (🪄) עובדים שוב, בכל עמוד. כל כפתור מגיב לנגיעה, והחלונית ממשיכה להיפתח מעל התוכן ולהיות מוצגת מיד.
  • סרגלי החיפוש: בתצוגת קובץ ובתצוגת Markdown הסרגל נצמד לראש המסך רק כשיש טקסט בתיבה. בלי חיפוש הוא נגלל עם העמוד, ולא מסתיר את ראש התוכן.
• למה זה קרה: תוכן העמוד (.main-content) מצויר בשכבה שמעל הסרגל. עד #3535 החלוניות נחתכו בתוך הסרגל, ולכן אף פעם לא יצאו מעל התוכן. #3535 ביטל את החיתוך, והחלק של החלונית שיצא מעל התוכן נראה תקין, אבל הנגיעה הלכה לתוכן.

📦 שינויים עיקריים

• קוד: תבניות ה-WebApp, ב-CSS בלבד, בלי JS ובלי שרת
• בוט טלגרם
• מסד נתונים/מיגרציות
• תיעוד (docs/)
• DevOps/CI/CD

פירוט נקודות:

• base.html, שכבת הסרגל:
  • ה-z-index: 1000 של .navbar היה מת. z-index פועל רק על אלמנט ממוקם, והסרגל הוא static מאז #559. הסרתי אותו מהכלל הבסיסי.
  • נוסף .navbar:has(.nav-menu.active, .quick-access-dropdown.active, .fun-mode-dropdown.active) { position: relative; z-index: 1000 }. כלומר הסרגל עולה מעל התוכן רק בזמן שאחד התפריטים שלו פתוח.
  • למה לא לתמיד: מדדתי שהרמה קבועה מסתירה בראש עמוד קובץ את 🔖 (#toggleBookmarksBtn) ואת כותרת פאנל הסימניות, ומניחה את הסרגל מעל מציג התמונות. בעשרות חלונות קופצים שיושבים בתוך .main-content הייתה קורה אותה בעיה.
• base.html, חלונית האפקטים:
  • היא מעוגנת עכשיו ב-left: 0 ולא ב-right: 0. השרביט הוא הפריט השמאלי בסרגל, ולכן החלונית נפתחה אל מחוץ למסך.
  • צד לוגי (inset-inline-end) לא עוזר כאן. לחלונית יש direction: ltr משלה, ולכן צד לוגי מתורגם אצלה בחזרה ל-right, וזה נמדד.
• base.html, פריסת ההמבורגר: .nav-menu.active { overflow: visible }. הרשימה הפתוחה חתכה את חלונית האפקטים, וכך היה גם לפני #3535. החיתוך נשאר לאנימציית הקיפול.
• view_file.html ו-md_preview.html:
  • ההצמדה עברה לכללים .editor-toolbar:has(#codeSearchInput:not(:placeholder-shown)) ו-.md-editor-toolbar:has(#mdSearchInput:not(:placeholder-shown)).
  • הרווח מעל כותרות Markdown (scroll-margin-top) חל רק באותו תנאי. בלי חיפוש, כותרת נוחתת בראש המסך.
• מה לא השתנה: הסרגל העליון עצמו. בלי תפריט פתוח הוא נגלל עם העמוד, כמו מאז #559.

🧪 בדיקות

• Unit: tests/test_navbar_and_search_bars_css.py, שומר טקסטואלי שרץ ב-CI.
  • הוא קורא את ה-CSS של שלוש התבניות ומוודא שההחלטות לא בוטלו.
  • יש בו 10 שינויים מכוונים בקוד, וכל אחד מהם מפיל אותו. ביניהם הרמה קבועה של הסרגל, עיגון החלונית לימין או לצד לוגי, ותיבה בלי placeholder.
  • 18 עוברות. על main נכשלות 7 בדיקות ההחלטה.
  • פרסור משותף: הפרסור של כללי ה-CSS יושב ב-tests/_css_rules.py, ומשמש גם את tests/test_sticky_notes_touch_action.py. השומר החדש שכפל אותו מהקובץ ההוא, ולכן איחדתי (R6). כל הבדיקות של שומר הפתקים, כולל המוטציות שלו, עוברות.
• Integration: בדיקות דפדפן בכרומיום אמיתי, מול השרת האמיתי ומונגו אמיתי, בנגיעות CDP אמיתיות. לאן הגיעה כל נגיעה נבדק לפי האירוע עצמו, ולא לפי elementFromPoint.
  • tests/test_navbar_menus_browser.py (חדש):
    • נגיעה בכל כפתור בשני התפריטים, בטאבלט לרוחב ובפריסת ההמבורגר.
    • בדיקת שמירה: אחרי שתפריט נסגר, 🔖 וכותרת הפאנל עדיין לחיצים.
  • tests/test_view_file_scroll_browser.py:
    • בדיקה חדשה: הסרגל צמוד רק עם טקסט, ו-✕ משחרר אותו, בתצוגה הבסיסית ובמתקדמת.
    • בדיקת ה-Markdown עודכנה להתנהגות החדשה, בטאבלט ובטלפון.
  • ריצת בקרה:
    • עם התיקון כל 13 הבדיקות עוברות, בשתי ריצות.
    • על main נכשלות 8 מהן, מהסיבה הנכונה. למשל: הקיצור הראשון לא לחיץ, כפתור האפקטים ב-x=-91 מחוץ למסך, והסרגל צמוד ב-0 בלי טקסט.
    • על גרסת הרמה קבועה רק בדיקת השמירה נכשלת: 🔖 לא לחיץ.
  • בדיקות קיימות: עוברות 862 בדיקות שקוראות את התבניות, 1848 בדיקות שקוראות את התיעוד, ו-26 בדיקות דפדפן, כולל test_repo_notes_browser.py שמשתמש באותו harness.
  • לינט: flake8 (גם הבחירה החוסמת של ה-CI) ו-mypy נקיים על קובצי הבדיקות.
• Manual: לא נבדק במכשיר אנדרואיד אמיתי. זו אמולציית מגע בכרומיום. גם Telegram Mini App לא נבדק.

🧪 בדיקות נדרשות ב‑PR

• 🔍 Code Quality & Security
• Unit Tests (3.11)
• Unit Tests (3.12)
• Unit Tests md-heavy (3.11)
• Unit Tests md-heavy (3.12)

📝 סוג שינוי

• feat: פיצ'ר חדש
• fix: תיקון באג
• docs: שינוי תיעוד בלבד
• refactor: שינוי קוד ללא שינוי התנהגות
• perf: שיפור ביצועים
• chore/ci: תשתית/CI
• breaking change: שינוי שובר תאימות

✅ צ'קליסט

• הקוד עוקב אחרי הסגנון (Black/isort/flake8/mypy)
• בדיקות רצות ועוברות
• תיעוד עודכן (README/Docs). ב-docs/whats-new.rst נוספה רשומה. ב-docs/webapp/theming_and_css.rst נוספו שני כללים: z-index על אלמנט שאינו ממוקם והקשר ערימה שכולא את הילדים, והצמדה רק בזמן חיפוש. בנוסף עודכן כלל ה-clip: המעבר משחרר גם רכיבים צפים שהיו חתוכים.
• אם נוספו ג'ובים חדשים: לא רלוונטי
• אם נוספו/שונו משתני סביבה: לא רלוונטי
• אם נוספו/השתנו טוקנים: לא רלוונטי. השינוי לא נוגע בטוקני צבע.
• אין סודות/מפתחות בקוד
• אין מחיקות מסוכנות/פעולות על root
• הודעת הקומיט תואמת Conventional Commits
• CHANGELOG עודכן אם נדרש (whats-new)
• כל ה‑Required Checks לעיל ירוקים (ממתין ל-CI)
• צילום/וידאו UI מצורף אם רלוונטי
• עיינתי במסמכי אתר התיעוד. נתיב: docs/webapp/theming_and_css.rst. המשפט: "clip חותך לרוחב בדיוק אותו דבר בלי להפוך את המיכל לקופסת גלילה". עליו נשען #3535, וממנו נגזר הפספוס שתוקן כאן.
• עוד עמודים שעיינתי בהם:
  • AI-MAP.md: בדקתי, ואין עמוד על הסרגל העליון או על התפריטים שלו.
  • docs/doc-authoring.rst: בלי ספירות מופעים בפרוזה.
  • docs/versioning-stable-anchors.rst: לא נשבר אף עוגן.
  • docs/testing.rst: בדיקות דפדפן מדולגות ב-CI.
• דפוסי באגים שקראתי:
  • H7 ו-rtl-geometry-and-clamp
  • browser-policy, כולו
  • prose-restates-code-fact ו-line-number-coupling
  • claude-md-snippets/testing.md ו-T4
  • R6
  • linter-fix-changes-runtime-behavior
  • K15 ו-lazy-init-guard-publish-order. הלקח "התנהגות מנוונת שקיימת מזמן היא לעיתים תשתית שמישהו נשען עליה — מודדים מי" הוא מה שהוביל למדידה שפסלה את ההרמה הקבועה.

🧩 השפעות/סיכונים

• בזמן שתפריט של הסרגל פתוח: רכיב צף שעולה על הסרגל (כמו 🔖 בראש עמוד קובץ) מוסתר מתחתיו עד שהתפריט נסגר. זה צפוי.
• בסגירת תפריט: החלק של החלונית שמעל התוכן נעלם מיד ולא דוהה במשך רבע שנייה. השהיה של הירידה הייתה משאירה את החלונית הנסגרת לחיצה מעל התוכן.
• טלפון קטן לרוחב: שם רשימת ההמבורגר ארוכה מ-70% מגובה המסך. סוף הרשימה, שהיה חתוך ולא נגיש, ייצא עכשיו מעל התוכן, בלי רקע. לא מדדתי את המקרה הזה.
• דפדפן בלי :has(): הכללים החדשים לא חלים. התפריטים מתנהגים כמו ב-main, והסרגלים לא נצמדים.

🔗 קישורים

• PR קודם: amirbiron/CodeBot#3535. Issue קשור: amirbiron/CodeBot#3534
• Docs Preview: ה-check של Read the Docs על ה-PR
• מסמכים/מפרטים רלוונטיים:
• Branch Protection & PR Rules
• MDN: z-index: "Applies to: positioned elements". Stacking context: transform ו-backdrop-filter יוצרים הקשר ערימה, ו-"the z-index values of its child stacking contexts only have meaning within its parent's stacking context".

🧯 סיכון / החזרה לאחור (Rollback)

• revert לשני הקומיטים. התפריטים יחזרו להיות לא לחיצים, והסרגלים יחזרו להיות צמודים תמיד, כמו ב-main היום.

סטיות מהתוכנית שאושרה

• ריכוז הקוד המשותף לבדיקות: התוכנית אמרה להעביר את tablet_page כולה ל-tests/_browser_harness.py. בפועל עברו רק הקמת העמוד (open_admin_page) ו-tap_on. הסיבה היא ש-tests/test_browser_suite_is_gated_once.py אוסר להרים דפדפן מחוץ לקובצי *_browser.py, ולכן כל קובץ דפדפן ממשיך להרים את הדפדפן בעצמו.
• שומר טקסטואלי ל-CI: לא היה בתוכנית, והוספתי אותו. בדיקות הדפדפן מדולגות ב-CI, ובלעדיו שום דבר ב-CI לא היה שומר על ההחלטות.
• פרסור CSS משותף (tests/_css_rules.py): לא היה בתוכנית. השומר החדש שכפל את הפרסור של tests/test_sticky_notes_touch_action.py, ולכן איחדתי (R6), בקומיט נפרד.
• בדיקת הסרגל בתצוגת קובץ: אחרי ההקלדה העמוד נגלל בקוד, ולא דרך הקפיצה לתוצאה. הסיבה בממצא הצדדי הראשון.

ממצאים צדדיים, לא תוקנו כאן

• הקלדה בחיפוש הבסיסי: בתצוגה הבסיסית, הקלדה אות אחר אות בתיבה (אחרי נגיעה בה) לא גוללת לתוצאה הראשונה. רק מילוי של כל המחרוזת בבת אחת גולל. נמדד על main וגם לפני #3535. הבדיקה הקיימת test_basic_view_search_bar_stays_on_screen_after_jumping_to_a_match משתמשת ב-page.fill, ולכן לא רואה את זה.
• כפתור ההמבורגר בלי Font Awesome: כשהגופן לא נטען מה-CDN, לכפתור ההמבורגר אין גודל ואי אפשר לגעת בו. ל-no-fa-icons אין חלופה עבורו.

🤖 Generated with Claude Code

https://claude.ai/code/session_013Pzf4XyLpo6NFzLyZVnWxm

---

Generated by Claude Code

Summary by Sourcery

Fix webapp navigation menu touch targets and make search toolbars sticky only during active searches.

Bug Fixes:

• Restore touch interaction for the top navigation quick-access and effects menus across desktop and hamburger layouts.
• Make file and Markdown search toolbars sticky only while their search fields contain text, allowing them to scroll normally otherwise.

Enhancements:

• Ensure open navigation menus render above page content without permanently obscuring floating controls.
• Improve effects-menu positioning and hamburger-menu overflow so dropdown content remains visible and accessible.

Documentation:

• Document the stacking and conditional sticky-toolbar behavior in the webapp CSS guidance and release notes.

Tests:

• Add CSS guards that verify the navigation layering, dropdown positioning, overflow, and conditional search-toolbar rules.
• Add Chromium touch tests covering navigation menu interactions, floating controls, and search-toolbar behavior across file-view modes and Markdown viewport sizes.