Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Simplify Readme #515

Merged
merged 3 commits into from
Feb 4, 2019
Merged

Simplify Readme #515

merged 3 commits into from
Feb 4, 2019

Conversation

sorvell
Copy link
Member

@sorvell sorvell commented Feb 1, 2019

Fixes #514

  • removes inline docs and points to web site docs
  • refines examples

* 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.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

"...with lit-html"?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done.

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).
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think we should move this into CONTRIBUTING.md for both projects

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done.

README.md Outdated
super();
this.mood = 'happy';
}
// Provide styling for the element.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

maybe too many comments...

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Removed.

README.md Outdated
<script type="module">
import {LitElement, html} from 'lit-element';
```ts
import {LitElement, html, css} from 'lit-element';
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

import customElement and property

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Added.

README.md Outdated
this.mood = 'happy';
}
// Provide styling for the element.
static styles = css`.mood { color: green; }`;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'd add a newline after `

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done

README.md Outdated
this.mood = 'happy';
}
// Provide styling for the element.
static styles = css`.mood { color: green; }`;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Simplified


}
customElements.define('my-element', MyElement);
```bash
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

From inside your project folder, run:

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done.

Copy link
Member

@kevinpschaaf kevinpschaaf left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Minor suggestion.

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).
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Add to this paragraph:

LitElement also supports a vanilla JavaScript method of declaring reactive properties.

(maybe with a link to the docs section for that?)

Copy link
Member

@kevinpschaaf kevinpschaaf left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@dorivaught dorivaught added this to the 2.0.0 milestone Feb 4, 2019
@sorvell sorvell merged commit 144872c into master Feb 4, 2019
@sorvell sorvell deleted the simplify-readme branch February 4, 2019 18:50
@sorvell sorvell mentioned this pull request Feb 4, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants