Address feedback. Fixes #821. (#834)

* Address feedback. Fixes #821.

* Missed one.

Author: Arthur Evans

packages/lit-dev-content/samples/tutorials/reactivity/00/before/my-element.ts

@@ -16,9 +16,8 @@ export class MyElement extends LitElement {
 
   render() {
     return html`
-    <button @click=${this.flipCoin}>Flip a coin!</button>
-    <p>Result: ${this.result}</p>
-
+      <button @click=${this.flipCoin}>Flip a coin!</button>
+      <p>Result: ${this.result}</p>
     `;
   }
 }

packages/lit-dev-content/samples/tutorials/reactivity/01/after/my-element.ts

@@ -16,8 +16,8 @@ export class MyElement extends LitElement {
 
   render() {
     return html`
-    <button @click=${this.flipCoin}>Flip a coin!</button>
-    <p>Result: ${this.result}</p>
+      <button @click=${this.flipCoin}>Flip a coin!</button>
+      <p>Result: ${this.result}</p>
     `;
   }
 }

packages/lit-dev-content/samples/tutorials/reactivity/01/before/my-element.js

@@ -17,9 +17,8 @@ export class MyElement extends LitElement {
 
   render() {
     return html`
-    <button @click=${this.flipCoin}>Flip a coin!</button>
-    <p>Result: ${this.result}</p>
-
+      <button @click=${this.flipCoin}>Flip a coin!</button>
+      <p>Result: ${this.result}</p>
     `;
   }
 }

packages/lit-dev-content/samples/tutorials/reactivity/01/before/my-element.ts

@@ -15,9 +15,8 @@ export class MyElement extends LitElement {
 
   render() {
     return html`
-    <button @click=${this.flipCoin}>Flip a coin!</button>
-    <p>Result: ${this.result}</p>
-
+      <button @click=${this.flipCoin}>Flip a coin!</button>
+      <p>Result: ${this.result}</p>
     `;
   }
 }

packages/lit-dev-content/samples/tutorials/reactivity/02/after/my-element.ts

@@ -15,8 +15,8 @@ export class MyElement extends LitElement {
 
   render() {
     return html`
-    ${map(this.groceries, (item) =>
-      html`<button @click=${() => this.removeItem(item)}>x</button>  ${item}<br>`
+      ${map(this.groceries, (item) =>
+        html`<button @click=${() => this.removeItem(item)}>x</button>  ${item}<br>`
       )}
     `;
   }

packages/lit-dev-content/samples/tutorials/reactivity/02/before/my-element.ts

@@ -14,8 +14,8 @@ export class MyElement extends LitElement {
 
   render() {
     return html`
-    ${map(this.groceries, (item) =>
-      html`<button @click=${() => this.removeItem(item)}>x</button> ${item}<br>`
+      ${map(this.groceries, (item) =>
+        html`<button @click=${() => this.removeItem(item)}>x</button> ${item}<br>`
       )}
     `;
   }

packages/lit-dev-content/samples/tutorials/reactivity/04/after/my-element.ts

@@ -31,6 +31,6 @@ export class MyElement extends LitElement {
       <label>Backward: <input id="backward" @input=${this.onInput} .value=${this.backward}></label>
       <div>Forward text: ${this.forward}</div>
       <div>Backward text: ${this.backward}</div>
-    `
+    `;
   }
 }

packages/lit-dev-content/samples/tutorials/reactivity/04/before/my-element.ts

@@ -21,6 +21,6 @@ export class MyElement extends LitElement {
       <label>Backward: <input id="backward" @input=${this.onInput} .value=${this.backward}></label>
       <div>Forward text: ${this.forward}</div>
       <div>Backward text: ${this.backward}</div>
-    `
+    `;
   }
 }

packages/lit-dev-content/samples/tutorials/reactivity/05/after/my-element.ts

@@ -33,7 +33,7 @@ export class MyElement extends LitElement {
     if (changedProperties.has('_showMessage')) {
       const final = this._message.getBoundingClientRect().width;
       const starting = 0 - final;
-      var player = this._message.animate([
+      this._message.animate([
         { transform: `translateX(${starting}px)` },
         { transform: `translateX(0)` }
       ], {

packages/lit-dev-content/samples/tutorials/reactivity/05/before/my-element.ts

@@ -18,7 +18,7 @@ export class MyElement extends LitElement {
   _showMessage = false;
 
   @query('#message')
-  _message!: HTMLParagraphElement;
+  _message!: HTMLDivElement;
 
   render() {
     return html`