Extract responsive embed nested classes

I think this is the more common coding convention across Bootstrap.

Extract nested classes as first-class citizens and assume HTML would use both.

diff --git a/less/responsive-embed.less b/less/responsive-embed.less
index c1fa8f8488b269e432e23442ea73aae348bddc02..080a5118fe9ab2af331e6b1444fff4be840ecc03 100644 (file)
--- a/less/responsive-embed.less
+++ b/less/responsive-embed.less
@@ -22,14 +22,14 @@
     width: 100%;
     border: 0;
   }
+}
 
-  // Modifier class for 16:9 aspect ratio
-  &.embed-responsive-16by9 {
-    padding-bottom: 56.25%;
-  }
+// Modifier class for 16:9 aspect ratio
+.embed-responsive-16by9 {
+  padding-bottom: 56.25%;
+}
 
-  // Modifier class for 4:3 aspect ratio
-  &.embed-responsive-4by3 {
-    padding-bottom: 75%;
-  }
+// Modifier class for 4:3 aspect ratio
+.embed-responsive-4by3 {
+  padding-bottom: 75%;
 }