docs(uishell): better descriptions

This commit is contained in:
Marcus Feitoza 2020-04-18 13:02:02 -03:00
commit 2424b32c87
2 changed files with 15 additions and 15 deletions

View file

@ -109,9 +109,9 @@
};
</script>
{#if story === 'base'}
{#if story === 'header'}
<Header {...$$props} />
{:else if story === 'with-header-and-nav'}
{:else if story === 'header-with-nav'}
<Header {...$$props}>
<HeaderNav>
<HeaderNavItem href="/" text="Link 1" />
@ -124,7 +124,7 @@
</HeaderNavMenu>
</HeaderNav>
</Header>
{:else if story === 'with-utilities'}
{:else if story === 'header-with-utilities'}
<Header {...$$props}>
<HeaderUtilities>
<HeaderActionSearch />
@ -142,7 +142,7 @@
<HeaderActionLink type="Account" icon={iAccount} />
</HeaderUtilities>
</Header>
{:else if story === 'with-switcher'}
{:else if story === 'header-with-switcher'}
<Header {...$$props}>
<HeaderUtilities>
<HeaderAction type="Switcher" icon={iSwitcher} isOpen={true}>
@ -159,7 +159,7 @@
</HeaderAction>
</HeaderUtilities>
</Header>
{:else if story === 'with-sidenav'}
{:else if story === 'header-and-sidenav'}
<Header bind:isSideNavOpen {...$$props} />
<SideNav isOpen={isSideNavOpen}>
<SideNavItems>

View file

@ -3,50 +3,50 @@ import Component from './UIShell.Story.svelte';
export default { title: 'UIShell', decorators: [withKnobs] };
export const Base = () => ({
export const Header = () => ({
Component,
props: {
story: 'base',
story: 'header',
href: text('The link href (href)', '#'),
company: text('Company name', 'IBM'),
platformName: text('Platform name', 'Platform Name')
}
});
export const WithHeaderAndNav = () => ({
export const HeaderWithNav = () => ({
Component,
props: {
story: 'with-header-and-nav',
story: 'header-with-nav',
href: text('The link href (href)', '#'),
company: text('Company name', 'IBM'),
platformName: text('Platform name', 'Platform Name')
}
});
export const WithUtilities = () => ({
export const HeaderWithUtilities = () => ({
Component,
props: {
story: 'with-utilities',
story: 'header-with-utilities',
href: text('The link href (href)', '#'),
company: text('Company name', 'IBM'),
platformName: text('Platform name', 'Platform Name')
}
});
export const WithSwitcher = () => ({
export const HeaderWithSwitcher = () => ({
Component,
props: {
story: 'with-switcher',
story: 'header-with-switcher',
href: text('The link href (href)', '#'),
company: text('Company name', 'IBM'),
platformName: text('Platform name', 'Platform Name')
}
});
export const WithSidenav = () => ({
export const HeaderAndSidenav = () => ({
Component,
props: {
story: 'with-sidenav',
story: 'header-and-sidenav',
href: text('The link href (href)', '#'),
company: text('Company name', 'IBM'),
platformName: text('Platform name', 'Platform Name')