Simplify Readme #515
Simplify Readme #515
Conversation
* removes inline docs and points to web site docs * refines examples
README.md
Outdated
| @@ -1,289 +1,83 @@ | |||
| # LitElement | |||
| A simple base class for creating fast, lightweight web components. | |||
README.md
Outdated
|
|
||
| Full documentation is available at [lit-element.polymer-project.org](https://lit-element.polymer-project.org). | ||
|
|
||
| Docs source is in the `docs` folder. To build the site youself, see the instructions in [docs/README.md](docs/README.md). |
There was a problem hiding this comment.
I think we should move this into CONTRIBUTING.md for both projects
README.md
Outdated
| super(); | ||
| this.mood = 'happy'; | ||
| } | ||
| // Provide styling for the element. |
There was a problem hiding this comment.
maybe too many comments...
README.md
Outdated
| <script type="module"> | ||
| import {LitElement, html} from 'lit-element'; | ||
| ```ts | ||
| import {LitElement, html, css} from 'lit-element'; |
There was a problem hiding this comment.
import customElement and property
README.md
Outdated
| this.mood = 'happy'; | ||
| } | ||
| // Provide styling for the element. | ||
| static styles = css`.mood { color: green; }`; |
There was a problem hiding this comment.
I'd add a newline after `
README.md
Outdated
| this.mood = 'happy'; | ||
| } | ||
| // Provide styling for the element. | ||
| static styles = css`.mood { color: green; }`; |
There was a problem hiding this comment.
Why not use an id as a selector to show of that that works in shadow dom? also class and property both named "mood" is maybe confusing.
|
|
||
| } | ||
| customElements.define('my-element', MyElement); | ||
| ```bash |
There was a problem hiding this comment.
From inside your project folder, run:
README.md
Outdated
| ## Bigger Example | ||
| ```html | ||
| <my-element mood="awesome"></my-element> | ||
| ``` | ||
|
|
||
| Note, this example uses decorators to create properties. Decorators are a proposed | ||
| standard currently available in [TypeScript](https://www.typescriptlang.org/) or [Babel](https://babeljs.io/docs/en/babel-plugin-proposal-decorators). |
There was a problem hiding this comment.
Add to this paragraph:
LitElementalso supports a vanilla JavaScript method of declaring reactive properties.
(maybe with a link to the docs section for that?)
Fixes #514