ISTWCMS-5631: css for menu chevrons in menu-header, menu-horizontal

src/patterns/04-components/menu/menu--header/_menu--header.scss

@@ -77,60 +77,70 @@
               }
             }
           }
+
           .no-scroll & {
-            &[aria-expanded="true"]{
-              > a{
-                border-left: inherit;
-                display: inline-block;
-                height: inherit;
-                overflow: inherit;
-                width: inherit;
-                z-index: var(--layer-overlay);
-                span{
-                  display: block;
-                }
-                &::after {
-                  //transform: scale(0.75, 0.75) rotate(270deg);
+            > a {
+              &::after {
+                transform: rotate(0deg);
+                @media(min-width: $screen-md) {
+                  transform: rotate(180deg);
                 }
               }
             }
           }
-        }
-      }
-      &__subnav {
-        display: none;
-      }
-      .submenu-active .menu__subnav{
-        background: #f7f7f7;
-        border-width: 0;
-        column-count: 1;
-        display: inherit;
-        height: auto;
-        left: inherit;
-        min-height: auto;
-        min-width: 13rem;
-        padding: var(--size-2) var(--size-1);
-        right: 0;
-        top: inherit;
-        width: auto;
 
-        .menu__item{
-          max-width: inherit;
-          &-parent{
-            display: none;
-          }
-          a{
-            .no-scroll &{
-              border-color: transparent;
-              &:hover{
-                border-color: #e6e6e6;
+          &[aria-expanded="true"]{
+            > a{
+              border-left: inherit;
+              display: inline-block;
+              height: inherit;
+              overflow: inherit;
+              width: inherit;
+              z-index: var(--layer-overlay);
+              span{
+                display: block;
+              }
+              &::after {
+                transform: rotate(180deg);
               }
             }
           }
         }
-        .menu__subnav{
-          border: 0 solid var(--uw-white);
+      }
+    }
+    &__subnav {
+      display: none;
+    }
+    .submenu-active .menu__subnav{
+      background: #f7f7f7;
+      border-width: 0;
+      column-count: 1;
+      display: inherit;
+      height: auto;
+      left: inherit;
+      min-height: auto;
+      min-width: 13rem;
+      padding: var(--size-2) var(--size-1);
+      right: 0;
+      top: inherit;
+      width: auto;
+
+      .menu__item{
+        max-width: inherit;
+        &-parent{
+          display: none;
         }
+        a{
+          .no-scroll &{
+            border-color: transparent;
+            &:hover{
+              border-color: #e6e6e6;
+            }
+          }
+        }
+      }
+      .menu__subnav{
+        border: 0 solid var(--uw-white);
       }
     }
   }

src/patterns/04-components/menu/menu--horizontal/_menu--horizontal.scss

@@ -334,6 +334,14 @@ $menu-horizontal-drop-bg: #f7f7f7;
             }
           }
           .no-scroll & {
+            > a {
+              &::after {
+                transform: rotate(270deg);
+                @media(min-width: $screen-md) {
+                  transform: rotate(180deg);
+                }
+              }
+            }
             &[aria-expanded="true"]{
               > a{
                 border-left: var(--size-xs) solid var(--gray-3);
@@ -349,7 +357,10 @@ $menu-horizontal-drop-bg: #f7f7f7;
                   display: none;
                 }
                 &::after {
-                  transform: rotate(180deg);
+                  transform: rotate(90deg);
+                  @media(min-width: $screen-md) {
+                    transform: rotate(180deg);
+                  }
                 }
               }
             }
@@ -368,7 +379,10 @@ $menu-horizontal-drop-bg: #f7f7f7;
         &[aria-expanded="true"]{
           > a{
             &::after {
-              transform: rotate(180deg);
+              transform: rotate(-90deg);
+              @media(min-width: $screen-md) {
+                transform: rotate(180deg);
+              }
             }
           }
         }