From 34b2e6175d9a197f5a612158ac4798e7007241b6 Mon Sep 17 00:00:00 2001
From: skirtle <65301168+skirtles-code@users.noreply.github.com>
Date: Wed, 4 Jan 2023 04:02:10 +0000
Subject: [PATCH] Minor changes suggested by Prettier

---
 .vitepress/theme/components/SponsorsGroup.vue |  2 +-
 .vitepress/theme/components/VueJobs.vue       | 22 +++++++++----------
 .vitepress/theme/styles/vue-mastery.css       |  6 ++---
 src/about/team/TeamHero.vue                   |  2 +-
 .../built-ins/keep-alive-demos/CompA.vue      |  2 +-
 .../built-ins/keep-alive-demos/CompB.vue      |  2 +-
 .../transition-demos/CssAnimation.vue         |  2 +-
 src/guide/extras/demos/SpreadSheet.vue        |  2 +-
 src/guide/scaling-up/TestingApiSwitcher.vue   | 22 +++++++------------
 9 files changed, 28 insertions(+), 34 deletions(-)

diff --git a/.vitepress/theme/components/SponsorsGroup.vue b/.vitepress/theme/components/SponsorsGroup.vue
index 7900489b2f..07ae69aa62 100644
--- a/.vitepress/theme/components/SponsorsGroup.vue
+++ b/.vitepress/theme/components/SponsorsGroup.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { onMounted, onUnmounted } from 'vue'
-import { SponsorData, data, base, load } from './sponsors';
+import { SponsorData, data, base, load } from './sponsors'
 
 const { tier, placement = 'aside' } = defineProps<{
   tier: keyof SponsorData
diff --git a/.vitepress/theme/components/VueJobs.vue b/.vitepress/theme/components/VueJobs.vue
index e4ca1741a1..85524e8595 100644
--- a/.vitepress/theme/components/VueJobs.vue
+++ b/.vitepress/theme/components/VueJobs.vue
@@ -5,17 +5,17 @@ const base = 'https://app.vuejobs.com/feed/vuejs/docs?format=json'
 let items = $ref<Jobs[]>([])
 
 type Jobs = {
-  organization: Organization;
-  title: string;
-  link: string;
-  locations: string[];
-  remote: false | 'ALLOWED' | 'ONLY';
-};
+  organization: Organization
+  title: string
+  link: string
+  locations: string[]
+  remote: false | 'ALLOWED' | 'ONLY'
+}
 
 type Organization = {
-  name: string;
-  avatar: string;
-};
+  name: string
+  avatar: string
+}
 </script>
 
 <script setup lang="ts">
@@ -43,8 +43,8 @@ onMounted(async () => {
         target="_blank"
       >
         <div class="vj-company-logo">
-          <img 
-            :src="job.organization.avatar" 
+          <img
+            :src="job.organization.avatar"
             :alt="`Logo for ${job.organization.name}`" />
         </div>
         <div
diff --git a/.vitepress/theme/styles/vue-mastery.css b/.vitepress/theme/styles/vue-mastery.css
index 34f2bd6ec9..d14bf556e9 100644
--- a/.vitepress/theme/styles/vue-mastery.css
+++ b/.vitepress/theme/styles/vue-mastery.css
@@ -13,8 +13,8 @@
 .vue-mastery-link .banner {
   background-color: var(--vt-c-white-soft);
   border-radius: 4px;
-  width:96px;
-  height:56px;
+  width: 96px;
+  height: 56px;
   object-fit: cover;
 }
 
@@ -50,7 +50,7 @@
 
 @media (max-width: 576px) {
   .vue-mastery-link .banner {
-    width:56px;
+    width: 56px;
   }
 
   .vue-mastery-link .description {
diff --git a/src/about/team/TeamHero.vue b/src/about/team/TeamHero.vue
index 0ad0f9107e..974c61c9a7 100644
--- a/src/about/team/TeamHero.vue
+++ b/src/about/team/TeamHero.vue
@@ -66,7 +66,7 @@
   font-size: 14px;
   font-weight: 500;
   color: var(--vt-c-brand);
-  transition: color .25s;
+  transition: color 0.25s;
 }
 
 .action :deep(a:hover) {
diff --git a/src/guide/built-ins/keep-alive-demos/CompA.vue b/src/guide/built-ins/keep-alive-demos/CompA.vue
index 437524c1d4..d181773f0c 100644
--- a/src/guide/built-ins/keep-alive-demos/CompA.vue
+++ b/src/guide/built-ins/keep-alive-demos/CompA.vue
@@ -4,6 +4,6 @@ let count = $ref(0)
 
 <template>
   <p>Current component: A</p>
-  <span style="margin-right:20px">count: {{ count }}</span>
+  <span style="margin-right: 20px">count: {{ count }}</span>
   <button @click="count++">+</button>
 </template>
diff --git a/src/guide/built-ins/keep-alive-demos/CompB.vue b/src/guide/built-ins/keep-alive-demos/CompB.vue
index b236717e15..643a62f4c5 100644
--- a/src/guide/built-ins/keep-alive-demos/CompB.vue
+++ b/src/guide/built-ins/keep-alive-demos/CompB.vue
@@ -4,6 +4,6 @@ let msg = $ref('')
 
 <template>
   <p>Current component: B</p>
-  <span style="margin-right:20px;">Message is: {{ msg }}</span>
+  <span style="margin-right: 20px">Message is: {{ msg }}</span>
   <input v-model="msg">
 </template>
diff --git a/src/guide/built-ins/transition-demos/CssAnimation.vue b/src/guide/built-ins/transition-demos/CssAnimation.vue
index c91fa613f4..7f16160fbf 100644
--- a/src/guide/built-ins/transition-demos/CssAnimation.vue
+++ b/src/guide/built-ins/transition-demos/CssAnimation.vue
@@ -6,7 +6,7 @@ let show = $ref(true)
   <div class="demo">
     <button @click="show = !show">Toggle</button>
     <Transition name="bounce">
-      <p v-if="show" style="margin-top: 20px; text-align: center;">
+      <p v-if="show" style="margin-top: 20px; text-align: center">
         Hello here is some bouncy text!
       </p>
     </Transition>
diff --git a/src/guide/extras/demos/SpreadSheet.vue b/src/guide/extras/demos/SpreadSheet.vue
index 0f70915676..b280512ccb 100644
--- a/src/guide/extras/demos/SpreadSheet.vue
+++ b/src/guide/extras/demos/SpreadSheet.vue
@@ -16,7 +16,7 @@ const cols = cells.map((_, i) => String.fromCharCode(65 + i))
     <tbody>
       <tr v-for="i in cells[0].length">
         <th>{{ i - 1 }}</th>
-        <td v-for="c, j in cols">
+        <td v-for="(c, j) in cols">
           <Cell :r="i - 1" :c="j"></Cell>
         </td>
       </tr>
diff --git a/src/guide/scaling-up/TestingApiSwitcher.vue b/src/guide/scaling-up/TestingApiSwitcher.vue
index 4a4792f4ca..816f5ce1be 100644
--- a/src/guide/scaling-up/TestingApiSwitcher.vue
+++ b/src/guide/scaling-up/TestingApiSwitcher.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref } from 'vue';
+import { ref } from 'vue'
 const activeId = ref('vtu-api')
 
 const testingLangs = [
@@ -14,9 +14,8 @@ const testingLangs = [
   {
     label: 'Testing Library',
     className: 'testing-library-api'
-  },
+  }
 ]
-
 </script>
 
 <template>
@@ -31,7 +30,7 @@ const testingLangs = [
       >{{ lang.label }}</div>
     </div>
     <div class="code-example">
-      <slot/>
+      <slot />
     </div>
   </div>
 </template>
@@ -44,7 +43,7 @@ const testingLangs = [
   flex-direction: column;
 }
 
-.code-example :slotted([class*=language]) {
+.code-example :slotted([class*='language']) {
   margin-top: 0;
   border-top-left-radius: 0;
 }
@@ -57,7 +56,7 @@ const testingLangs = [
 .tab {
   color: white;
   background: #292d3ef0;
-  border-bottom-color: rgba(255,255,255,0.3);
+  border-bottom-color: rgba(255, 255, 255, 0.3);
   padding: 6px 24px;
   border-width: 2px;
   border-style: solid;
@@ -65,11 +64,7 @@ const testingLangs = [
   border-right: transparent;
   border-left: transparent;
   cursor: pointer;
-  transition: border, background-color .2s;
-    transition-property: border, background-color;
-    transition-duration: 0.2s, 0.2s;
-    transition-timing-function: ease, ease;
-    transition-delay: 0s, 0s;
+  transition: border 0.2s, background-color 0.2s;
 }
 
 .tab.active {
@@ -102,7 +97,7 @@ const testingLangs = [
 }
 
 :global(.dark .testing-code-examples .tab:not(.active)) {
-  border-bottom: 2px solid rgba(255,255,255,.2);
+  border-bottom: 2px solid rgba(255, 255, 255, 0.2);
   background: #2f2f2f;
   color: inherit;
 }
@@ -112,7 +107,7 @@ const testingLangs = [
 }
 
 /* Show/Hide logic for codeblocks */
-:slotted([class$="api"]) {
+:slotted([class$='api']) {
   display: none;
 }
 
@@ -121,5 +116,4 @@ const testingLangs = [
 .prefers-vtu-api :slotted(.vtu-api) {
   display: block;
 }
-
 </style>