From 03c83878309313e7e340841c995d181e47fb384c Mon Sep 17 00:00:00 2001
From: yyh <yuanyouhuilyz@gmail.com>
Date: Fri, 30 Jan 2026 16:12:47 +0800
Subject: [PATCH] fix(skill): make template header and search sticky on scroll

---
 .../skill/start-tab/skill-templates-section.tsx  | 16 +++++++++-------
 1 file changed, 9 insertions(+), 7 deletions(-)

diff --git a/web/app/components/workflow/skill/start-tab/skill-templates-section.tsx b/web/app/components/workflow/skill/start-tab/skill-templates-section.tsx
index 19df49ad49..28e29833d4 100644
--- a/web/app/components/workflow/skill/start-tab/skill-templates-section.tsx
+++ b/web/app/components/workflow/skill/start-tab/skill-templates-section.tsx
@@ -77,13 +77,15 @@ const SkillTemplatesSection = () => {
   }, [searchQuery])
 
   return (
-    <section className="flex flex-col gap-3 px-6 py-2">
-      <SectionHeader
-        title={t('skill.startTab.templatesTitle')}
-        description={t('skill.startTab.templatesDesc')}
-      />
-      <TemplateSearch onChange={setSearchQuery} />
-      <div className="grid grid-cols-3 gap-3">
+    <section className="flex flex-col gap-3">
+      <div className="sticky top-0 z-10 flex flex-col gap-3 bg-components-panel-bg px-6 pb-1 pt-2">
+        <SectionHeader
+          title={t('skill.startTab.templatesTitle')}
+          description={t('skill.startTab.templatesDesc')}
+        />
+        <TemplateSearch onChange={setSearchQuery} />
+      </div>
+      <div className="grid grid-cols-3 gap-3 px-6">
         {filtered.map(entry => (
           <TemplateCard
             key={entry.id}