fix action bar margin, menu text color and address name truncation

toolkit/theme/recipes/menu.recipe.ts

@@ -25,7 +25,7 @@ export const recipe = defineSlotRecipe({
     },
     item: {
       textDecoration: 'none',
-      color: 'initial',
+      color: 'text.primary',
       userSelect: 'none',
       borderRadius: 'none',
       width: '100%',

ui/pages/Marketplace.tsx

@@ -170,7 +170,7 @@ const Marketplace = () => {
                 <IconSvg name="dots"/>
               </IconButton>
             </MenuTrigger>
-            <MenuContent>
+            <MenuContent zIndex="banner">
               { links.map(({ label, href, icon }) => (
                 <MenuItem key={ label } value={ label } asChild>
                   <Link external href={ href } variant="menu" gap={ 0 }>
@@ -205,6 +205,7 @@ const Marketplace = () => {
         showShadow
         display="flex"
         flexDirection="column"
+        mt={ 0 }
         mx={{ base: -3, lg: -12 }}
         px={{ base: 3, lg: 12 }}
         pt={{ base: 4, lg: 6 }}

ui/shared/ActionBar.tsx

@@ -29,6 +29,7 @@ const ActionBar = ({ children, className, showShadow }: Props) => {
       className={ className }
       backgroundColor={{ _light: 'white', _dark: 'black' }}
       pt={ 6 }
+      mt={ -6 }
       pb={{ base: 6, lg: 3 }}
       mx={{ base: -3, lg: 0 }}
       px={{ base: 3, lg: 0 }}

ui/shared/entities/address/AddressEntity.tsx

@@ -128,7 +128,7 @@ const Content = chakra((props: ContentProps) => {
     );
 
     return (
-      <Tooltip content={ label } contentProps={{ maxW: { base: 'calc(100vw - 8px)', lg: '400px' } }}>
+      <Tooltip content={ label } contentProps={{ maxW: { base: 'calc(100vw - 8px)', lg: '400px' } }} triggerProps={{ minW: 0 }}>
         <Skeleton loading={ props.isLoading } overflow="hidden" textOverflow="ellipsis" whiteSpace="nowrap" { ...styles }>
           { nameText }
         </Skeleton>

ui/shared/entities/address/AddressEntityContentProxy.tsx

@@ -49,7 +49,7 @@ const AddressEntityContentProxy = (props: ContentProps) => {
   );
 
   return (
-    <Tooltip content={ content } interactive contentProps={{ maxW: { base: 'calc(100vw - 8px)', lg: '410px' } }}>
+    <Tooltip content={ content } interactive contentProps={{ maxW: { base: 'calc(100vw - 8px)', lg: '410px' } }} triggerProps={{ minW: 0 }}>
       <Box display="inline-flex" w="100%">
         <EntityBase.Content
           { ...props }