Fixed the usage of '✗ BAD' and '✓ GOOD' in the documentation (#1202)

Author: danyadev

docs/rules/attribute-hyphenation.md

@@ -18,10 +18,10 @@ This rule enforces using hyphenated attribute names on custom components in Vue
 
 ```vue
 <template>
-  <!-- ✔ GOOD -->
+  <!-- ✓ GOOD -->
   <MyComponent my-prop="prop" />
 
-  <!-- ✘ BAD -->
+  <!-- ✗ BAD -->
   <MyComponent myProp="prop" />
 </template>
 ```
@@ -51,10 +51,10 @@ It errors on upper case letters.
 
 ```vue
 <template>
-  <!-- ✔ GOOD -->
+  <!-- ✓ GOOD -->
   <MyComponent my-prop="prop" />
 
-  <!-- ✘ BAD -->
+  <!-- ✗ BAD -->
   <MyComponent myProp="prop" />
 </template>
 ```
@@ -68,34 +68,34 @@ It errors on hyphens except `data-`, `aria-` and `slot-scope`.
 
 ```vue
 <template>
-  <!-- ✔ GOOD -->
+  <!-- ✓ GOOD -->
   <MyComponent myProp="prop" />
   <MyComponent data-id="prop" />
   <MyComponent aria-role="button" />
   <MyComponent slot-scope="prop" />
 
-  <!-- ✘ BAD -->
+  <!-- ✗ BAD -->
   <MyComponent my-prop="prop" />
 </template>
 ```
 
 </eslint-code-block>
 
-### `"never", { "ignore": ["custom-prop"] }` 
+### `"never", { "ignore": ["custom-prop"] }`
 Don't use hyphenated name but allow custom attributes
 
 <eslint-code-block fix :rules="{'vue/attribute-hyphenation': ['error', 'never', { ignore: ['custom-prop']}]}">
 
 ```vue
 <template>
-  <!-- ✔ GOOD -->
+  <!-- ✓ GOOD -->
   <MyComponent myProp="prop" />
   <MyComponent custom-prop="prop" />
   <MyComponent data-id="prop" />
   <MyComponent aria-role="button" />
   <MyComponent slot-scope="prop" />
 
-  <!-- ✘ BAD -->
+  <!-- ✗ BAD -->
   <MyComponent my-prop="prop" />
 </template>
 ```

docs/rules/custom-event-name-casing.md

@@ -23,21 +23,21 @@ See [Guide - Custom Events] for more details.
 
 ```vue
 <template>
-  <!-- ✔ GOOD -->
+  <!-- ✓ GOOD -->
   <button @click="$emit('my-event')" />
 
-  <!-- ✘ BAD -->
+  <!-- ✗ BAD -->
   <button @click="$emit('myEvent')" />
 </template>
 <script>
 export default {
   methods: {
     onClick () {
-      /* ✔ GOOD */
+      /* ✓ GOOD */
       this.$emit('my-event')
       this.$emit('update:myProp', myProp)
 
-      /* ✘ BAD */
+      /* ✗ BAD */
       this.$emit('myEvent')
     }
   }

docs/rules/no-potential-component-option-typo.md

@@ -18,8 +18,7 @@ This rule disallow a potential typo in your component options
   "vue/no-potential-component-option-typo": ["error", {
     "presets": ["all"],
     "custom": ["test"]
-    }
-  ]
+  }]
 }
 ```
 
@@ -30,21 +29,21 @@ This rule disallow a potential typo in your component options
 export default {
   /* ✓ GOOD */
   props: {
-    
+
   },
-  /* × BAD */
+  /* ✗ BAD */
   method: {
 
   },
   /* ✓ GOOD */
   data: {
-    
+
   },
-  /* × BAD */
+  /* ✗ BAD */
   beforeRouteEnteR() {
 
   },
-  /* × BAD due to custom option 'test'*/
+  /* ✗ BAD due to custom option 'test' */
   testt: {
 
   }
@@ -72,19 +71,19 @@ export default {
 ```vue
 <script>
 export default {
-  /* ✓ BAD, due to threshold is 5 */
+  /* ✓ GOOD, due to threshold is 5 */
   props: {
-    
+
   },
-  /* ✓ BAD, due to threshold is 5 */
+  /* ✓ GOOD, due to threshold is 5 */
   method: {
 
   },
-  /* ✓ BAD, due to threshold is 5 */
+  /* ✓ GOOD, due to threshold is 5 */
   data: {
-    
+
   },
-  /* × GOOD, due to we don't choose vue-router preset or add a custom option */
+  /* ✗ BAD, due to we don't choose vue-router preset or add a custom option */
   beforeRouteEnteR() {
 
   }

docs/rules/no-restricted-static-attribute.md

@@ -25,7 +25,7 @@ This rule takes a list of strings, where each string is a attribute name or patt
 
 ```vue
 <template>
-  <!-- ✘ BAD -->
+  <!-- ✗ BAD -->
   <div foo="x" />
   <div bar />
 </template>
@@ -62,7 +62,7 @@ The following properties can be specified for the object.
   <!-- ✓ GOOD -->
   <div foo="foo" />
 
-  <!-- ✘ BAD -->
+  <!-- ✗ BAD -->
   <div foo="bar" />
 </template>
 ```
@@ -78,7 +78,7 @@ The following properties can be specified for the object.
   <!-- ✓ GOOD -->
   <CoolButton foo="x" />
 
-  <!-- ✘ BAD -->
+  <!-- ✗ BAD -->
   <MyButton foo="x" />
 </template>
 ```

docs/rules/no-restricted-syntax.md

@@ -25,11 +25,11 @@ Forbids call expressions inside mustache interpolation.
 
 ```vue
 <template>
-  <!-- ✔ GOOD -->
+  <!-- ✓ GOOD -->
   <div> {{ foo }} </div>
   <div> {{ foo.bar }} </div>
 
-  <!-- ✘ BAD -->
+  <!-- ✗ BAD -->
   <div> {{ foo() }} </div>
   <div> {{ foo.bar() }} </div>
   <div> {{ foo().bar }} </div>

docs/rules/no-restricted-v-bind.md

@@ -25,7 +25,7 @@ This rule takes a list of strings, where each string is a argument name or patte
 
 ```vue
 <template>
-  <!-- ✘ BAD -->
+  <!-- ✗ BAD -->
   <div v-bind:foo="x" />
   <div :bar="x" />
 </template>
@@ -39,7 +39,7 @@ By default, `'/^v-/'` is set. This prevents mistakes intended to be directives.
 
 ```vue
 <template>
-  <!-- ✘ BAD -->
+  <!-- ✗ BAD -->
   <MyInput :v-model="x" />
   <div :v-if="x" />
 </template>
@@ -84,7 +84,7 @@ The following properties can be specified for the object.
   <!-- ✓ GOOD -->
   <div :foo="x" />
 
-  <!-- ✘ BAD -->
+  <!-- ✗ BAD -->
   <div :foo.prop="x" />
 </template>
 ```
@@ -100,7 +100,7 @@ The following properties can be specified for the object.
   <!-- ✓ GOOD -->
   <CoolButton :foo="x" />
 
-  <!-- ✘ BAD -->
+  <!-- ✗ BAD -->
   <MyButton :foo="x" />
 </template>
 ```

docs/rules/no-unused-properties.md

@@ -89,7 +89,7 @@ This rule cannot be checked for use in other components (e.g. `mixins`, Property
 <eslint-code-block :rules="{'vue/no-unused-properties': ['error', {groups: ['props', 'data']}]}">
 
 ```vue
-<!-- ✓ BAD (`count` data not used) -->
+<!-- ✗ BAD (`count` data not used) -->
 <script>
   export default {
     data() {
@@ -136,7 +136,7 @@ This rule cannot be checked for use in other components (e.g. `mixins`, Property
 <eslint-code-block :rules="{'vue/no-unused-properties': ['error', {groups: ['props', 'computed']}]}">
 
 ```vue
-<!-- ✓ BAD (`reversedMessage` computed property not used) -->
+<!-- ✗ BAD (`reversedMessage` computed property not used) -->
 <template>
   <p>{{ message }}</p>
 </template>