المهارات css-development:validate
🎨
css-development:validate
آمن 📁
الوصول إلى نظام الملفات
验证代码库中的 CSS 模式
CSS 验证需要手动审查语义化命名、深色模式覆盖率和 Tailwind 组合。此技能可自动检查模式并生成包含文件和行引用的可操作报告。
يدعم: Claude Codex Code(CC)
1
تنزيل ZIP المهارة
2
رفع في Claude
اذهب إلى Settings → Capabilities → Skills → Upload skill
3
فعّل وابدأ الاستخدام
اختبرها
استخدام "css-development:validate". Validate styles/components.css
النتيجة المتوقعة:
- styles/components.css 的 CSS 验证报告
- 已审查 15 个类
- 问题：3 个高优先级（缺少深色模式），4 个中等（命名问题）
- 示例问题：.card-header 缺少深色模式（第 45 行），.btn-blue 应为 .button-secondary
التدقيق الأمني
آمنv3 • 1/10/2026
Pure prompt-based skill with no code execution capabilities. Only reads CSS files for validation as stated in its purpose. No network, filesystem write, or command execution capabilities.
1
الملفات التي تم فحصها
357
الأسطر التي تم تحليلها
1
النتائج
3
إجمالي عمليات التدقيق
عوامل الخطر
📁 الوصول إلى نظام الملفات (1)
تم تدقيقه بواسطة: claude عرض سجل التدقيق →
درجة الجودة
38
الهندسة المعمارية
100
قابلية الصيانة
81
المحتوى
31
المجتمع
100
الأمان
61
الامتثال للمواصفات
ماذا يمكنك بناءه
合并前代码审查
在合并前验证 CSS，以确保整个代码库中的模式一致性。
技术债务评估
审核现有 CSS 的深色模式差距和命名问题，覆盖整个代码库。
模式执行
在代码审查过程中验证贡献者是否遵循既定的 CSS 模式。
جرّب هذه الموجهات
基本验证
根据既定模式验证 styles/components.css 中的 CSS。检查语义化命名、深色模式覆盖和 Tailwind @apply 使用情况。
重点检查
检查所有 CSS 文件中彩色元素上缺失的深色模式变体。列出每个缺少 dark: 变体的类，并提供 file:line 引用。
命名审查
审查 CSS 类名中的非语义化命名。标记如 .btn-blue 或 .text-big 这样的工具类名，并建议语义化替代名称。
完整审计
运行完整的 CSS 验证：检查语义化命名、深色模式覆盖、@apply 使用、测试覆盖和文档。提供带有优先级建议的摘要。
أفضل الممارسات
- 指定精确的 CSS 文件路径以获得更集中的验证结果
- 首先审查深色模式问题，因为它们会导致视觉错误
- 在重构前使用验证报告了解范围
تجنب
- 使用工具类名如 .btn-blue 或 .text-big
- 在背景色和文本颜色上缺少 dark: 变体
- 在标记中散布 Tailwind 工具类而不使用 @apply 组合
الأسئلة المتكررة
此技能可以修改 CSS 文件吗？
不会。此技能仅验证和报告问题。使用 css-development:refactor 技能来自动修复问题。
它检查哪些 CSS 文件？
它读取您指定的任何 CSS 文件。常见路径包括 styles/components.css 和特定于组件的样式表。
它是否在浏览器中测试渲染样式？
不会。它仅验证静态 CSS 模式。浏览器渲染测试需要单独的测试文件。
我的 CSS 文件中的数据会被发送到任何地方吗？
不会。此技能在本地运行，只读取文件以在您的会话中提供验证反馈。
为什么某些类被标记为非语义化？
像 .btn-blue 这样的非语义化名称描述的是外观而非用途。请使用如 .button-primary 这样的名称来描述元素的用途。
这与 css-development:refactor 有什么不同？
Validate 会审查和报告问题。Refactor 会实际修改代码。先使用 validate 了解范围，然后使用 refactor 进行修复。