diff --git a/app/soapbox/components/dropdown-menu/dropdown-menu.tsx b/app/soapbox/components/dropdown-menu/dropdown-menu.tsx index a5714ff68..9a606bf61 100644 --- a/app/soapbox/components/dropdown-menu/dropdown-menu.tsx +++ b/app/soapbox/components/dropdown-menu/dropdown-menu.tsx @@ -1,4 +1,4 @@ -import { offset, Placement, useFloating, flip, arrow } from '@floating-ui/react'; +import { offset, Placement, useFloating, flip, arrow, shift } from '@floating-ui/react'; import clsx from 'clsx'; import { supportsPassiveEvents } from 'detect-passive-events'; import React, { useEffect, useMemo, useRef, useState } from 'react'; @@ -65,6 +65,9 @@ const DropdownMenu = (props: IDropdownMenu) => { middleware: [ offset(12), flip(), + shift({ + padding: 8, + }), arrow({ element: arrowRef, }),