From 6fef62ef7dbed642637f4eb93b199e8cb9e6cdaa Mon Sep 17 00:00:00 2001
From: David Nixon <david_nixon@us.ibm.com>
Date: Fri, 27 Oct 2023 08:59:37 -0400
Subject: [PATCH] fix: prettier format

Signed-off-by: David Nixon <david_nixon@us.ibm.com>
---
 src/pages/developing/frameworks/vue.mdx | 57 +++++++++++++------------
 1 file changed, 29 insertions(+), 28 deletions(-)

diff --git a/src/pages/developing/frameworks/vue.mdx b/src/pages/developing/frameworks/vue.mdx
index 865b9c22d00..f6e0180349f 100644
--- a/src/pages/developing/frameworks/vue.mdx
+++ b/src/pages/developing/frameworks/vue.mdx
@@ -70,8 +70,8 @@ cd vue-project
 npm install @carbon/vue
 ```
 
-In src/main.js, after `import App from './App.vue'`, add the following to include the
-carbon styles and components.
+In src/main.js, after `import App from './App.vue'`, add the following to
+include the carbon styles and components.
 
 ```js
 import 'carbon-components/css/carbon-components.css';
@@ -79,24 +79,24 @@ import CarbonComponentsVue from '@carbon/vue';
 
 const app = createApp(App);
 app.use(CarbonComponentsVue);
-app.mount("#app");
-// remove the line: createApp(App).mount('#app') 
+app.mount('#app');
+// remove the line: createApp(App).mount('#app')
 ```
 
 Replace the contents of src/components/HelloWorld.vue with the following
 
 ```html
 <script setup>
-import { ref } from 'vue';
-
-const yourName = ref('')
-const visible = ref(false)
-function onClick() {
-  visible.value = true;
-}
-function modalClosed() {
-  visible.value = false;
-}
+  import { ref } from 'vue';
+
+  const yourName = ref('');
+  const visible = ref(false);
+  function onClick() {
+    visible.value = true;
+  }
+  function modalClosed() {
+    visible.value = false;
+  }
 </script>
 
 <template>
@@ -119,21 +119,21 @@ function modalClosed() {
         </p>
       </template>
     </cv-modal>
-  </div>	
+  </div>
 </template>
 
 <style scoped lang="css">
-.sample {
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-  max-width: 600px;
-  margin: 5% auto;
-}
-.sample > div {
-  margin: 30px 0;
-}
+  .sample {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    max-width: 600px;
+    margin: 5% auto;
+  }
+  .sample > div {
+    margin: 30px 0;
+  }
 </style>
 ```
 
@@ -145,8 +145,9 @@ npm run dev
 
 _Note: This isn't the only way to bootstrap a_ `carbon-components-vue`
 _application, but the combination of_ `Vue CLI` _and the_ `carbon-components`
-_scss is our recommended setup._
-See [Hello carbon vue3](https://github.com/IBM/hello-carbon-vue3) for a complete example app.
+_scss is our recommended setup._ See
+[Hello carbon vue3](https://github.com/IBM/hello-carbon-vue3) for a complete
+example app.
 
 ### List of available components