docs(components): Standardize approach to accessibility docs via design guidelines.

packages/documentation-site/patternfly-docs/content/components/about-modal/about-modal.md

@@ -31,3 +31,6 @@ About modals are clicked into through a users interaction with a button, link, o
 Provide access to an about modal using a help icon in the application masthead. Clicking the help icon will launch a dropdown menu. The help menu should always include an option labeled "About" that launches the about modal.
 
 <img src="./img/about-dropdown.png" alt="About modal dropdown" />
+
+## Accessibility
+For information regarding accessibility, visit the [about modal accessibility](/components/about-modal/accessibility) tab.

packages/documentation-site/patternfly-docs/content/components/checkbox/checkbox.md

@@ -62,3 +62,6 @@ The main difference between a switch and a checkbox is that a switch changes an
     <div class="ws-docs-content-img">
     ![Example 3 of do's and don'ts for using a checkbox or a switch.](./img/CB-vs-switch-3.svg)
     </div>
+
+## Accessibility
+For information regarding accessibility, visit the [checkbox accessibility](/components/checkbox/accessibility) tab.

packages/documentation-site/patternfly-docs/content/components/clipboard-copy/clipboard-copy.md

@@ -81,4 +81,7 @@ An inline compact clipboard copy can include 1 or 2 action buttons next to it. T
 
 <div class="ws-docs-content-img">
 ![Example of an inline clipboard copy component with two actions.](./img/clipboard-copy-inline-compact-2.svg)
-</div>
+</div>
+
+## Accessibility
+For information regarding accessibility, visit the [clipboard copy accessibility](/components/clipboard-copy/accessibility) tab.

packages/documentation-site/patternfly-docs/content/components/components-data.json

@@ -201,7 +201,7 @@
   },
   "menu-toggle": {
     "illustration": "./img/component-illustrations/menu-toggle.png",
-    "summary": "A <b>menu toggle</b> is a selectable control that opens and closes a menu."
+    "summary": "A <b>menu toggle</b> is a selectable control that opens and closes a <Link to='/components/menus/dropdown'>dropdown</Link>, <Link to='/components.menus/select'>select</Link>, or <Link to='/components/menus/menu'>menu</Link> component."
   },
   "menu": {
     "illustration": "./img/component-illustrations/menu.png",
@@ -321,7 +321,7 @@
   },
   "text-area": {
     "illustration": "./img/component-illustrations/text-area.png",
-    "summary": "A <b>text area</b> allows users to enter a longer paragraph of text."
+    "summary": "Most commonly used in  <Link to='/components/forms/form'>forms</Link>, a <b>text area</b> allows users to enter a longer paragraph of text."
   },
   "text-input-group": {
     "illustration": "./img/component-illustrations/text-input-group.png",

packages/documentation-site/patternfly-docs/content/components/context-selector/context-selector.md

@@ -83,4 +83,7 @@ It is recommended that a page-level context selector be placed at the top of the
 
 <div class="ws-docs-content-img">
 ![Context selector placed within the page content, above breadcrumbs.](./img/page-context-selector.svg)
-</div>
+</div>
+
+## Accessibility
+For information regarding accessibility, visit the [context selector accessibility](/components/menus/context-selector/accessibility) tab.

packages/documentation-site/patternfly-docs/content/components/expandable-section/expandable-section.md

@@ -58,4 +58,6 @@ We recommend using dynamic toggle text for an expandable section, which will upd
 ![Example of an expandable section in a documentation page.](./img/exp-sect-docs-page.svg)
 </div>
 
+## Accessibility 
+
 For more information regarding accessibility, visit the [expandable section accessibility tab](/components/expandable-section/accessibility).

packages/documentation-site/patternfly-docs/content/components/menu/menu.md

@@ -174,3 +174,6 @@ When creating menu item labels, keep in mind the following guidelines:
 * Options should reflect the result a user should expect. For example, a list or sorting options might include the items: *Alphabetical*, *Oldest first*, *Newest first*, and *Numeric*.
 
 * Descriptive text added to a menu item should be short. Two lines or less is recommended.
+
+## Accessibility
+For information regarding accessibility, visit the [menu accessibility](/components/menus/menu/accessibility) tab.

packages/documentation-site/patternfly-docs/content/components/modal/modal.md

@@ -194,3 +194,6 @@ Icons are optional in modal dialogs. Use or omit them as your use case requires.
 | <span style="color: rgb(240, 171, 0)" aria-label="warning" role="img"> <i class="fas fa-exclamation-triangle" /> </span> | **Warning:** Cautions or warns the user of a permanent action, or that information will be deleted upon action completion | Add to confirmation dialogs or passive dialogs to indicate a higher level of urgency and importance.|
 | <span style="color: rgb(201, 25, 11)" aria-label="critical warning" role="img"> <i class="fas fa-exclamation-circle" /> </span> | **Critical Warning:** Indicates that an error has occured  | Add to error dialogs. |
 | <span style="color: rgb(43, 154, 243)" aria-label="acknowledgement" role="img"> <i class="fas fa-info-circle" /> </span> | **Acknowledgement:** Informs the user of an action or result  | Add to confirmation or passive dialogs to indicate a lower level of urgency. |
+
+## Accessibility
+For information regarding accessibility, visit the [modal accessibility](/components/modal/accessibility) tab.

packages/documentation-site/patternfly-docs/content/components/navigation/navigation.md

@@ -171,4 +171,7 @@ Secondary horizontal navigation can also be used with primary horizontal navigat
 
 <div class="ws-docs-content-img">
 ![Example of horizontal primary and secondary navigation.](./img/nav-secondary-horizontal.svg)
-</div>
+</div>
+
+## Accessibility
+For information regarding accessibility, visit the [navigation accessibility](/components/navigation/accessibility) tab.

packages/documentation-site/patternfly-docs/content/components/page/page.md

@@ -40,3 +40,5 @@ PatternFly includes a flexible layout system for defining pages. Page layouts ar
 ### Page sections
 Page sections allow you to define areas on a page to group content. The header, body, and footer on a page are examples of page sections. Page sections have 24px padding on left and right edges or no padding to allow the contents to extend to the edge of a page. At screen sizes smaller than 1200px, the left/right padding is reduced to 16px to create a tighter layout. Page sections can also be made sticky such that they will remain visible at the top or bottom of the viewport when the page scrolls. This is useful for creating sticky headers, footers, or other elements.
 
+## Accessibility
+For information regarding accessibility, visit the [page accessibility](/components/page/accessibility) tab.

packages/documentation-site/patternfly-docs/content/components/progress/progress.md

@@ -225,4 +225,7 @@ For **complete** statuses, write your progress bar title in past tense. Use this
 
 </div>
 
-Progress bars should only use content in their title and progress value. Never write additional content inside the progress track.
+Progress bars should only use content in their title and progress value. Never write additional content inside the progress track.
+
+## Accessibility
+For information regarding accessibility, visit the [progress accessibility](/components/progress/accessibility) tab.

packages/documentation-site/patternfly-docs/content/components/radio/radio.md

@@ -30,3 +30,6 @@ Radio buttons allow users to select **1 item** from a list of options.
 ### Labeling and alignment
 
 Radio button labels fall to the right of the radio button control. You can use headings to label a group of radio buttons. The placement of headings will depend on the layout of other content in the form or on the page you’re designing. For more information on how to arrange radio buttons, see the [forms design guidelines](/components/forms/form/design-guidelines#data-input-arrangement).
+
+## Accessibility
+For information regarding accessibility, visit the [radio accessibility](/components/forms/radio/accessibility) tab.

packages/documentation-site/patternfly-docs/content/components/sidebar/sidebar.md

@@ -8,4 +8,7 @@ Sidebars orient a panel box and a content box on a page. The panel and content c
 
 Sidebars can contain jumplinks and vertical tabs that provide easy access to different sections within a panel. However, they are also frequently used for context-sensitive content, frequently changed properties, and information regarding functionality. 
 
-Sidebars can be sticky, so that they are constantly visible as a user scrolls through a page. They are also responsive, so the panel will display on top of content in mobile view, and beside the content in desktop view.
+Sidebars can be sticky, so that they are constantly visible as a user scrolls through a page. They are also responsive, so the panel will display on top of content in mobile view, and beside the content in desktop view.
+
+## Accessibility
+For information regarding accessibility, visit the [sidebar accessibility](/components/sidebar/accessibility) tab.

packages/documentation-site/patternfly-docs/content/components/switch/switch.md

@@ -86,4 +86,7 @@ Do not use end-of-sentence punctuation, like question marks or exclamation point
 |Notifications| Turn off notifications.|
 
 ### Form field labels 
-For form-based switches, make sure that you follow our [form field guidelines](/components/forms/form/design-guidelines#content-considerations) to effectively pair a form field label with its related switch. 
+For form-based switches, make sure that you follow our [form field guidelines](/components/forms/form/design-guidelines#content-considerations) to effectively pair a form field label with its related switch. 
+
+## Accessibility
+For information regarding accessibility, visit the [switch accessibility](/components/switch/accessibility) tab.

packages/documentation-site/patternfly-docs/content/components/tabs/tabs.md

@@ -89,4 +89,5 @@ Secondary tabs should also be used when tabs live within a component, or are in
 ![Example of secondary tabs used in a modal.](./img/tabs-modal.svg)
 </div>
 
-
+## Accessibility
+For information regarding accessibility, visit the [tabs accessibility](/components/tabs/accessibility) tab.

packages/documentation-site/patternfly-docs/content/components/tree-view/tree-view.md

@@ -114,4 +114,7 @@ Compact tree view is useful when the nodes of a tree view contain more than one
 
 1. **Guide:** Connected lines between nodes in a tree view. 
 2. **Row:** Content with one or multiple lines that can be formatted.
-3. **Container:** Area that holds the content and visually distinguishes individual rows with a filled or transparent background.
+3. **Container:** Area that holds the content and visually distinguishes individual rows with a filled or transparent background.
+
+## Accessibility
+For information regarding accessibility, visit the [tree view accessibility](/components/tree-view/accessibility) tab.