Skip to content

Commit 10f6909

Browse files
committed
fixup! docs: add missing standards for building components
1 parent 8af4973 commit 10f6909

File tree

1 file changed

+32
-3
lines changed

1 file changed

+32
-3
lines changed

CODING_STANDARDS.md

Lines changed: 32 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -291,6 +291,34 @@ Native inputs used in components should be exposed to developers through `ng-con
291291
developers to interact directly with the input and allows us to avoid providing custom
292292
implementations for all of the input's native behaviors.
293293

294+
For example:
295+
296+
**Do:**
297+
298+
Implementation
299+
```html
300+
<ng-content></ng-content>
301+
```
302+
303+
Usage
304+
```html
305+
<yourComponent>
306+
<input>
307+
</yourComponent>
308+
```
309+
310+
**Don't:**
311+
312+
Implementation
313+
```html
314+
<input>
315+
```
316+
317+
Usage
318+
```html
319+
<component></component>
320+
```
321+
294322

295323
### Angular
296324

@@ -398,11 +426,12 @@ When it is not super obvious, include a brief description of what a class repres
398426
[ts-mixins]: https://www.typescriptlang.org/docs/handbook/release-notes/typescript-2-2.html#support-for-mix-in-classes
399427

400428
#### Prefer CSS classes to tag names for styling
401-
TODO(wagnermaciel): Ask @jelbourn why we prefer this.
429+
Targeting tag names can cause conflicts with the MDC version of the component. For this reason, use
430+
css class names defined by us instead of tag names.
402431
```scss
403432
/** Do: */
404-
.mat-slider { ... }
433+
.mat-mdc-slider { ... }
405434

406435
/** Don't: */
407-
mat-slider { ... }
436+
mdc-slider { ... }
408437
```

0 commit comments

Comments
 (0)