fixes

Author: pettinarip

src/components/FeedbackWidget/FixedDot.tsx

@@ -23,7 +23,7 @@ const FixedDot = forwardRef<HTMLButtonElement, FixedDotProps>(
         data-testid="feedback-widget-button"
         aria-label={t("feedback-widget")}
         className={cn(
-          "lg:mt-inherit sticky bottom-4 z-20 me-4 ms-auto flex size-12 items-center gap-0 rounded-full text-white shadow-table-item-box",
+          "lg:mt-inherit sticky bottom-4 z-overlay me-4 ms-auto flex size-12 items-center gap-0 rounded-full text-white shadow-table-item-box",
           "transition-all duration-200 hover:shadow-none hover:transition-transform hover:duration-200",
           !suppressScale && "hover:scale-110",
           offsetBottom && "bottom-31 lg:bottom-4",

src/components/Staking/StakingConsiderations/index.tsx

@@ -76,7 +76,7 @@ const StakingConsiderations = ({ page }: StakingConsiderationsProps) => {
 
   return (
     <Flex flexDir={{ base: "column", md: "row" }}>
-      <ButtonDropdown list={dropdownLinks} className="md:hidden" />
+      <ButtonDropdown list={dropdownLinks} className="mb-4 md:hidden" />
       {/* TODO: Improve a11y */}
       <Box flex={1} hideBelow={mdBp}>
         {!!pageData && (

src/components/ui/dropdown-menu.tsx

@@ -45,7 +45,7 @@ const DropdownMenuSubContent = React.forwardRef<
   <DropdownMenuPrimitive.SubContent
     ref={ref}
     className={cn(
-      "z-popover min-w-[8rem] overflow-hidden rounded-md border bg-background p-1 shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+      "z-popover min-w-[8rem] overflow-hidden rounded-md border bg-background p-1 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
       className
     )}
     {...props}
@@ -63,7 +63,7 @@ const DropdownMenuContent = React.forwardRef<
       ref={ref}
       sideOffset={sideOffset}
       className={cn(
-        "z-popover min-w-[8rem] overflow-hidden rounded border border-body bg-background py-2 shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+        "z-popover min-w-[8rem] overflow-hidden rounded border border-body bg-background py-2 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
         className
       )}
       {...props}

src/layouts/ContentLayout.tsx

@@ -38,7 +38,7 @@ export const ContentLayout = ({
 
         {dropdownLinks && (
           <MobileButton>
-            <ButtonDropdown list={dropdownLinks} />
+            <ButtonDropdown list={dropdownLinks} className="w-full lg:w-auto" />
           </MobileButton>
         )}
       </Page>

src/pages/staking/index.tsx

@@ -630,7 +630,7 @@ const StakingPage = ({
           </Flex>
         </ContentContainer>
         <MobileButton>
-          <ButtonDropdown list={dropdownLinks} />
+          <ButtonDropdown list={dropdownLinks} className="w-full lg:w-auto" />
         </MobileButton>
       </Page>
     </PageContainer>