fix sass warning (#4730)

Author: ETLaurent

modules/@apostrophecms/image/ui/apos/components/AposMediaUploader.vue

@@ -328,7 +328,9 @@ export default {
   .apos-media-uploader__secondary {
     @include apos-p-reset();
 
-    text-align: center;
+    & {
+      text-align: center;
+    }
   }
 
   .apos-media-uploader__secondary {

modules/@apostrophecms/schema/ui/apos/scss/AposInputArray.scss

@@ -188,11 +188,13 @@
 .apos-input-array-inline-table-header-cell {
   @include type-base;
 
-  height: 40px;
-  padding-right: $spacing-base;
-  padding-left: $spacing-base;
-  text-align: left;
-  background-color: var(--a-base-9);
+  & {
+    height: 40px;
+    padding-right: $spacing-base;
+    padding-left: $spacing-base;
+    text-align: left;
+    background-color: var(--a-base-9);
+  }
 }
 
 .apos-input-array-inline-header {
@@ -270,14 +272,16 @@
 .apos-input-array-inline-label {
   @include type-large;
 
-  margin: 0;
-  padding-top: $spacing-base;
-  padding-bottom: $spacing-base;
-  // stylelint-disable scale-unlimited/declaration-strict-value
-  color: currentcolor; 
-  // stylelint-enable scale-unlimited/declaration-strict-value
-  text-align: left;
-  transition: background-color 400ms ease;
+  & {
+    margin: 0;
+    padding-top: $spacing-base;
+    padding-bottom: $spacing-base;
+    // stylelint-disable scale-unlimited/declaration-strict-value
+    color: currentcolor;
+    // stylelint-enable scale-unlimited/declaration-strict-value
+    text-align: left;
+    transition: background-color 400ms ease;
+  }
 }
 
 .apos-input-array-inline-all-controls {
@@ -302,12 +306,14 @@
   .apos-input-array-inline-item {
     @include apos-transition();
 
-    overflow: hidden;
-    padding: 0;
-    border: 1px solid var(--a-base-9);
-    outline: 1px solid transparent;
-    background-color: var(--a-base-10);
-    border-radius: var(--a-border-radius);
+    & {
+      overflow: hidden;
+      padding: 0;
+      border: 1px solid var(--a-base-9);
+      outline: 1px solid transparent;
+      background-color: var(--a-base-10);
+      border-radius: var(--a-border-radius);
+    }
 
     &.apos-is-dragging {
       // stylelint-disable declaration-no-important
@@ -359,7 +365,7 @@
     :deep(.apos-input-array-inline-empty .material-design-icon__svg) {
       fill: var(--a-base-7);
     }
-    
+
     // stylelint-disable max-nesting-depth
     .apos-input-array-inline-item {
       border-color: var(--a-base-8);
@@ -370,7 +376,7 @@
       &--engaged > .apos-input-array-inline-header {
         color: var(--a-text-primary);
       }
-      
+
       .apos-input-array-inline-header {
         background-color: var(--a-base-8);
       }

modules/@apostrophecms/ui/ui/apos/components/AposContextMenu.vue

@@ -333,11 +333,13 @@ function handleKeyboard(event) {
 .apos-context-menu__items {
   @include apos-list-reset();
 
-  display: inline-block;
-  list-style-type: none;
-  width: max-content;
-  margin: none;
-  margin-block: 0;
-  padding: 10px 0;
+  & {
+    display: inline-block;
+    list-style-type: none;
+    width: max-content;
+    margin: none;
+    margin-block: 0;
+    padding: 10px 0;
+  }
 }
 </style>

modules/@apostrophecms/ui/ui/apos/components/AposContextMenuDialog.vue

@@ -138,12 +138,14 @@ function emitSetArrow(arrowEl) {
 .apos-context-menu__items {
   @include apos-list-reset();
 
-  display: inline-block;
-  list-style-type: none;
-  width: max-content;
-  margin: none;
-  margin-block: 0;
-  padding: 10px 0;
+  & {
+    display: inline-block;
+    list-style-type: none;
+    width: max-content;
+    margin: none;
+    margin-block: 0;
+    padding: 10px 0;
+  }
 }
 
 .apos-context-menu__dialog :deep(.apos-schema .apos-field) {

modules/@apostrophecms/ui/ui/apos/components/AposLocalePicker.vue

@@ -151,10 +151,12 @@ function getForbiddenTooltip(locale) {
 .apos-locale-picker__locale-display {
   @include apos-button-reset();
 
-  display: block;
-  box-sizing: border-box;
-  width: 100%;
-  padding: 12px 35px;
+  & {
+    display: block;
+    box-sizing: border-box;
+    width: 100%;
+    padding: 12px 35px;
+  }
 
   &:focus, &:active {
     outline: none;

modules/@apostrophecms/ui/ui/apos/components/AposSlatList.vue

@@ -199,8 +199,10 @@ export default {
   .apos-slat-list {
     @include apos-list-reset();
 
-    min-height: 20px;
-    max-width: $input-max-width;
+    & {
+      min-height: 20px;
+      max-width: $input-max-width;
+    }
   }
 
   .apos-slat-status {

modules/@apostrophecms/ui/ui/apos/components/AposTagApply.vue

@@ -317,12 +317,14 @@ export default {
   .apos-apply-tag-menu__tags {
     @include apos-list-reset();
 
-    max-height: 160px;
-    overflow-y: auto;
-    margin-top: 15px;
-    // Negative margin/padding below is for the checkbox focus state.
-    margin-left: -10px;
-    padding-left: 10px;
+    & {
+      max-height: 160px;
+      overflow-y: auto;
+      margin-top: 15px;
+      // Negative margin/padding below is for the checkbox focus state.
+      margin-left: -10px;
+      padding-left: 10px;
+    }
   }
 
   .apos-apply-tag-menu__tag {

modules/@apostrophecms/ui/ui/apos/scss/global/_tables.scss

@@ -19,7 +19,9 @@
 .apos-table__header-icon {
   @include apos-align-icon();
 
-  margin-right: 5px;
+  & {
+    margin-right: 5px;
+  }
 }
 
 .apos-table__header-label,