chore: Make home roller title more responsive

[snowystinger]

Closes

Visit S2 home page and watch the title. Try it on desktop and mobile and possibly in responsive view.

Note, do we want it to pause for small screens? This implementation can support if the roller is on the next line as well.

✅ Pull Request Checklist:

• Included link to corresponding React Spectrum GitHub Issue.
• Added/updated unit tests and storybook for this change (for new code or code which already has tests).
• Filled out test instructions.
• Updated documentation (if it already exists for this component).
• Looked at the Accessibility Practices for this feature - Aria Practices

📝 Test Instructions:

🧢 Your Project:

[snowystinger]

ensures a gap between items so they don't bleed into each other with descenders

[rspbot]

Build successful! 🎉

• View the storybook
• View the S2 storybook
• View the S2 docs
• View the React Aria docs

[yihuiliao]

it'd be nice if there was a fade like we have in the ToC when there's scrolling but not something that we need for release

[dannify]

• Make sure it bails for reduce motion settings
• Freeze the "with"
• Use Devon's font size clamping

[rspbot]

Build successful! 🎉

• View the storybook
• View the S2 storybook
• View the S2 docs
• View the React Aria docs

[rspbot]

Build successful! 🎉

• View the storybook
• View the S2 storybook
• View the S2 docs
• View the React Aria docs

[rspbot]

Build successful! 🎉

• View the storybook
• View the S2 storybook
• View the S2 docs
• View the React Aria docs

[rspbot]

Build successful! 🎉

• View the storybook
• View the S2 storybook
• View the S2 docs
• View the React Aria docs

[rspbot]

## API Changes

@react-spectrum/s2

/@react-spectrum/s2:Image

 Image {
   UNSAFE_className?: UnsafeClassName
   UNSAFE_style?: CSSProperties
   alt?: string
-  children?: ReactNode
   crossOrigin?: 'anonymous' | 'use-credentials'
   decoding?: 'async' | 'auto' | 'sync'
   fetchPriority?: 'high' | 'low' | 'auto'
   group?: ImageGroup
   height?: number
-  itemProp?: string
   loading?: 'eager' | 'lazy'
   referrerPolicy?: HTMLAttributeReferrerPolicy
   renderError?: () => ReactNode
   slot?: string | null
   styles?: StyleString
   width?: number
 }

/@react-spectrum/s2:ImageProps

 ImageProps {
   UNSAFE_className?: UnsafeClassName
   UNSAFE_style?: CSSProperties
   alt?: string
-  children?: ReactNode
   crossOrigin?: 'anonymous' | 'use-credentials'
   decoding?: 'async' | 'auto' | 'sync'
   fetchPriority?: 'high' | 'low' | 'auto'
   group?: ImageGroup
   height?: number
-  itemProp?: string
   loading?: 'eager' | 'lazy'
   referrerPolicy?: HTMLAttributeReferrerPolicy
   renderError?: () => ReactNode
   slot?: string | null
   styles?: StyleString
   width?: number
 }

---

[yihuiliao]

lgtm, also tested with reduce motion