Merge pull request #36 from patternfly/fix-docs-issues

fix(docs): Fix alignment and dropdown issues found in examples

Author: wise-king-sullyman

packages/module/patternfly-docs/content/extensions/react-log-viewer/demos/ComplexToolbarLogViewer.jsx

@@ -13,7 +13,7 @@ import {
 } from '@patternfly/react-core';
 import {
 	Select as SelectDeprecated,
-	SelectOption
+	SelectOption as SelectOptionDeprecated
 } from '@patternfly/react-core/deprecated';
 import OutlinedPlayCircleIcon from '@patternfly/react-icons/dist/esm/icons/outlined-play-circle-icon';
 import ExpandIcon from '@patternfly/react-icons/dist/esm/icons/expand-icon';
@@ -122,15 +122,15 @@ const ComplexToolbarLogViewer = () => {
   };
 
   const selectDataSourceMenu = Object.entries(dataSources).map(([value, { type }]) => (
-    <SelectOption
+    <SelectOptionDeprecated
       key={value}
       value={value}
       isSelected={selectedDataSource === value}
       isChecked={selectedDataSource === value}
     >
       <Badge key={value}>{type}</Badge>
       {` ${value}`}
-    </SelectOption>
+    </SelectOptionDeprecated>
   ));
 
   const selectDataSourcePlaceholder = (

packages/module/patternfly-docs/content/extensions/react-log-viewer/demos/LogViewer.md

@@ -18,7 +18,7 @@ import {
 } from '@patternfly/react-core';
 import {
 	Select as SelectDeprecated,
-	SelectOption
+	SelectOption as SelectOptionDeprecated
 } from '@patternfly/react-core/deprecated';
 import OutlinedPlayCircleIcon from '@patternfly/react-icons/dist/esm/icons/outlined-play-circle-icon';
 import ExpandIcon from '@patternfly/react-icons/dist/esm/icons/expand-icon';

packages/module/patternfly-docs/content/extensions/react-log-viewer/examples/CustomControlLogViewer.jsx

@@ -34,7 +34,7 @@ const CustomControlLogViewer = () => {
                 Print to Console
               </Button>
             </ToolbarItem>
-            <ToolbarItem>
+            <ToolbarItem alignSelf='center'>
               <Checkbox label="Wrap text" aria-label="wrap text checkbox" isChecked={isTextWrapped} id="wrap-text-checkbox" onChange={(_event, value) => setIsTextWrapped(value)} />
             </ToolbarItem>
           </ToolbarContent>