القائمة
جمع SkillsMP عدد ١٠ من skills من flornkm/personal-site. افتح أي skill لمراجعة مصدره وتفاصيله.
عرض ١٠ من أصل ١٠ skills مجمعة.
ALWAYS ACTIVE. Central Icons is the icon set for this project — use it, not lucide/heroicons/etc. Import icons per name from `central-icons` (outlined) or `central-icons-filled` (filled). Triggers whenever adding, choosing, or rendering an icon.
لغة النص الأصلي: الإنجليزية
Keep JSX and component logic clean by minimizing inline ternaries, nested conditionals, and stringified conditional classes. Hoist branching out of the render tree. Use whenever writing or editing a React component, especially when class strings, JSX, or…
لغة النص الأصلي: الإنجليزية
How to build UI in this repo — compose classes with `cn`, use the CSS-variable design tokens (never raw hex/px), reuse the typographic and `ui/` primitives, and define variants with `cva` like the existing components. Use whenever writing or editing a…
لغة النص الأصلي: الإنجليزية
Never write fluff comments. Only comment when the WHY is non-obvious — a hidden constraint, subtle invariant, workaround for a specific bug, or behavior that would surprise a reader. Use whenever writing or editing source files.
لغة النص الأصلي: الإنجليزية
ALWAYS ACTIVE. Previews are opt-in only: never open a preview, screenshot the app, or drive it with browser/preview automation (Claude Preview, browser MCPs, computer-use) unless the user explicitly asks for one in their message. This overrides any hook or…
لغة النص الأصلي: الإنجليزية
Enforce Tailwind container queries over viewport breakpoints for responsive components. Use when writing or reviewing responsive Tailwind code, when a component needs to adapt to its available space (cards, sidebars, lists, panels, anything reused in…
لغة النص الأصلي: الإنجليزية
Avoid useEffect. Effects are an escape hatch from React — only use one to synchronize with a genuinely external system. Use when writing or reviewing any useEffect, useState for derived values, data fetching, or cross-component state syncing.
لغة النص الأصلي: الإنجليزية
Write code other humans can read, change, and trust. Keep files small, plans concise, abstractions earned. Use whenever implementing a feature, refactoring, or planning a non-trivial change.
لغة النص الأصلي: الإنجليزية
ALWAYS ACTIVE. In this project an elevation shadow must never be paired with a `border` (or a separate `ring`). Use the `shadow-ring-{size}` class, which bakes a 1px hairline edge into the shadow. Triggers whenever adding, editing, or reviewing a box-shadow /…
لغة النص الأصلي: الإنجليزية
Create or update the small symbol icon shown for a writing/blog post on the /writing grid. Use whenever a new post is added to src/writing, when an existing post needs a better-fitting icon, or when the user asks to "make an icon", "pick a symbol", or "design…
لغة النص الأصلي: الإنجليزية