Dmceachernmsft/ContextMenuTestAlignmentFix (#1701)

* update sub Icon styles

* Change files

* update styles

* Update @internal-react-components-98daf1a6-2477-44dc-bc3d-efb08935e46d.json

Author: dmceachernmsft

change/@internal-react-components-98daf1a6-2477-44dc-bc3d-efb08935e46d.json

@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "Fix chevron alignment issues on message read receipt flyout.",
+  "packageName": "@internal/react-components",
+  "email": "94866715+dmceachernmsft@users.noreply.github.com",
+  "dependentChangeType": "patch"
+}

packages/react-components/src/components/ChatMessage/ChatMessageActionsFlyout.tsx

@@ -19,7 +19,8 @@ import { MessageThreadStrings } from '../MessageThread';
 import {
   chatMessageMenuStyle,
   menuIconStyleSet,
-  menuItemIncreasedSizeStyles
+  menuItemIncreasedSizeStyles,
+  menuSubIconStyleSet
 } from '../styles/ChatMessageComponent.styles';
 
 /** @private */
@@ -147,7 +148,7 @@ export const ChatMessageActionFlyout = (props: ChatMessageActionFlyoutProps): JS
         },
         submenuIconProps: {
           iconName: 'HorizontalGalleryRightButton',
-          styles: menuIconStyleSet
+          styles: menuSubIconStyleSet
         },
         disabled: messageReadByCount <= 0
       });

packages/react-components/src/components/styles/ChatMessageComponent.styles.ts

@@ -90,3 +90,14 @@ export const menuIconStyleSet = {
     width: '1.25rem'
   }
 };
+
+/**
+ * @private
+ */
+export const menuSubIconStyleSet = {
+  root: {
+    height: 'unset',
+    lineHeight: '100%',
+    width: '1.25rem'
+  }
+};