material-components-web icon indicating copy to clipboard operation
material-components-web copied to clipboard

Improve Sass module system documentation

Open asyncliz opened this issue 5 years ago • 1 comments

Feature Request

We've had several issues related to confusion around the Sass module system. We should improve our documentation per component that explains how to import mixins, customize variables, and apply core styles.

Proposed solution

For example, take button's README. It displays the following under the Styles section with no further context.

@use "@material/button/mdc-button";

This should be expanded to refer to how to customize.

@use "@material/button/mdc-button"; // apply core styles
@use "@material/button"; // import mixins to customize

Our mixin documentation could also be improved by adding the prefix of the package name to make it easier to copy/paste and remind users of the sass module system. In button's Sass Mixins section for example, we should document button.height($height) instead of just height($height).

Alternatives considered

None considered yet, we should discuss how best to concisely represent the Sass module system in our docs.

Additional context

N/A

asyncliz avatar Mar 17 '20 19:03 asyncliz

I am quite suprised to see that nothing is written here since this issue was opened 3 years ago. Am I on the wrong forest looking for documentation about what actually works?

lborgman avatar Jan 11 '23 20:01 lborgman