Create component illustrations for moved items

[mcarrano]

For PatternFly v5, several pages that previously appeared in Demos will be moved to Components. Therefore they will require component illustrations to show on the new component catalog page (https://patternfly-org-pr-3181-v4.surge.sh/v4/components/view-all-components). New illustrations are required for the following components:

• Composable menu
• Date and time picker
• Password generator
• Password strength

The process for creating new illustrations is outlined here: https://github.com/patternfly/patternfly-org/wiki/Adding-new-components-to-the-website

[smckinno]

Mocks Here are the new illustrations- practically done just needs review

[mcarrano]

These look great @smckinno . @mceledonia @mmenestr can you also take a look at these?

[mmenestr]

Agreed, these look great! I like option 1 for the menu, without the clicking hand - though I wonder what that lighter grey line is on the top left of the expanded menu?

And my only other comment is, in some places we use line for text, but in the date picker we're using actual text. Does that matter (?) I know it's kind of a weird one but just wanted to bring it up to see what you all thought!

[smckinno]

@mmenestr That lighter gray is supposed to be the "title" of the 3 dropdown options but I can easily get rid of that line! Also, for the use of the hand - we use it in a few other illustrations so we can use it here too (if we want to). I know it may seem odd but using text in this case is the best way to communicate what the component is - also we use text for just the date picker component as well. So in simple, text in this case is okay :)

[mmenestr]

@smckinno kk then I approve ;)

[mcarrano]

Thanks for your work on this @smckinno . I've opened https://github.com/patternfly/patternfly-org/issues/3465 to get these onto the website for v5.