Rules Hub
Code Ruleset
← Back to all rules
Rule priority, scope & exceptions
Use this to align rules with the senior-level structure (P0/P1/P2, scope, exceptions/tradeoffs).
frontend ruleP2stack specificStack: css
cssdrytypographydesign-system
Reuse existing typography/utility styles instead of redefining them
Before adding font-size/weight/line-height rules, check whether a shared typography style already covers it and reuse that.
PR: hegnar-web · org-mining-deep-2026-06Created: Jun 17, 2026
Bad example
Old codecss
| 1 | .forum__title { |
| 2 | font-size: 18px; |
| 3 | font-weight: 700; |
| 4 | line-height: 1.3; |
| 5 | } |
Explanation (EN)
Restating a shared typography definition creates another value to keep synchronized.
Objašnjenje (HR)
Good example
New codecss
| 1 | .forum__title { |
| 2 | @extend %typography-heading-s; /* reuse the shared style */ |
| 3 | } |
Explanation (EN)
Objašnjenje (HR)
Notes (EN)
Compare intended font family, size, weight, line height and responsive behavior with the shared typography contract before adding a duplicate style.
Exceptions / Tradeoffs (EN)
Reuse only a semantically matching token/class/mixin. Sass extend can merge selectors and alter output structure, so follow the existing reuse mechanism.