fix(scss notation): fix & notation for utilities / description list (#5007)

Author: kflournoy-sf

ui/utilities/description-list/_index.scss

@@ -9,27 +9,29 @@
 .slds-dl_inline,
 .slds-dl--inline {
   @include clearfix;
+}
 
-  @include mq-small-min {
-    /**
-     * @summary Marks a term
-     * @selector .slds-dl_inline__label
-     * @modifier
-     */
-    &__label {
-      float: left;
-      clear: left;
-    }
+@include mq-small-min {
+  /**
+    * @summary Marks a term
+    * @selector .slds-dl_inline__label
+    * @modifier
+    */
+  .slds-dl_inline__label,
+  .slds-dl--inline__label {
+    float: left;
+    clear: left;
+  }
 
-    /**
-     * @summary Marks a description
-     * @selector .slds-dl_inline__detail
-     * @modifier
-     */
-    &__detail {
-      float: left;
-      padding-left: $spacing-xx-small;
-    }
+  /**
+    * @summary Marks a description
+    * @selector .slds-dl_inline__detail
+    * @modifier
+    */
+  .slds-dl_inline__detail,
+  .slds-dl--inline__detail {
+    float: left;
+    padding-left: $spacing-xx-small;
   }
 }
 
@@ -49,35 +51,37 @@
   }
 }
 
-/**
- * @summary Causes description list to display horizontally with `dt` consuming 33% of the space and the `dd` taking up the rest.
- * @selector .slds-dl_horizontal
- * @modifier
- */
-.slds-dl_horizontal,
-.slds-dl--horizontal {
-  @include mq-small-min {
+@include mq-small-min {
+  /**
+    * @summary Causes description list to display horizontally with `dt` consuming 33% of the space and the `dd` taking up the rest.
+    * @selector .slds-dl_horizontal
+    * @modifier
+    */
+  .slds-dl_horizontal,
+  .slds-dl--horizontal {
     display: flex;
     flex-wrap: wrap;
+  }
 
-    /**
-     * @summary Marks a term
-     * @selector .slds-dl_horizontal__label
-     * @modifier
-     */
-    &__label {
-      width: 30%;
-      padding-right: $spacing-small;
-    }
+  /**
+    * @summary Marks a term
+    * @selector .slds-dl_horizontal__label
+    * @modifier
+    */
+  .slds-dl_horizontal__label,
+  .slds-dl--horizontal__label {
+    width: 30%;
+    padding-right: $spacing-small;
+  }
 
-    /**
-     * @summary Marks a description
-     * @selector .slds-dl_horizontal__detail
-     * @modifier
-     */
-    &__detail {
-      width: 70%;
-    }
+  /**
+    * @summary Marks a description
+    * @selector .slds-dl_horizontal__detail
+    * @modifier
+    */
+  .slds-dl_horizontal__detail,
+  .slds-dl--horizontal__detail {
+    width: 70%;
   }
 }