Skip to content

Instantly share code, notes, and snippets.

@Westbrook

Westbrook/index.html

Created May 8, 2023 03:54
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Westbrook/3c0b21242b2efeaa1f736353da38fd7e to your computer and use it in GitHub Desktop.
Save Westbrook/3c0b21242b2efeaa1f736353da38fd7e to your computer and use it in GitHub Desktop.
Download ZIP
Raw
index.html
<!DOCTYPE html>
<head>
<script type="module" src="./simple-greeting.js"></script>
</head>
<body>
<simple-greeting name="World"></simple-greeting>
</body>
Raw
package.json
{
"dependencies": {
"lit": "^2.0.0",
"@lit/reactive-element": "^1.0.0",
"lit-element": "^3.0.0",
"lit-html": "^2.0.0"
}
}
Raw
simple-greeting.ts
import {html, css, LitElement} from 'lit';
import {customElement, property} from 'lit/decorators.js';
@customElement('simple-greeting')
export class SimpleGreeting extends LitElement {
static styles = css`p { color: blue }`;
@property()
name = 'Somebody';
render() {
return html`<p>Hello, ${this.name}!</p>`;
}
}
Raw
zzzzzzzzzz-lit-dev-playground-metadata.json
{
"files": {
"simple-greeting.ts": {
"position": 0
},
"index.html": {
"position": 1
},
"package.json": {
"position": 2,
"hidden": true
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment