docs: Update examples

ktquez · ktquez · commit 095fc18028ff · 2020-05-20T18:56:05.000-03:00
diff --git a/docs/guide/examples.md b/docs/guide/examples.md
@@ -31,9 +31,9 @@
 ```vue
 <vue-dark-mode>
   <template v-slot="{ mode }">
-    <svg v-show="mode === 'dark'" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path></svg>
-    <svg v-show="mode === 'light'" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="5"></circle><line x1="12" y1="1" x2="12" y2="3"></line><line x1="12" y1="21" x2="12" y2="23"></line><line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line><line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line><line x1="1" y1="12" x2="3" y2="12"></line><line x1="21" y1="12" x2="23" y2="12"></line><line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line><line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line></svg>
-    <svg v-show="mode === 'system'" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="3" width="20" height="14" rx="2" ry="2"></rect><line x1="8" y1="21" x2="16" y2="21"></line><line x1="12" y1="17" x2="12" y2="21"></line></svg>
+    <MyLightIcon v-show="mode === 'dark'">
+    <MyDarkIcon v-show="mode === 'light'">
+    <MySystemIcon v-show="mode === 'system'">
   </template>
 </vue-dark-mode>
 ```
diff --git a/docs/howto/tailwind.md b/docs/howto/tailwind.md
@@ -4,7 +4,7 @@ By default, [tailwindcss-dark-mode](https://github.com/ChanceArthur/tailwindcss-
 
 It is possible to [changing the Selector](https://github.com/ChanceArthur/tailwindcss-dark-mode#changing-the-selector) in "tailwindcss-dark-mode" plug-in, however, you can also adjust the class using the [className](/guide/class-naming.html) prop to generate the class compatible with the plugin.
 
-e.g.
+**e.g.**
 
 ```vue
 <VueDarkMode className="mode-%cm">
@@ -14,6 +14,9 @@ e.g.
 </VueDarkMode>
 ```
 
+
+**Output**
+
 ```html
 <!DOCTYPE html>
 <html lang="en" class="mode-dark">
