Rules Hub
Coding Rules Library
Rule priority, scope & exceptions
Use this to align rules with the senior-level structure (P0/P1/P2, scope, exceptions/tradeoffs).
Put Shared SCSS Mixins in the Central Mixins Directory
Reusable SCSS mixins belong in the project's shared mixins folder, not embedded in a single feature's design-system file.
Bad example
| 1 | // components/InstrumentsPage/instruments-design-system.scss |
| 2 | @mixin table-header-text { |
| 3 | font-family: $font-family; |
| 4 | font-size: 11px; |
| 5 | } |
Explanation (EN)
Defines generic, potentially reusable text/table mixins inside a single feature's own SCSS file, hiding them from other parts of the app that could use the same styling and inviting duplicate mixins later.
Objašnjenje (HR)
Definira generičke, potencijalno ponovno upotrebljive mixinove za tekst/tablicu unutar SCSS filea jedne pojedine značajke, skrivajući ih od ostalih dijelova aplikacije koji bi mogli koristiti isto stiliziranje, što kasnije potiče duplicirane mixinove.
Good example
| 1 | // styles/mixins/_table.scss |
| 2 | @mixin table-header-text { |
| 3 | font-family: $font-family; |
| 4 | font-size: 11px; |
| 5 | } |
Explanation (EN)
Moves the mixins into the project's shared mixins directory, which is auto-imported globally, so any component can reuse the same styling definitions without duplicating them.
Objašnjenje (HR)
Premješta mixinove u zajednički direktorij mixinova u projektu, koji se automatski globalno importa, tako da bilo koja komponenta može ponovno koristiti iste definicije stila bez dupliciranja.