fixed a lot of details in the docs to make it better

docs/src/examples/how-to-add-custom-controls.md

@@ -1,14 +1,12 @@
 # How to add custom controls
 
-[Interactive example on Condesandbox](https://stackblitz.com/edit/vue-google-maps-marker-ry3zf7?file=src/components/ComponentWithMap.vue)
-
-
-To add custom controls, you can access google maps object and add controls to it, look at this example or follow the interactive example on condesandbox above. 
+[Interactive example on CodeSandbox](https://stackblitz.com/edit/vue-google-maps-marker-ry3zf7?file=src/components/ComponentWithMap.vue)
 
+To add custom controls, you can access google maps object and add controls to it, look at this example or follow the interactive example on CodeSandbox above.
 
 ## Example
 
-```bash
+```html
 <template>
   <GMapMap
     :center="center"
@@ -31,75 +29,73 @@ To add custom controls, you can access google maps object and add controls to it
 </template>
 
 <script>
-export default {
-  mounted() {
-    this.$refs.myMapRef.$mapPromise.then((map) => {
-      // Create the DIV to hold the control and call the CenterControl()
-      // constructor passing in this DIV.
-      const centerControlDiv = document.createElement('div');
-      this.addCenterControl(centerControlDiv, map);
-      map.controls[google.maps.ControlPosition.TOP_CENTER].push(
-        centerControlDiv
-      );
-    });
-  },
-  methods: {
-    addCenterControl(controlDiv, map) {
-      const controlUI = document.createElement('div');
+  export default {
+    mounted() {
+      this.$refs.myMapRef.$mapPromise.then((map) => {
+        // Create the DIV to hold the control and call the CenterControl()
+        // constructor passing in this DIV.
+        const centerControlDiv = document.createElement('div')
+        this.addCenterControl(centerControlDiv, map)
+        map.controls[google.maps.ControlPosition.TOP_CENTER].push(centerControlDiv)
+      })
+    },
+    methods: {
+      addCenterControl(controlDiv, map) {
+        const controlUI = document.createElement('div')
 
-      controlUI.innerHTML = `
+        controlUI.innerHTML = `
         <div style="color: white; background: red; padding: 1rem;">
           You can click me, i can also be a vue component
         </div>
-      `;
+      `
 
-      controlDiv.appendChild(controlUI);
-      controlUI.addEventListener('click', () => {
-        // Do what ever you want to happen on click event
-        map.setCenter({
-          lat: 53.57532,
-          lng: 10.01534,
-        });
-      });
+        controlDiv.appendChild(controlUI)
+        controlUI.addEventListener('click', () => {
+          // Do what ever you want to happen on click event
+          map.setCenter({
+            lat: 53.57532,
+            lng: 10.01534,
+          })
+        })
+      },
     },
-  },
-  data() {
-    return {
-      center: { lat: 51.093048, lng: 6.84212 },
-      markers: [
-        {
-          position: {
-            lat: 51.093048,
-            lng: 6.84212,
+    data() {
+      return {
+        center: { lat: 51.093048, lng: 6.84212 },
+        markers: [
+          {
+            position: {
+              lat: 51.093048,
+              lng: 6.84212,
+            },
           },
-        },
-        {
-          position: {
-            lat: 51.198429,
-            lng: 6.69529,
+          {
+            position: {
+              lat: 51.198429,
+              lng: 6.69529,
+            },
           },
-        },
-        {
-          position: {
-            lat: 51.165218,
-            lng: 7.067116,
+          {
+            position: {
+              lat: 51.165218,
+              lng: 7.067116,
+            },
           },
-        },
-        {
-          position: {
-            lat: 51.09256,
-            lng: 6.84074,
+          {
+            position: {
+              lat: 51.09256,
+              lng: 6.84074,
+            },
           },
-        },
-      ],
-    };
-  },
-};
+        ],
+      }
+    },
+  }
 </script>
 
 <style>
-body {
-  margin: 0;
-}
+  body {
+    margin: 0;
+  }
 </style>
 ```