fix(ui): extend Section media size scale

Author: austincalvelage

packages/swingset/src/stories/section.stories.tsx

@@ -29,7 +29,7 @@ const styles = stylex.create({
 function ProviderIcon({ provider }: { provider: string }) {
   return (
     <Section.Media
-      size='xl'
+      size='lg'
       {...stylex.props(styles.providerMedia)}
     >
       <img
@@ -54,7 +54,7 @@ export function Default() {
       <Section.Group>
         <Section.Row>
           <Section.Item>
-            <Section.Media size='xl'>
+            <Section.Media size='lg'>
               <Avatar.Root size='fit'>
                 <Avatar.Image
                   alt='Preston Booth'
@@ -144,7 +144,7 @@ export function MultipleEmailAndPhoneNumbers() {
       <Section.Group>
         <Section.Row>
           <Section.Item>
-            <Section.Media size='xl'>
+            <Section.Media size='lg'>
               <Avatar.Root size='fit'>
                 <Avatar.Image
                   alt='Preston Booth'

packages/ui/src/mosaic/components/section/section.styles.ts

@@ -79,12 +79,12 @@ export const styles = stylex.create({
     width: space['6'],
   },
   mediaLg: {
-    height: space['8'],
-    width: space['8'],
+    height: space['10'],
+    width: space['10'],
   },
   mediaXl: {
-    height: space['10.5'],
-    width: space['10.5'],
+    height: space['12'],
+    width: space['12'],
   },
   content: {
     display: 'flex',