fix(example): keeps example content from overflowing content area (#4550)

Author: mcoker

packages/documentation-framework/templates/mdx.css

@@ -23,3 +23,7 @@ p.pf-v6-c-content--p.ws-p {
 .ws-back-to-top {
   z-index: var(--pf-t--global--z-index--2xl);
 }
+
+.ws-example-page-wrapper {
+  max-width: min(100%, 825px);
+}

packages/documentation-framework/templates/mdx.js

@@ -110,7 +110,7 @@ const MDXChildTemplate = ({ Component, source, toc = [], index = 0, id }) => {
   const ChildComponent = () => (
     <div className={source !== 'landing-pages' ? 'pf-v6-l-flex' : ''}>
       {toc.length > 1 && <TableOfContents items={toc} />}
-      <Stack hasGutter style={{ ...(source !== 'landing-pages' && { maxWidth: '825px' }) }}>
+      <Stack hasGutter className={(source !== 'landing-pages' && 'ws-example-page-wrapper')}>
         {InlineAlerts}
         <Component />
         {functionDocumentation.length > 0 && (