updated header documentation. #1646
Conversation
siddhantrawal
requested review from
gretanausedaite and
r100-stack
and removed request for
a team
|
I added the other examples that were present inside the storybook but the code is very similar. Do you guys think we need these examples or we can just have text explaining that you can make the header slim, add extra elements, and place content in the center? If we decide to keep the examples, how can I display them properly so it is not hidden (Like the text inside the header). Something like this: |
siddhantrawal
requested review from
mayank99
and removed request for
gretanausedaite
Updated. Any other suggestions on what can be added/removed? |
Added usage section. |
| - Help takes you to Bentley Communities for Bentley Cloud and Web Services. | ||
| - User profile is a drop down with options for your user profile. | ||
| - Logo can be added using the `appLogo` prop and specifying the desired logo under the `<HeaderLogo>` subcomponent. | ||
| - Breadcrumbs trail can be implemented using the `breadcrumbs` prop and `<HeaderBreadcrumbs>` subcomponent. Individual buttons can be added within the breadcrumbs trail using the `<HeaderButton>` subcomponent. For a dropdown menu, the `menuItems` prop can be used inside the `<HeaderButton>` for showing items and `onClick()` property for handling actions. |
There was a problem hiding this comment.
onClick may not need to be mentioned as that can likely be figured out since HeaderButton is a Button
There was a problem hiding this comment.
better yet, remove the last sentence and just link to the HeaderButton section, which describes everything in detail
| - Breadcrumbs trail can be implemented using the `breadcrumbs` prop and `<HeaderBreadcrumbs>` subcomponent. Individual buttons can be added within the breadcrumbs trail using the `<HeaderButton>` subcomponent. For a dropdown menu, the `menuItems` prop can be used inside the `<HeaderButton>` for showing items and `onClick()` property for handling actions. | |
| - Breadcrumbs trail can be implemented using the `breadcrumbs` prop and `<HeaderBreadcrumbs>` subcomponent. Individual buttons can be added within the breadcrumbs trail using the [`<HeaderButton>` subcomponent](#headerbutton-subcomponent). |
| - Settings | ||
|
|
||
| ### Actions | ||
| <LiveExample src='Header.full.tsx'> |
There was a problem hiding this comment.
Since we are mentioning that <HeaderButton> can be made a link (above paragraph), would be good to show it in the example too.
There was a problem hiding this comment.
Added, was not sure about what link to add for href, so passing empty string. Is that okay?
…n/iTwinUI into siddhant/update_docs_header
Co-authored-by: Mayank <[email protected]>
Co-authored-by: Mayank <[email protected]>
Changes
Updated documentation for the Header component.
Testing
Docs