formatting and prettier

johnpapa · Dec 9, 2018 · 9a1442f · 9a1442f
1 parent bb8bc33
commit 9a1442f
Show file tree

Hide file tree

Showing 18 changed files with 81 additions and 60 deletions.
diff --git a/.prettierrc b/.prettierrc
@@ -0,0 +1,6 @@
+{
+  "printWidth": 80,
+  "singleQuote": true,
+  "bracketSpacing": true,
+  "trailingComma": "es5"
+}
diff --git a/src/app.vue b/src/app.vue
@@ -24,5 +24,4 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>
diff --git a/src/components/button-footer.vue b/src/components/button-footer.vue
@@ -49,5 +49,4 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>
diff --git a/src/components/card-content.vue b/src/components/card-content.vue
@@ -23,5 +23,4 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>
diff --git a/src/components/header-bar-brand.vue b/src/components/header-bar-brand.vue
@@ -30,5 +30,4 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>
diff --git a/src/components/header-bar-links.vue b/src/components/header-bar-links.vue
@@ -29,5 +29,4 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>
diff --git a/src/components/header-bar.vue b/src/components/header-bar.vue
@@ -21,5 +21,4 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>
diff --git a/src/components/list-header.vue b/src/components/list-header.vue
@@ -6,7 +6,11 @@
     <button class="button add-button" @click="handleAdd" aria-label="add">
       <i class="fas fa-plus" aria-hidden="true"></i>
     </button>
-    <button class="button refresh-button" @click="handleRefresh" aria-label="refresh">
+    <button
+      class="button refresh-button"
+      @click="handleRefresh"
+      aria-label="refresh"
+    >
       <i class="fas fa-sync" aria-hidden="true"></i>
     </button>
   </div>
@@ -36,5 +40,4 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>
diff --git a/src/components/modal.vue b/src/components/modal.vue
@@ -38,5 +38,4 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>
diff --git a/src/components/nav-bar.vue b/src/components/nav-bar.vue
@@ -9,5 +9,4 @@
   </nav>
 </template>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>
diff --git a/src/components/page-not-found.vue b/src/components/page-not-found.vue
@@ -7,5 +7,4 @@
   </div>
 </template>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>
diff --git a/src/views/about.vue b/src/views/about.vue
@@ -2,43 +2,59 @@
   <div class="content-container">
     <div class="content-title-group not-found">
       <h2 class="title">Tour of Heroes</h2>
-      <p>This project was created to help represent a fundamental app written with Vue. The heroes and villains theme is used throughout the app.</p>
       <p>
-        by
-        <a href="http://twitter.com/john_papa">John Papa</a>
+        This project was created to help represent a fundamental app written
+        with Vue. The heroes and villains theme is used throughout the app.
       </p>
-      <br>
+      <p>by <a href="http://twitter.com/john_papa">John Papa</a></p>
+      <br />
       <h2 class="title">Why</h2>
-      <p>I love JavaScript and the Web! One of the most common questions I hear is "which framework is best?". I like to flip this around and ask you "which is best for you?". The best way to know this is to try it for yourself. I'll follow up with some articles on my experiences with these frameworks but in the meantime, please try it for yourself to gain your own experience with each.</p>
-      <br>
+      <p>
+        I love JavaScript and the Web! One of the most common questions I hear
+        is "which framework is best?". I like to flip this around and ask you
+        "which is best for you?". The best way to know this is to try it for
+        yourself. I'll follow up with some articles on my experiences with these
+        frameworks but in the meantime, please try it for yourself to gain your
+        own experience with each.
+      </p>
+      <br />
       <h2 class="title">Comparative Apps</h2>
       <ul>
         <li>
-          <a href="https://github.com/johnpapa/heroes-angular">github.com/johnpapa/heroes-angular</a>
+          <a href="https://github.com/johnpapa/heroes-angular"
+            >github.com/johnpapa/heroes-angular</a
+          >
         </li>
         <li>
-          <a href="https://github.com/johnpapa/heroes-react">github.com/johnpapa/heroes-react</a>
+          <a href="https://github.com/johnpapa/heroes-react"
+            >github.com/johnpapa/heroes-react</a
+          >
         </li>
         <li>
-          <a href="https://github.com/johnpapa/heroes-vue">github.com/johnpapa/heroes-vue</a>
+          <a href="https://github.com/johnpapa/heroes-vue"
+            >github.com/johnpapa/heroes-vue</a
+          >
         </li>
       </ul>
-      <br>
+      <br />
       <h2 class="title">Live Demos</h2>
-      <p>
-        Hosted in
-        <a href="https://aka.ms/jp-free">Azure</a>
-      </p>
+      <p>Hosted in <a href="https://aka.ms/jp-free">Azure</a></p>
 
       <ul>
         <li>
-          <a href="https://papa-heroes-angular.azurewebsites.net">Tour of Heroes with Angular</a>
+          <a href="https://papa-heroes-angular.azurewebsites.net"
+            >Tour of Heroes with Angular</a
+          >
         </li>
         <li>
-          <a href="https://papa-heroes-react.azurewebsites.net">Tour of Heroes with React</a>
+          <a href="https://papa-heroes-react.azurewebsites.net"
+            >Tour of Heroes with React</a
+          >
         </li>
         <li>
-          <a href="https://papa-heroes-vue.azurewebsites.net">Tour of Heroes with Vue</a>
+          <a href="https://papa-heroes-vue.azurewebsites.net"
+            >Tour of Heroes with Vue</a
+          >
         </li>
       </ul>
     </div>

diff --git a/src/views/heroes/hero-detail.vue b/src/views/heroes/hero-detail.vue
@@ -14,7 +14,7 @@
             readonly
             type="text"
             v-model="editingHero.id"
-          >
+          />
         </div>
         <div class="field">
           <label class="label" for="name">name</label>
@@ -24,7 +24,7 @@
             placeholder="e.g. Colleen"
             type="text"
             v-model="editingHero.name"
-          >
+          />
         </div>
         <div class="field">
           <label class="label" for="description">description</label>
@@ -34,7 +34,7 @@
             placeholder="dance fight!"
             type="text"
             v-model="editingHero.description"
-          >
+          />
         </div>
       </div>
     </div>
@@ -100,5 +100,4 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>
diff --git a/src/views/heroes/hero-list.vue b/src/views/heroes/hero-list.vue
@@ -2,7 +2,7 @@
   <ul class="list">
     <li v-for="(hero, index) in heroes" :key="hero.id" role="presentation">
       <div class="card">
-        <CardContent :name="hero.name" :description="hero.description"/>
+        <CardContent :name="hero.name" :description="hero.description" />
         <footer class="card-footer">
           <ButtonFooter
             class="delete-item"
@@ -59,5 +59,4 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>
diff --git a/src/views/heroes/heroes.vue b/src/views/heroes/heroes.vue
@@ -1,6 +1,11 @@
 <template>
   <div class="content-container">
-    <ListHeader :title="title" @refresh="getHeroes" @add="enableAddMode" :routePath="routePath"></ListHeader>
+    <ListHeader
+      :title="title"
+      @refresh="getHeroes"
+      @add="enableAddMode"
+      :routePath="routePath"
+    ></ListHeader>
     <div class="columns is-multiline is-variable">
       <div class="column is-8" v-if="heroes">
         <HeroList
@@ -10,7 +15,12 @@
           @deleted="askToDelete($event)"
           @selected="select($event)"
         ></HeroList>
-        <HeroDetail v-if="selected" :hero="selected" @unselect="clear" @save="save"></HeroDetail>
+        <HeroDetail
+          v-if="selected"
+          :hero="selected"
+          @unselect="clear"
+          @save="save"
+        ></HeroDetail>
       </div>
     </div>
 
@@ -20,7 +30,8 @@
       :isOpen="showModal"
       @handleNo="closeModal"
       @handleYes="deleteHero"
-    ></Modal>
+    >
+    </Modal>
   </div>
 </template>
 
@@ -104,5 +115,4 @@ export default {
 };
 </script>
 
-<style lang="scss">
-</style>
+<style lang="scss"></style>
diff --git a/src/views/villains/villain-detail.vue b/src/views/villains/villain-detail.vue
@@ -14,7 +14,7 @@
             readonly
             type="text"
             v-model="editingVillain.id"
-          >
+          />
         </div>
         <div class="field">
           <label class="label" for="name">name</label>
@@ -24,7 +24,7 @@
             placeholder="e.g. Colleen"
             type="text"
             v-model="editingVillain.name"
-          >
+          />
         </div>
         <div class="field">
           <label class="label" for="description">description</label>
@@ -34,7 +34,7 @@
             placeholder="dance fight!"
             type="text"
             v-model="editingVillain.description"
-          >
+          />
         </div>
       </div>
     </div>
@@ -100,5 +100,4 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>
diff --git a/src/views/villains/villain-list.vue b/src/views/villains/villain-list.vue
@@ -63,5 +63,4 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>
diff --git a/src/views/villains/villains.vue b/src/views/villains/villains.vue
@@ -118,5 +118,4 @@ export default {
 };
 </script>
 
-<style lang="scss">
-</style>
+<style lang="scss"></style>