docs: replace Stardust UI mentions, clean up docs (#16369)

packages/fluentui/CONTRIBUTING.md

@@ -76,8 +76,6 @@ These guides will walk your through various activities for contributing:
 
 Behaviors apply properties, focus handling and keyboard handlers to the component slots. When developing a component, the properties and keyboard handlers need to be spread to the corresponding slots.
 
-For complete accessibility contributing guide, requirements and testing, see [Accessibility][2]
-
 - [Role and aria props](#role-and-aria-props)
 - [Focus](#focus)
 - [Keyboard handling](#keyboard-handling)
@@ -181,7 +179,6 @@ I (@rymeskar) have been part of the FluentUI framework team for the past two mon
  - For sustainable keyboard keys handling, one needs to map actions to [key presses](https://github.com/microsoft/fluentui/blob/5f9a800af3b0c94fa12d68f40d5d6a83a76e68c8/packages/fluentui/accessibility/src/behaviors/Accordion/accordionBehavior.ts#L18). Then within component code, one needs to [define handling](https://github.com/microsoft/fluentui/blob/5f9a800af3b0c94fa12d68f40d5d6a83a76e68c8/packages/fluentui/react-northstar/src/components/Accordion/Accordion.tsx#L140) of these actions.
 
 [1]: https://nodejs.org/
-[2]: https://github.com/stardust-ui/accessibility/blob/master/CONTRIBUTING.md
 [3]: https://www.w3.org/TR/wai-aria-1.1/#usage_intro
 [4]: https://www.w3.org/TR/wai-aria-1.1/#introstates
 [5]: https://www.w3.org/TR/wai-aria-1.1/#landmark_roles

packages/fluentui/docs/src/components/DocPage/DocPage.tsx

@@ -6,11 +6,12 @@ interface DocPageProps {
  title: string;
  description?: string;
  children: React.ReactNode;
+ fluid?: boolean;
  themeSwitcher?: React.ReactNode;
 }
 
 const PAGE_PADDING = '20px';
-const DocPage = ({ title, themeSwitcher, children }: DocPageProps) => (
+const DocPage = ({ title, themeSwitcher, children, fluid }: DocPageProps) => (
  <>
  <div
  id="docs-sticky-header"
@@ -28,7 +29,15 @@ const DocPage = ({ title, themeSwitcher, children }: DocPageProps) => (
  <Header as="h1" aria-level={2} content={title} style={{ margin: 0 }} variables={{ color: 'black' }} />
  <DocumentTitle title={`Fluent UI - ${title}`} />
  </div>
- <div style={{ padding: '2rem', fontSize: '1.15rem', maxWidth: '100ch' }}>{children}</div>
+ <div
+ style={{
+ padding: '2rem',
+ fontSize: '1.15rem',
+ maxWidth: fluid ? undefined : '100ch',
+ }}
+ >
+ {children}
+ </div>
  </>
 );
 

packages/fluentui/docs/src/components/Sidebar/Sidebar.tsx

@@ -238,15 +238,6 @@ const baseTreeItems: TreeProps['items'] = [
  to: '/icon-viewer',
  },
  },
- {
- id: 'component-architecture',
- title: {
- as: NavLink,
- content: 'Component Architecture',
- activeClassName: 'active',
- to: '/component-architecture',
- },
- },
  ...(process.env.NODE_ENV !== 'production'
  ? [
  {

packages/fluentui/docs/src/routes.tsx

@@ -11,7 +11,6 @@ import { PerfDataProvider } from './components/ComponentDoc/PerfChart';
 import * as Composition from './pages/Composition.mdx';
 import * as Debugging from './pages/Debugging.mdx';
 import * as Layout from './pages/Layout.mdx';
-import * as ComponentArchitecture from './pages/ComponentArchitecture.mdx';
 import * as StylesOverrides from './pages/StylesOverrides.mdx';
 import Accessibility from './views/Accessibility';
 import Colors from './views/Colors';
@@ -147,9 +146,6 @@ const Routes = () => (
  <MarkdownPage page={ShorthandProps} />
  </Route>
  <Route exact path="/icon-viewer" component={IconViewer} />
- <Route exact path="/component-architecture">
- <MarkdownPage page={ComponentArchitecture} />
- </Route>
  <Route exact path="/theming-specification">
  <MarkdownPage page={ThemingSpecification} />
  </Route>