mdk-skills 2.2.17 → 2.2.18

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mdk-skills",
-  "version": "2.2.17",
+  "version": "2.2.18",
   "description": "mdk-engineer - 沉稳靠谱的前端开发助手 Claude Skills 配置包，一键注入 .claude/ 技能目录和 CLAUDE.md 人设配置",
   "author": "XiaoMa",
   "license": "MIT",

package/scripts/web-ui/src/styles/main.css

@@ -149,6 +149,39 @@ body {
   transition: opacity 0.2s;
 }
 
+/* ---------- 手搓折叠 ---------- */
+.readme-fold {
+  margin-bottom: 20px;
+  border: 1px solid #e5e7eb;
+  border-radius: 6px;
+  overflow: hidden;
+}
+.fold-header {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  padding: 10px 16px;
+  font-size: 14px;
+  font-weight: 600;
+  background: #fafafa;
+  cursor: pointer;
+  user-select: none;
+}
+.fold-header:hover {
+  background: #f0f0f0;
+}
+.fold-arrow {
+  font-size: 11px;
+  transition: transform 0.2s;
+  color: #999;
+}
+.fold-arrow.open {
+  transform: rotate(90deg);
+}
+.fold-body {
+  padding: 0 16px 16px;
+}
+
 .markdown-content pre:hover .copy-btn {
   opacity: 1;
 }

package/scripts/web-ui/src/views/Dashboard.vue

@@ -1,16 +1,15 @@
 <template>
   <div class="dashboard">
     <!-- 仓库 README -->
-    <n-collapse
-      v-if="readmeContent"
-      :default-expanded-names="['readme']"
-      class="readme-collapse"
-      :animated="false"
-    >
-      <n-collapse-item title="仓库说明" name="readme">
+    <div class="readme-fold" v-if="readmeContent">
+      <div class="fold-header" @click="readmeOpen = !readmeOpen">
+        <span class="fold-arrow" :class="{ open: readmeOpen }">▶</span>
+        仓库说明
+      </div>
+      <div class="fold-body" v-show="readmeOpen">
         <div class="markdown-content" v-html="renderedReadme" />
-      </n-collapse-item>
-    </n-collapse>
+      </div>
+    </div>
 
     <div class="page-header">
       <h2>技能列表</h2>
@@ -102,6 +101,7 @@ const loading = ref(false);
 // README
 const readmeContent = ref(null);
 const renderedReadme = ref("");
+const readmeOpen = ref(true);
 
 // 详情弹窗
 const detailVisible = ref(false);
@@ -203,10 +203,6 @@ onUnmounted(() => document.removeEventListener("visibilitychange", onFocus));
   font-weight: 600;
 }
 
-.readme-collapse {
-  margin-bottom: 20px;
-}
-
 .detail-status {
   display: flex;
   justify-content: center;

package/scripts/web-ui/src/views/SceneSwitch.vue

@@ -1,16 +1,15 @@
 <template>
   <div class="scene-switch">
     <!-- 技能说明文档 -->
-    <n-collapse
-      v-if="skillsReadmeContent"
-      :default-expanded-names="['skills-readme']"
-      class="readme-collapse"
-      :animated="false"
-    >
-      <n-collapse-item title="技能说明" name="skills-readme">
+    <div class="readme-fold" v-if="skillsReadmeContent">
+      <div class="fold-header" @click="skillsReadmeOpen = !skillsReadmeOpen">
+        <span class="fold-arrow" :class="{ open: skillsReadmeOpen }">▶</span>
+        技能说明
+      </div>
+      <div class="fold-body" v-show="skillsReadmeOpen">
         <div class="markdown-content" v-html="renderedSkillsReadme" />
-      </n-collapse-item>
-    </n-collapse>
+      </div>
+    </div>
 
     <div class="page-header">
       <h2>场景切换</h2>
@@ -242,6 +241,7 @@ const message = useMessage();
 
 // 技能说明 README
 const skillsReadmeContent = ref(null);
+const skillsReadmeOpen = ref(true);
 const renderedSkillsReadme = ref("");
 
 const profiles = ref([]);
@@ -437,10 +437,6 @@ onMounted(() => {
   font-weight: 600;
 }
 
-.readme-collapse {
-  margin-bottom: 20px;
-}
-
 .scene-grid {
   display: grid;
   grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));