fix(manager-react-component): fix the style of actionMenu

Signed-off-by: LIDRISSI Hamid <[email protected]>

packages/manager-react-components/src/components/navigation/menus/action/action.component.tsx

@@ -9,7 +9,7 @@ import { useTranslation } from 'react-i18next';
 import '../translations/translation';
 
 import { ManagerButton } from '../../../ManagerButton/ManagerButton';
-
+import './index.css';
 export interface ActionMenuItem {
   id: number;
   rel?: string;
@@ -48,14 +48,11 @@ const MenuItem = ({
     className: 'w-full action-menu-item',
     ...item,
   };
+
   return (
-    <div className="-mx-[2px]">
+    <div className="mx-[2px]">
       {!item?.iamActions || item?.iamActions?.length === 0 ? (
-        <OdsButton {...buttonProps} label={item.label}>
-          <span slot="start">
-            <span>{item.label}</span>
-          </span>
-        </OdsButton>
+        <OdsButton {...buttonProps} label={item?.label} />
       ) : (
         <ManagerButton
           id={`${id}`}
@@ -86,7 +83,7 @@ export const ActionMenu: React.FC<ActionMenuProps> = ({
 
   return (
     <>
-      <div key={id} id={`navigation-action-trigger-${id}`}>
+      <div className="w-fit" key={id} id={`navigation-action-trigger-${id}`}>
         <OdsButton
           data-testid="navigation-action-trigger-action"
           className="action-menu-btn"
@@ -106,7 +103,7 @@ export const ActionMenu: React.FC<ActionMenuProps> = ({
         />
       </div>
       <OdsPopover
-        className="py-[8px] px-0 overflow-hidden"
+        className="py-[8px] overflow-hidden"
         triggerId={`navigation-action-trigger-${id}`}
         with-arrow
       >

packages/manager-react-components/src/components/navigation/menus/action/index.css

@@ -0,0 +1,4 @@
+ods-button.action-menu-item::part(button) {
+  width: 100%;
+  justify-content: left;
+}