[WIP] docs(style-guide): create examples

[Foxandxss]

This PR creates all the examples in disk so when we finish the style guide, we can connect both.

I am creating the obvious examples until we figure out what to do with the complex ones (the ones that are incomplete).

So far I am creating a kitchen-sink file with the avoid part and then individual files for each recommended file.

I am not really sure if I need to put the /* recommended */ comment at the top of each of the good ones or not.

I will update this PR with all the examples and rebase it with new versions of the style guide comes out or if we change some conventions in how to create this files.

[johnpapa]

@wardbell and I discussed and agreed we should remove the /* recommended */. Let's scrub those.

I like the rest.

Feel free to refactor 01-01 too, to your new pattern.

Thanks!

[Foxandxss]

Please @johnpapa re-review. Also @wardbell.

I finished all the code (except 1) from version 3 of the guide (will rebase as soon as version 4 gets merged).

The conventions I put are:

• kitchen-sink.ts / html - for typescript and html code to avoid. We can ignore those files for tests / lint.
• For those recommended examples that are only html in "how to consume this component" I created an app.component.html with it.

There is one code example that we need to figure out how to change it. 08-03 which basically has:

@HostListener('mouseenter') onMouseEnter() {...}

I can't make a runnable example with that {...} so we can change it with { }

On the other hand, I dropped the comments except the kitchen-sink.ts which has an AVOID THIS PATTERN which I am not sure if I have to leave in all examples.

Last but not least, there are a lot of examples that need related services / models to be tested, but I can add those when the time comes. So far I put all the needed code we can swap our examples with makeExample.

[johnpapa]

I like the idea of renaming the kitchen-sink to avoid extensions. Thoughts?

[johnpapa]

@wardbell Please merge this in and pull into docs-style-guide-4 so I can start integrating them.

Then @Foxandxss can move on from there.

[wardbell]

closing after incorporating in #1180