Hugging Face's logo

Spaces:
ccjulia
/
zero_friction
Sleeping

App Files Community
zero_friction / .github /copilot-instructions.md
Ming Wang
docs: add coding standards for Copilot and Claude Code
7ec794a
preview code
|
Raw History Blame Contribute Delete
1.01 kB

Coding Standards

CSS / SCSS Rules

  • ALL colors must use var(--pf-*) or var(--mat-sys-*). Never write raw hex, rgb(), or rgba() in components.
  • ALL spacing must use var(--pf-spacing-*). Never write raw px values for padding, margin, or gap.
  • ALL icon sizes must use var(--pf-icon-size-*). Never write raw px for font-size, width, height on icons.
  • ALL border-radius must use var(--pf-radius-*).
  • ALL shadows must use var(--pf-shadow-*).
  • If a token doesn't exist yet, ADD it to frontend/src/app/shared/styles/_tokens.scss first, then use the token. Never hardcode.

Component Rules

  • Reusable UI must be extracted into shared components.
  • API data must have a typed interface in core/models/api.models.ts.
  • API URLs must use environment, never hardcode URLs in services.

When Unsure

  • If you are not sure whether a value should be a token, ASK the user before writing raw values.
  • If a design requirement conflicts with these rules, ASK the user before proceeding.