From 91d969f7aa4ade282ffb6fb6a164d4c16ef4119d Mon Sep 17 00:00:00 2001
From: Adam Wathan <adam.wathan@gmail.com>
Date: Tue, 6 Aug 2019 11:19:42 -0400
Subject: [PATCH] Enable hover and focus variants for opacity by default

---
 .../fixtures/tailwind-output-important.css    | 200 ++++++++++++++++++
 __tests__/fixtures/tailwind-output.css        | 200 ++++++++++++++++++
 stubs/defaultConfig.stub.js                   |   2 +-
 3 files changed, 401 insertions(+), 1 deletion(-)

diff --git a/__tests__/fixtures/tailwind-output-important.css b/__tests__/fixtures/tailwind-output-important.css
index 3abfaf937..7cf1a3cec 100644
--- a/__tests__/fixtures/tailwind-output-important.css
+++ b/__tests__/fixtures/tailwind-output-important.css
@@ -5125,6 +5125,46 @@ video {
   opacity: 1 !important;
 }
 
+.hover\:opacity-0:hover {
+  opacity: 0 !important;
+}
+
+.hover\:opacity-25:hover {
+  opacity: 0.25 !important;
+}
+
+.hover\:opacity-50:hover {
+  opacity: 0.5 !important;
+}
+
+.hover\:opacity-75:hover {
+  opacity: 0.75 !important;
+}
+
+.hover\:opacity-100:hover {
+  opacity: 1 !important;
+}
+
+.focus\:opacity-0:focus {
+  opacity: 0 !important;
+}
+
+.focus\:opacity-25:focus {
+  opacity: 0.25 !important;
+}
+
+.focus\:opacity-50:focus {
+  opacity: 0.5 !important;
+}
+
+.focus\:opacity-75:focus {
+  opacity: 0.75 !important;
+}
+
+.focus\:opacity-100:focus {
+  opacity: 1 !important;
+}
+
 .outline-none {
   outline: 0 !important;
 }
@@ -12820,6 +12860,46 @@ video {
     opacity: 1 !important;
   }
 
+  .sm\:hover\:opacity-0:hover {
+    opacity: 0 !important;
+  }
+
+  .sm\:hover\:opacity-25:hover {
+    opacity: 0.25 !important;
+  }
+
+  .sm\:hover\:opacity-50:hover {
+    opacity: 0.5 !important;
+  }
+
+  .sm\:hover\:opacity-75:hover {
+    opacity: 0.75 !important;
+  }
+
+  .sm\:hover\:opacity-100:hover {
+    opacity: 1 !important;
+  }
+
+  .sm\:focus\:opacity-0:focus {
+    opacity: 0 !important;
+  }
+
+  .sm\:focus\:opacity-25:focus {
+    opacity: 0.25 !important;
+  }
+
+  .sm\:focus\:opacity-50:focus {
+    opacity: 0.5 !important;
+  }
+
+  .sm\:focus\:opacity-75:focus {
+    opacity: 0.75 !important;
+  }
+
+  .sm\:focus\:opacity-100:focus {
+    opacity: 1 !important;
+  }
+
   .sm\:outline-none {
     outline: 0 !important;
   }
@@ -20516,6 +20596,46 @@ video {
     opacity: 1 !important;
   }
 
+  .md\:hover\:opacity-0:hover {
+    opacity: 0 !important;
+  }
+
+  .md\:hover\:opacity-25:hover {
+    opacity: 0.25 !important;
+  }
+
+  .md\:hover\:opacity-50:hover {
+    opacity: 0.5 !important;
+  }
+
+  .md\:hover\:opacity-75:hover {
+    opacity: 0.75 !important;
+  }
+
+  .md\:hover\:opacity-100:hover {
+    opacity: 1 !important;
+  }
+
+  .md\:focus\:opacity-0:focus {
+    opacity: 0 !important;
+  }
+
+  .md\:focus\:opacity-25:focus {
+    opacity: 0.25 !important;
+  }
+
+  .md\:focus\:opacity-50:focus {
+    opacity: 0.5 !important;
+  }
+
+  .md\:focus\:opacity-75:focus {
+    opacity: 0.75 !important;
+  }
+
+  .md\:focus\:opacity-100:focus {
+    opacity: 1 !important;
+  }
+
   .md\:outline-none {
     outline: 0 !important;
   }
@@ -28212,6 +28332,46 @@ video {
     opacity: 1 !important;
   }
 
+  .lg\:hover\:opacity-0:hover {
+    opacity: 0 !important;
+  }
+
+  .lg\:hover\:opacity-25:hover {
+    opacity: 0.25 !important;
+  }
+
+  .lg\:hover\:opacity-50:hover {
+    opacity: 0.5 !important;
+  }
+
+  .lg\:hover\:opacity-75:hover {
+    opacity: 0.75 !important;
+  }
+
+  .lg\:hover\:opacity-100:hover {
+    opacity: 1 !important;
+  }
+
+  .lg\:focus\:opacity-0:focus {
+    opacity: 0 !important;
+  }
+
+  .lg\:focus\:opacity-25:focus {
+    opacity: 0.25 !important;
+  }
+
+  .lg\:focus\:opacity-50:focus {
+    opacity: 0.5 !important;
+  }
+
+  .lg\:focus\:opacity-75:focus {
+    opacity: 0.75 !important;
+  }
+
+  .lg\:focus\:opacity-100:focus {
+    opacity: 1 !important;
+  }
+
   .lg\:outline-none {
     outline: 0 !important;
   }
@@ -35908,6 +36068,46 @@ video {
     opacity: 1 !important;
   }
 
+  .xl\:hover\:opacity-0:hover {
+    opacity: 0 !important;
+  }
+
+  .xl\:hover\:opacity-25:hover {
+    opacity: 0.25 !important;
+  }
+
+  .xl\:hover\:opacity-50:hover {
+    opacity: 0.5 !important;
+  }
+
+  .xl\:hover\:opacity-75:hover {
+    opacity: 0.75 !important;
+  }
+
+  .xl\:hover\:opacity-100:hover {
+    opacity: 1 !important;
+  }
+
+  .xl\:focus\:opacity-0:focus {
+    opacity: 0 !important;
+  }
+
+  .xl\:focus\:opacity-25:focus {
+    opacity: 0.25 !important;
+  }
+
+  .xl\:focus\:opacity-50:focus {
+    opacity: 0.5 !important;
+  }
+
+  .xl\:focus\:opacity-75:focus {
+    opacity: 0.75 !important;
+  }
+
+  .xl\:focus\:opacity-100:focus {
+    opacity: 1 !important;
+  }
+
   .xl\:outline-none {
     outline: 0 !important;
   }
diff --git a/__tests__/fixtures/tailwind-output.css b/__tests__/fixtures/tailwind-output.css
index c64297011..26bfddc79 100644
--- a/__tests__/fixtures/tailwind-output.css
+++ b/__tests__/fixtures/tailwind-output.css
@@ -5125,6 +5125,46 @@ video {
   opacity: 1;
 }
 
+.hover\:opacity-0:hover {
+  opacity: 0;
+}
+
+.hover\:opacity-25:hover {
+  opacity: 0.25;
+}
+
+.hover\:opacity-50:hover {
+  opacity: 0.5;
+}
+
+.hover\:opacity-75:hover {
+  opacity: 0.75;
+}
+
+.hover\:opacity-100:hover {
+  opacity: 1;
+}
+
+.focus\:opacity-0:focus {
+  opacity: 0;
+}
+
+.focus\:opacity-25:focus {
+  opacity: 0.25;
+}
+
+.focus\:opacity-50:focus {
+  opacity: 0.5;
+}
+
+.focus\:opacity-75:focus {
+  opacity: 0.75;
+}
+
+.focus\:opacity-100:focus {
+  opacity: 1;
+}
+
 .outline-none {
   outline: 0;
 }
@@ -12820,6 +12860,46 @@ video {
     opacity: 1;
   }
 
+  .sm\:hover\:opacity-0:hover {
+    opacity: 0;
+  }
+
+  .sm\:hover\:opacity-25:hover {
+    opacity: 0.25;
+  }
+
+  .sm\:hover\:opacity-50:hover {
+    opacity: 0.5;
+  }
+
+  .sm\:hover\:opacity-75:hover {
+    opacity: 0.75;
+  }
+
+  .sm\:hover\:opacity-100:hover {
+    opacity: 1;
+  }
+
+  .sm\:focus\:opacity-0:focus {
+    opacity: 0;
+  }
+
+  .sm\:focus\:opacity-25:focus {
+    opacity: 0.25;
+  }
+
+  .sm\:focus\:opacity-50:focus {
+    opacity: 0.5;
+  }
+
+  .sm\:focus\:opacity-75:focus {
+    opacity: 0.75;
+  }
+
+  .sm\:focus\:opacity-100:focus {
+    opacity: 1;
+  }
+
   .sm\:outline-none {
     outline: 0;
   }
@@ -20516,6 +20596,46 @@ video {
     opacity: 1;
   }
 
+  .md\:hover\:opacity-0:hover {
+    opacity: 0;
+  }
+
+  .md\:hover\:opacity-25:hover {
+    opacity: 0.25;
+  }
+
+  .md\:hover\:opacity-50:hover {
+    opacity: 0.5;
+  }
+
+  .md\:hover\:opacity-75:hover {
+    opacity: 0.75;
+  }
+
+  .md\:hover\:opacity-100:hover {
+    opacity: 1;
+  }
+
+  .md\:focus\:opacity-0:focus {
+    opacity: 0;
+  }
+
+  .md\:focus\:opacity-25:focus {
+    opacity: 0.25;
+  }
+
+  .md\:focus\:opacity-50:focus {
+    opacity: 0.5;
+  }
+
+  .md\:focus\:opacity-75:focus {
+    opacity: 0.75;
+  }
+
+  .md\:focus\:opacity-100:focus {
+    opacity: 1;
+  }
+
   .md\:outline-none {
     outline: 0;
   }
@@ -28212,6 +28332,46 @@ video {
     opacity: 1;
   }
 
+  .lg\:hover\:opacity-0:hover {
+    opacity: 0;
+  }
+
+  .lg\:hover\:opacity-25:hover {
+    opacity: 0.25;
+  }
+
+  .lg\:hover\:opacity-50:hover {
+    opacity: 0.5;
+  }
+
+  .lg\:hover\:opacity-75:hover {
+    opacity: 0.75;
+  }
+
+  .lg\:hover\:opacity-100:hover {
+    opacity: 1;
+  }
+
+  .lg\:focus\:opacity-0:focus {
+    opacity: 0;
+  }
+
+  .lg\:focus\:opacity-25:focus {
+    opacity: 0.25;
+  }
+
+  .lg\:focus\:opacity-50:focus {
+    opacity: 0.5;
+  }
+
+  .lg\:focus\:opacity-75:focus {
+    opacity: 0.75;
+  }
+
+  .lg\:focus\:opacity-100:focus {
+    opacity: 1;
+  }
+
   .lg\:outline-none {
     outline: 0;
   }
@@ -35908,6 +36068,46 @@ video {
     opacity: 1;
   }
 
+  .xl\:hover\:opacity-0:hover {
+    opacity: 0;
+  }
+
+  .xl\:hover\:opacity-25:hover {
+    opacity: 0.25;
+  }
+
+  .xl\:hover\:opacity-50:hover {
+    opacity: 0.5;
+  }
+
+  .xl\:hover\:opacity-75:hover {
+    opacity: 0.75;
+  }
+
+  .xl\:hover\:opacity-100:hover {
+    opacity: 1;
+  }
+
+  .xl\:focus\:opacity-0:focus {
+    opacity: 0;
+  }
+
+  .xl\:focus\:opacity-25:focus {
+    opacity: 0.25;
+  }
+
+  .xl\:focus\:opacity-50:focus {
+    opacity: 0.5;
+  }
+
+  .xl\:focus\:opacity-75:focus {
+    opacity: 0.75;
+  }
+
+  .xl\:focus\:opacity-100:focus {
+    opacity: 1;
+  }
+
   .xl\:outline-none {
     outline: 0;
   }
diff --git a/stubs/defaultConfig.stub.js b/stubs/defaultConfig.stub.js
index 6756ef893..193ab03fe 100644
--- a/stubs/defaultConfig.stub.js
+++ b/stubs/defaultConfig.stub.js
@@ -463,7 +463,7 @@ module.exports = {
     minWidth: ['responsive'],
     objectFit: ['responsive'],
     objectPosition: ['responsive'],
-    opacity: ['responsive'],
+    opacity: ['responsive', 'hover', 'focus'],
     order: ['responsive'],
     outline: ['responsive', 'focus'],
     overflow: ['responsive'],