docs(accessibility,theme): switch examples to plain markup (#14548)

Author: KareemDa

packages/docs/src/examples/accessibility/list-item-group.vue

@@ -1,42 +1,19 @@
 <template>
-  <v-card
-    class="mx-auto"
-    max-width="500"
-  >
+  <v-card class="mx-auto" max-width="500">
     <v-list>
-      <v-list-item-group v-model="model">
-        <v-list-item
-          v-for="(item, i) in items"
-          :key="i"
-          :disabled="item.disabled"
-        >
-          <v-list-item-content>
-            <v-list-item-title v-text="item.text"></v-list-item-title>
-          </v-list-item-content>
+      <v-list-item-group>
+        <v-list-item>
+          <v-list-item-title> Item 1 </v-list-item-title>
+        </v-list-item>
+
+        <v-list-item disabled>
+          <v-list-item-title> Item 2 </v-list-item-title>
+        </v-list-item>
+
+        <v-list-item>
+          <v-list-item-title> Item 3 </v-list-item-title>
         </v-list-item>
       </v-list-item-group>
     </v-list>
   </v-card>
 </template>
-
-<script>
-  export default {
-    data: () => ({
-      items: [
-        {
-          text: 'Item 1',
-          disabled: false,
-        },
-        {
-          text: 'Item 2',
-          disabled: true,
-        },
-        {
-          text: 'Item 3',
-          disabled: false,
-        },
-      ],
-      model: 0,
-    }),
-  }
-</script>

packages/docs/src/examples/theme/misc-provider.vue

@@ -1,12 +1,6 @@
 <template>
-  <v-card
-    dark
-    flat
-  >
-    <v-toolbar
-      flat
-      height="72"
-    >
+  <v-card dark flat>
+    <v-toolbar flat height="72">
       <v-switch
         v-model="$vuetify.theme.dark"
         hint="This toggles the global state of the Vuetify theme"
@@ -20,11 +14,16 @@
       <v-list>
         <v-subheader>I inherit dark from my parent</v-subheader>
 
-        <v-list-item
-          v-for="item in items"
-          :key="item"
-        >
-          <v-list-item-title v-text="item"></v-list-item-title>
+        <v-list-item>
+          <v-list-item-title>One</v-list-item-title>
+        </v-list-item>
+
+        <v-list-item>
+          <v-list-item-title>Two</v-list-item-title>
+        </v-list-item>
+
+        <v-list-item>
+          <v-list-item-title>Three</v-list-item-title>
         </v-list-item>
       </v-list>
 
@@ -38,27 +37,19 @@
             <strong>&nbsp;$vuetify.theme.dark</strong>
           </v-subheader>
 
-          <v-list-item
-            v-for="item in items"
-            :key="item"
-          >
-            <v-list-item-title v-text="item"></v-list-item-title>
+          <v-list-item>
+            <v-list-item-title>One</v-list-item-title>
+          </v-list-item>
+
+          <v-list-item>
+            <v-list-item-title>Two</v-list-item-title>
+          </v-list-item>
+
+          <v-list-item>
+            <v-list-item-title>Three</v-list-item-title>
           </v-list-item>
         </v-list>
       </v-theme-provider>
     </v-card-text>
   </v-card>
 </template>
-
-<script>
-  export default {
-    props: {
-      attrs: {
-        type: Object,
-        default: () => ({}),
-      },
-    },
-
-    data: () => ({ items: ['One', 'Two', 'Three'] }),
-  }
-</script>