stylelint-plugin-defensive-css icon indicating copy to clipboard operation
stylelint-plugin-defensive-css copied to clipboard

Support for a Fixed Size Rule

Open yuschick opened this issue 1 year ago • 0 comments

Is your feature request related to a problem? Please describe.

One of the most impactful Defensive CSS practices is to be aware of and avoid fixed element sizes where needed. There are some element's that can have a fixed size, but a lot of elements should avoid this from happening.

Ideally, this plugin would warn against fixed sizes.

Describe the solution you'd like

The plugin would need to check for several properties and/or variations. For example:

  • if an element has only a height/width or block/inline-size value
    • if this property does not have a value that contains a keyword like 'clamp()', 'max()' or 'min()'
    • also, if this property does not have a custom property value that maps to a dynamic element size
    • or an @ property that maps to a fluid size

Additional context

This rule should support 'ignore'ing specific properties. Like, a codebase may want warned about fixed heights, but want to ignore fixed widths. Likewise with ignoring specific values. A codebase may want to ignore their own branded custom properties like var(--brand-*) from being warned.

This should also support a threshold, like don't warn on any fixed values below 480, for example.

yuschick avatar Aug 21 '23 06:08 yuschick