From 4071d6d9d083bf885c30787441598ee3643cebbc Mon Sep 17 00:00:00 2001
From: Adam Wathan <adam.wathan@gmail.com>
Date: Tue, 31 Oct 2017 21:24:51 -0400
Subject: [PATCH] Add hover docs to bg colors

---
 docs/source/docs/background-color.blade.md | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)

diff --git a/docs/source/docs/background-color.blade.md b/docs/source/docs/background-color.blade.md
index ae037d055..8dff6c753 100644
--- a/docs/source/docs/background-color.blade.md
+++ b/docs/source/docs/background-color.blade.md
@@ -38,3 +38,20 @@ title: "Backgrounds"
         </tbody>
     </table>
 </div>
+
+
+## Hover
+
+In addition to the standard responsive variations, background colors also come in `hover:` variations that apply the given background color on hover.
+
+@component('_partials.code-sample')
+<div class="bg-blue hover:bg-purple text-center text-white font-semibold mx-auto px-4 py-2">
+  Hover over this element
+</div>
+@endcomponent
+
+Hover utilities can also be combined with responsive utilities by adding the responsive `{screen}:` prefix *before* the `hover:` prefix.
+
+```html
+<button class="bg-blue hover:bg-purple md:bg-orange md:hover:bg-red">Button</button>
+```