diff --git a/CODING_STANDARDS.md b/CODING_STANDARDS.md index 7782c7d3a147..7631601c6c07 100644 --- a/CODING_STANDARDS.md +++ b/CODING_STANDARDS.md @@ -203,7 +203,7 @@ specific error being caught and why it cannot be prevented. ##### General * Prefer writing out words instead of using abbreviations. -* Prefer *exact* names over short names (within reason). E.g., `labelPosition` is better than +* Prefer *exact* names to short names (within reason). E.g., `labelPosition` is better than `align` because the former much more exactly communicates what the property means. * Except for `@Input` properties, use `is` and `has` prefixes for boolean properties / methods. @@ -275,7 +275,7 @@ The above code allows users to set `disabled` similar to how it can be set on na #### Expose native inputs Native inputs used in components should be exposed to developers through `ng-content`. This allows developers to interact directly with the input and allows us to avoid providing custom -implementations for all of the input's native behaviors. +implementations for all the input's native behaviors. For example: @@ -320,12 +320,12 @@ pre-rendering). #### Be cautious with use of `display: flex` * The [baseline calculation for flex elements](https://www.w3.org/TR/css-flexbox-1/#flex-baselines) -is different than other display values, making it difficult to align flex elements with standard +is different from other display values, making it difficult to align flex elements with standard elements like input and button. * Component outermost elements are never flex (block or inline-block) * Don't use `display: flex` on elements that will contain projected content. -#### Use lowest specificity possible +#### Use the lowest specificity possible Always prioritize lower specificity over other factors. Most style definitions should consist of a single element or css selector plus necessary state modifiers. **Avoid SCSS nesting for the sake of code organization.** This will allow users to much more easily override styles. @@ -413,7 +413,7 @@ When it is not super obvious, include a brief description of what a class repres #### Prefer CSS classes to tag names and attributes for styling Targeting tag names can cause conflicts with the MDC version of the component. For this reason, use -CSS class names defined by us instead of tag names. We also prefer classes over attributes for +CSS class names defined by us instead of tag names. We also prefer classes to attributes for consistency. ```scss /** Do: */