module.exports = { extends: '@wagtail/stylelint-config-wagtail', rules: { 'scss/at-rule-no-unknown': [ true, { ignoreAtRules: [ 'tailwind', 'apply', 'variants', 'responsive', 'screen', 'layer', ], }, ], 'no-invalid-position-at-import-rule': [ true, { ignoreAtRules: ['tailwind', 'use'], }, ], // Would be valuable for strict BEM components but is too hard to enforce with legacy code. 'no-descending-specificity': null, // Override stylelint-config-wagtail’s options to allow all float and clear values for now. 'declaration-property-value-allowed-list': { // 'clear': ['both', 'none'], // 'float': ['inline-start', 'inline-end', 'none', 'unset'], 'text-align': ['start', 'end', 'center'], }, // Some parts of declaration-strict-value commented out until we are in a position to enforce them. 'scale-unlimited/declaration-strict-value': [ [ // Colors should always be defined from variables or functions. '/color/', 'fill', 'stroke', // Font tokens should come from our design tokens. 'font-family', // 'font-size', // 'font-weight', // Spacing should use a consistent scale rather than hard-coded values. // '/margin/', // '/padding/', // 'gap', // Consistently using variables for z-index allows us to define the order of the values globally. // 'z-index', ], { ignoreValues: [ 'currentColor', 'inherit', 'initial', 'none', 'unset', 'transparent', 'ActiveText', 'Highlight', 'ButtonText', ], }, ], }, };