docs(examples): adjust colors to match theme (#12226)

* docs: removed hard coded color The toolbar background in "CRUD Actions" section in "en\components\data-tables" is hard coded with * docs: fixed broken images with `mdi-*` prefix * docs: fixed broken icons * docs: removed hard coded colors to work with dark theme
vuetifyjs · Sep 14, 2020 · a0866c8 · a0866c8
1 parent a611f94
commit a0866c8
Show file tree

Hide file tree

Showing 11 changed files with 14 additions and 15 deletions.
diff --git a/packages/docs/src/examples/v-btn-toggle/misc-wysiwyg.vue b/packages/docs/src/examples/v-btn-toggle/misc-wysiwyg.vue
@@ -18,19 +18,19 @@
         v-model="formatting"
         multiple
       >
-        <v-btn color="white">
+        <v-btn>
           <v-icon>mdi-format-italic</v-icon>
         </v-btn>
 
-        <v-btn color="white">
+        <v-btn>
           <v-icon>mdi-format-bold</v-icon>
         </v-btn>
 
-        <v-btn color="white">
+        <v-btn>
           <v-icon>mdi-format-underline</v-icon>
         </v-btn>
 
-        <v-btn color="white">
+        <v-btn>
           <v-row
             align="center"
             class="flex-column"
@@ -52,23 +52,22 @@
       </v-btn-toggle>
 
       <v-btn-toggle v-model="alignment">
-        <v-btn color="white">
+        <v-btn>
           <v-icon>mdi-format-align-center</v-icon>
         </v-btn>
 
-        <v-btn color="white">
+        <v-btn>
           <v-icon>mdi-format-align-left</v-icon>
         </v-btn>
 
-        <v-btn color="white">
+        <v-btn>
           <v-icon>mdi-format-align-right</v-icon>
         </v-btn>
       </v-btn-toggle>
     </v-row>
 
     <v-sheet
       class="pa-4 text-center"
-      color="grey lighten-3"
       tile
     >
       <v-row

diff --git a/packages/docs/src/examples/v-calendar/event-click.vue b/packages/docs/src/examples/v-calendar/event-click.vue
@@ -4,7 +4,6 @@
       <v-sheet height="64">
         <v-toolbar
           flat
-          color="white"
         >
           <v-btn
             outlined

diff --git a/packages/docs/src/examples/v-calendar/prop-type-category.vue b/packages/docs/src/examples/v-calendar/prop-type-category.vue
@@ -4,7 +4,6 @@
       <v-sheet height="64">
         <v-toolbar
           flat
-          color="white"
         >
           <v-btn
             outlined

diff --git a/packages/docs/src/examples/v-calendar/usage.vue b/packages/docs/src/examples/v-calendar/usage.vue
@@ -3,7 +3,6 @@
     <v-sheet
       tile
       height="54"
-      color="grey lighten-3"
       class="d-flex"
     >
       <v-btn

diff --git a/packages/docs/src/examples/v-menu/prop-offset-x.vue b/packages/docs/src/examples/v-menu/prop-offset-x.vue
@@ -3,6 +3,7 @@
     <v-switch
       v-model="offset"
       label="X offset"
+      color="primary"
     ></v-switch>
     <v-menu
       top

diff --git a/packages/docs/src/examples/v-menu/prop-offset-y.vue b/packages/docs/src/examples/v-menu/prop-offset-y.vue
@@ -3,6 +3,7 @@
     <v-switch
       v-model="offset"
       label="Y offset"
+      color="primary"
     ></v-switch>
     <v-menu
       top

diff --git a/packages/docs/src/examples/v-slide-group/misc-pseudo-carousel.vue b/packages/docs/src/examples/v-slide-group/misc-pseudo-carousel.vue
@@ -42,7 +42,6 @@
     <v-expand-transition>
       <v-sheet
         v-if="model != null"
-        color="grey lighten-4"
         height="200"
         tile
       >

diff --git a/packages/docs/src/examples/v-switch/prop-model-as-array.vue b/packages/docs/src/examples/v-switch/prop-model-as-array.vue
@@ -3,11 +3,13 @@
     <p>{{ people }}</p>
     <v-switch
       v-model="people"
+      color="primary"
       label="John"
       value="John"
     ></v-switch>
     <v-switch
       v-model="people"
+      color="primary"
       label="Jacob"
       value="Jacob"
     ></v-switch>

diff --git a/packages/docs/src/examples/v-switch/prop-states.vue b/packages/docs/src/examples/v-switch/prop-states.vue
@@ -11,12 +11,13 @@
     <v-row>
       <v-col cols="6">
         <v-switch
+          color="primary"
           value
           input-value="true"
         ></v-switch>
       </v-col>
       <v-col cols="6">
-        <v-switch></v-switch>
+        <v-switch color="primary"></v-switch>
       </v-col>
     </v-row>
     <v-row class="dark--text">
@@ -30,6 +31,7 @@
     <v-row>
       <v-col cols="6">
         <v-switch
+          color="primary"
           value
           input-value="true"
           disabled

diff --git a/packages/docs/src/examples/v-tabs/prop-right.vue b/packages/docs/src/examples/v-tabs/prop-right.vue
@@ -1,7 +1,6 @@
 <template>
   <v-card>
     <v-tabs
-      background-color="white"
       color="deep-purple accent-4"
       right
     >

diff --git a/packages/docs/src/examples/v-timeline/misc-advanced.vue b/packages/docs/src/examples/v-timeline/misc-advanced.vue
@@ -132,7 +132,6 @@
       >
         <v-btn
           class="mx-0"
-          color="white"
         >
           Resend Email
         </v-btn>