diff --git a/packages/react-core/src/components/Masthead/examples/Masthead.md b/packages/react-core/src/components/Masthead/examples/Masthead.md index 94563b6cd8e..edf3945c7a5 100644 --- a/packages/react-core/src/components/Masthead/examples/Masthead.md +++ b/packages/react-core/src/components/Masthead/examples/Masthead.md @@ -7,7 +7,7 @@ propComponents: ['Masthead', 'MastheadToggle', 'MastheadMain', 'MastheadBrand', import BarsIcon from '@patternfly/react-icons/dist/js/icons/bars-icon'; import { Link } from '@reach/router'; -import pfIcon from '../../assets/pf-logo.svg'; +import pfIcon from '../../assets/PF-HorizontalLogo-Color.svg'; `Masthead` should contain the following components to maintain proper layout and formatting: `MastheadToggle`, `MastheadMain`, and `MastheadContent`. @@ -17,173 +17,35 @@ import pfIcon from '../../assets/pf-logo.svg'; ### Basic -```ts -import React from 'react'; -import { Masthead, MastheadToggle, MastheadMain, MastheadBrand, MastheadContent, Button } from '@patternfly/react-core'; -import BarsIcon from '@patternfly/react-icons/dist/js/icons/bars-icon'; - - - - - - - Logo - - - Content - -; +```ts file="./MastheadBasic.tsx" ``` ### Basic with mixed content -```ts -import React from 'react'; -import { - Masthead, - MastheadToggle, - MastheadMain, - MastheadBrand, - MastheadContent, - Button, - Flex, - FlexItem -} from '@patternfly/react-core'; -import BarsIcon from '@patternfly/react-icons/dist/js/icons/bars-icon'; - - - - - - - Logo - - - - Testing text color - - - - - - -; +```ts file="./MastheadBasicMixedContent.tsx" ``` ### Display inline -```ts -import React from 'react'; -import { Masthead, MastheadToggle, MastheadMain, MastheadBrand, MastheadContent, Button } from '@patternfly/react-core'; -import BarsIcon from '@patternfly/react-icons/dist/js/icons/bars-icon'; - - - - - - - Logo - - - Content - -; +```ts file="./MastheadDisplayInline.tsx" ``` ### Display stack -```ts -import React from 'react'; -import { Masthead, MastheadToggle, MastheadMain, MastheadBrand, MastheadContent, Button } from '@patternfly/react-core'; -import BarsIcon from '@patternfly/react-icons/dist/js/icons/bars-icon'; - - - - - - - Logo - - - Content - -; +```ts file="./MastheadDisplayStack.tsx" ``` ### Display stack, display inline responsive -```ts -import React from 'react'; -import { Masthead, MastheadToggle, MastheadMain, MastheadBrand, MastheadContent, Button } from '@patternfly/react-core'; -import BarsIcon from '@patternfly/react-icons/dist/js/icons/bars-icon'; - - - - - - - Logo - - - Content - -; +```ts file="./MastheadDisplayStackInlineResponsive.tsx" ``` ### Inset -```ts -import React from 'react'; -import { Masthead, MastheadToggle, MastheadMain, MastheadBrand, MastheadContent, Button } from '@patternfly/react-core'; -import BarsIcon from '@patternfly/react-icons/dist/js/icons/bars-icon'; - - - - - - - Logo - - - Content - -; +```ts file="./MastheadInsets.tsx" ``` ### With icon router link -```ts -import React from 'react'; -import { Masthead, MastheadToggle, MastheadMain, MastheadBrand, MastheadContent, Button, Brand } from '@patternfly/react-core'; -import BarsIcon from '@patternfly/react-icons/dist/js/icons/bars-icon'; -import { Link } from '@reach/router'; -import pfIcon from '../../assets/pf-logo.svg'; - - - - - - - }> - - - - - Content - -; +```ts file="./MastheadIconRouterLink.tsx" ``` diff --git a/packages/react-core/src/components/Masthead/examples/MastheadBasic.tsx b/packages/react-core/src/components/Masthead/examples/MastheadBasic.tsx new file mode 100644 index 00000000000..7551f11efac --- /dev/null +++ b/packages/react-core/src/components/Masthead/examples/MastheadBasic.tsx @@ -0,0 +1,19 @@ +import React from 'react'; +import { Masthead, MastheadToggle, MastheadMain, MastheadBrand, MastheadContent, Button } from '@patternfly/react-core'; +import BarsIcon from '@patternfly/react-icons/dist/js/icons/bars-icon'; + +export const MastheadBasic: React.FunctionComponent = () => ( + + + + + + Logo + + + Content + + +); diff --git a/packages/react-core/src/components/Masthead/examples/MastheadBasicMixedContent.tsx b/packages/react-core/src/components/Masthead/examples/MastheadBasicMixedContent.tsx new file mode 100644 index 00000000000..7610b4f88d1 --- /dev/null +++ b/packages/react-core/src/components/Masthead/examples/MastheadBasicMixedContent.tsx @@ -0,0 +1,37 @@ +import React from 'react'; +import { + Masthead, + MastheadToggle, + MastheadMain, + MastheadBrand, + MastheadContent, + Button, + Flex, + FlexItem +} from '@patternfly/react-core'; +import BarsIcon from '@patternfly/react-icons/dist/js/icons/bars-icon'; + +export const MastheadBasicMixedContent: React.FunctionComponent = () => ( + + + + + + Logo + + + + Content + + + + + + + + + + +); diff --git a/packages/react-core/src/components/Masthead/examples/MastheadDisplayInline.tsx b/packages/react-core/src/components/Masthead/examples/MastheadDisplayInline.tsx new file mode 100644 index 00000000000..8e200aa787e --- /dev/null +++ b/packages/react-core/src/components/Masthead/examples/MastheadDisplayInline.tsx @@ -0,0 +1,19 @@ +import React from 'react'; +import { Masthead, MastheadToggle, MastheadMain, MastheadBrand, MastheadContent, Button } from '@patternfly/react-core'; +import BarsIcon from '@patternfly/react-icons/dist/js/icons/bars-icon'; + +export const MastheadDisplayInline: React.FunctionComponent = () => ( + + + + + + Logo + + + Content + + +); diff --git a/packages/react-core/src/components/Masthead/examples/MastheadDisplayStack.tsx b/packages/react-core/src/components/Masthead/examples/MastheadDisplayStack.tsx new file mode 100644 index 00000000000..29c30098657 --- /dev/null +++ b/packages/react-core/src/components/Masthead/examples/MastheadDisplayStack.tsx @@ -0,0 +1,19 @@ +import React from 'react'; +import { Masthead, MastheadToggle, MastheadMain, MastheadBrand, MastheadContent, Button } from '@patternfly/react-core'; +import BarsIcon from '@patternfly/react-icons/dist/js/icons/bars-icon'; + +export const MastheadDisplayStack: React.FunctionComponent = () => ( + + + + + + Logo + + + Content + + +); diff --git a/packages/react-core/src/components/Masthead/examples/MastheadDisplayStackInlineResponsive.tsx b/packages/react-core/src/components/Masthead/examples/MastheadDisplayStackInlineResponsive.tsx new file mode 100644 index 00000000000..0e455a2c73e --- /dev/null +++ b/packages/react-core/src/components/Masthead/examples/MastheadDisplayStackInlineResponsive.tsx @@ -0,0 +1,19 @@ +import React from 'react'; +import { Masthead, MastheadToggle, MastheadMain, MastheadBrand, MastheadContent, Button } from '@patternfly/react-core'; +import BarsIcon from '@patternfly/react-icons/dist/js/icons/bars-icon'; + +export const MastheadDisplayStackInlineResponsive: React.FunctionComponent = () => ( + + + + + + Logo + + + Content + + +); diff --git a/packages/react-core/src/components/Masthead/examples/MastheadIconRouterLink.tsx b/packages/react-core/src/components/Masthead/examples/MastheadIconRouterLink.tsx new file mode 100644 index 00000000000..31c9cd4c259 --- /dev/null +++ b/packages/react-core/src/components/Masthead/examples/MastheadIconRouterLink.tsx @@ -0,0 +1,31 @@ +import React from 'react'; +import { + Masthead, + MastheadToggle, + MastheadMain, + MastheadBrand, + MastheadContent, + Button, + Brand +} from '@patternfly/react-core'; +import BarsIcon from '@patternfly/react-icons/dist/js/icons/bars-icon'; +import { Link } from '@reach/router'; +import pfIcon from '../../assets/PF-HorizontalLogo-Color.svg'; + +export const MastheadIconRouterLink: React.FunctionComponent = () => ( + + + + + + }> + + + + + Content + + +); diff --git a/packages/react-core/src/components/Masthead/examples/MastheadInsets.tsx b/packages/react-core/src/components/Masthead/examples/MastheadInsets.tsx new file mode 100644 index 00000000000..0a0326a012f --- /dev/null +++ b/packages/react-core/src/components/Masthead/examples/MastheadInsets.tsx @@ -0,0 +1,19 @@ +import React from 'react'; +import { Masthead, MastheadToggle, MastheadMain, MastheadBrand, MastheadContent, Button } from '@patternfly/react-core'; +import BarsIcon from '@patternfly/react-icons/dist/js/icons/bars-icon'; + +export const MastheadInsets: React.FunctionComponent = () => ( + + + + + + Logo + + + Content + + +); diff --git a/packages/react-core/src/components/assets/PF-HorizontalLogo-Color.svg b/packages/react-core/src/components/assets/PF-HorizontalLogo-Color.svg new file mode 100644 index 00000000000..7f227158ad8 --- /dev/null +++ b/packages/react-core/src/components/assets/PF-HorizontalLogo-Color.svg @@ -0,0 +1,29 @@ + + + PF-HorizontalLogo-Color + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/react-core/src/demos/DashboardHeader.tsx b/packages/react-core/src/demos/DashboardHeader.tsx index 6fad90fda90..d4d59c97e9e 100644 --- a/packages/react-core/src/demos/DashboardHeader.tsx +++ b/packages/react-core/src/demos/DashboardHeader.tsx @@ -28,7 +28,7 @@ import QuestionCircleIcon from '@patternfly/react-icons/dist/esm/icons/question- import BellIcon from '@patternfly/react-icons/dist/esm/icons/bell-icon'; import EllipsisVIcon from '@patternfly/react-icons/dist/esm/icons/ellipsis-v-icon'; import imgAvatar from '@patternfly/react-core/src/components/assets/avatarImg.svg'; -import pfLogo from '@patternfly/react-core/src/demos/assets/pf-logo.svg'; +import pfLogo from '@patternfly/react-core/src/demos/assets/PF-HorizontalLogo-Color.svg'; interface DashboardHeaderProps { /** Render custom notification badge */ diff --git a/packages/react-core/src/demos/Masthead.md b/packages/react-core/src/demos/Masthead.md index a11302319ad..83a100eb148 100644 --- a/packages/react-core/src/demos/Masthead.md +++ b/packages/react-core/src/demos/Masthead.md @@ -12,7 +12,7 @@ import ThIcon from '@patternfly/react-icons/dist/esm/icons/th-icon'; import QuestionCircleIcon from '@patternfly/react-icons/dist/esm/icons/question-circle-icon'; import imgAvatar from '@patternfly/react-core/src/components/assets/avatarImg.svg'; import pfIcon from './assets/pf-logo-small.svg'; -import pfLogo from './assets/pf-logo.svg'; +import pfLogo from './assets/PF-HorizontalLogo-Color.svg'; import { Link } from '@reach/router'; ## Demos diff --git a/packages/react-core/src/demos/Nav.md b/packages/react-core/src/demos/Nav.md index 74b6e3fdc3d..be737df09b5 100644 --- a/packages/react-core/src/demos/Nav.md +++ b/packages/react-core/src/demos/Nav.md @@ -10,7 +10,7 @@ import EllipsisVIcon from '@patternfly/react-icons/dist/esm/icons/ellipsis-v-ico import BellIcon from '@patternfly/react-icons/dist/esm/icons/bell-icon'; import BarsIcon from '@patternfly/react-icons/dist/esm/icons/bars-icon'; import imgAvatar from '@patternfly/react-core/src/components/assets/avatarImg.svg'; -import pfLogo from '@patternfly/react-core/src/demos/assets/pf-logo.svg'; +import pfLogo from '@patternfly/react-core/src/demos/assets/PF-HorizontalLogo-Color.svg'; ## Demos diff --git a/packages/react-core/src/demos/NotificationDrawer/NotificationDrawer.md b/packages/react-core/src/demos/NotificationDrawer/NotificationDrawer.md index 0340deeb364..90771bdb133 100644 --- a/packages/react-core/src/demos/NotificationDrawer/NotificationDrawer.md +++ b/packages/react-core/src/demos/NotificationDrawer/NotificationDrawer.md @@ -11,7 +11,7 @@ import QuestionCircleIcon from '@patternfly/react-icons/dist/esm/icons/question- import SearchIcon from '@patternfly/react-icons/dist/esm/icons/search-icon'; import imgAvatar from '@patternfly/react-core/src/components/assets/avatarImg.svg'; import EllipsisVIcon from '@patternfly/react-icons/dist/esm/icons/ellipsis-v-icon'; -import pfLogo from '@patternfly/react-core/src/demos/assets/pf-logo.svg'; +import pfLogo from '@patternfly/react-core/src/demos/assets/PF-HorizontalLogo-Color.svg'; ## Demos diff --git a/packages/react-core/src/demos/NotificationDrawer/examples/NotificationDrawerBasic.tsx b/packages/react-core/src/demos/NotificationDrawer/examples/NotificationDrawerBasic.tsx index c421679018c..d237fe84aee 100644 --- a/packages/react-core/src/demos/NotificationDrawer/examples/NotificationDrawerBasic.tsx +++ b/packages/react-core/src/demos/NotificationDrawer/examples/NotificationDrawerBasic.tsx @@ -55,7 +55,7 @@ import EllipsisVIcon from '@patternfly/react-icons/dist/esm/icons/ellipsis-v-ico import BarsIcon from '@patternfly/react-icons/dist/js/icons/bars-icon'; import imgAvatar from '@patternfly/react-core/src/components/assets/avatarImg.svg'; import SearchIcon from '@patternfly/react-icons/dist/esm/icons/search-icon'; -import pfLogo from '@patternfly/react-core/src/demos/assets/pf-logo.svg'; +import pfLogo from '@patternfly/react-core/src/demos/assets/pf-logo.PF-HorizontalLogo-Color.svg'; export const NotificationDrawerBasic: React.FunctionComponent = () => { const drawerRef = React.useRef(null); diff --git a/packages/react-core/src/demos/NotificationDrawer/examples/NotificationDrawerGrouped.tsx b/packages/react-core/src/demos/NotificationDrawer/examples/NotificationDrawerGrouped.tsx index 34377b28e49..250782181f1 100644 --- a/packages/react-core/src/demos/NotificationDrawer/examples/NotificationDrawerGrouped.tsx +++ b/packages/react-core/src/demos/NotificationDrawer/examples/NotificationDrawerGrouped.tsx @@ -57,7 +57,7 @@ import SearchIcon from '@patternfly/react-icons/dist/esm/icons/search-icon'; import QuestionCircleIcon from '@patternfly/react-icons/dist/esm/icons/question-circle-icon'; import EllipsisVIcon from '@patternfly/react-icons/dist/esm/icons/ellipsis-v-icon'; import imgAvatar from '@patternfly/react-core/src/components/assets/avatarImg.svg'; -import pfLogo from '@patternfly/react-core/src/demos/assets/pf-logo.svg'; +import pfLogo from '@patternfly/react-core/src/demos/assets/pf-logo.PF-HorizontalLogo-Color.svg'; export const NotificationDrawerGrouped: React.FunctionComponent = () => { const drawerRef = React.useRef(null); diff --git a/packages/react-core/src/demos/Page.md b/packages/react-core/src/demos/Page.md index e85f8899960..d565e49e6e3 100644 --- a/packages/react-core/src/demos/Page.md +++ b/packages/react-core/src/demos/Page.md @@ -12,7 +12,7 @@ import BarsIcon from '@patternfly/react-icons/dist/esm/icons/bars-icon'; import AttentionBellIcon from '@patternfly/react-icons/dist/esm/icons/attention-bell-icon'; import LightbulbIcon from '@patternfly/react-icons/dist/esm/icons/lightbulb-icon'; import EllipsisVIcon from '@patternfly/react-icons/dist/esm/icons/ellipsis-v-icon'; -import pfLogo from '@patternfly/react-core/src/demos/assets/pf-logo.svg'; +import pfLogo from '@patternfly/react-core/src/demos/assets/PF-HorizontalLogo-Color.svg'; - All examples set the `isManagedSidebar` prop on the Page component to have the sidebar automatically close for smaller screen widths. You can also manually control this behavior by not adding the `isManagedSidebar` prop and instead: diff --git a/packages/react-core/src/demos/RTL/RTL.md b/packages/react-core/src/demos/RTL/RTL.md index 7285d2b3f36..a47624ff01e 100644 --- a/packages/react-core/src/demos/RTL/RTL.md +++ b/packages/react-core/src/demos/RTL/RTL.md @@ -9,7 +9,7 @@ import AlignRightIcon from '@patternfly/react-icons/dist/esm/icons/align-right-i import ToolsIcon from '@patternfly/react-icons/dist/esm/icons/tools-icon'; import ClockIcon from '@patternfly/react-icons/dist/esm/icons/clock-icon'; import WalkingIcon from '@patternfly/react-icons/dist/esm/icons/walking-icon'; -import pfLogo from '@patternfly/react-core/src/demos/assets/pf-logo.svg'; +import pfLogo from '@patternfly/react-core/src/demos/assets/PF-HorizontalLogo-Color.svg'; import BarsIcon from '@patternfly/react-icons/dist/esm/icons/bars-icon'; import CogIcon from '@patternfly/react-icons/dist/esm/icons/cog-icon'; import QuestionCircleIcon from '@patternfly/react-icons/dist/esm/icons/question-circle-icon'; diff --git a/packages/react-core/src/demos/RTL/examples/PaginatedTable.jsx b/packages/react-core/src/demos/RTL/examples/PaginatedTable.jsx index 3199822b294..ad740bb1191 100644 --- a/packages/react-core/src/demos/RTL/examples/PaginatedTable.jsx +++ b/packages/react-core/src/demos/RTL/examples/PaginatedTable.jsx @@ -49,7 +49,7 @@ import AlignRightIcon from '@patternfly/react-icons/dist/esm/icons/align-right-i import ToolsIcon from '@patternfly/react-icons/dist/esm/icons/tools-icon'; import ClockIcon from '@patternfly/react-icons/dist/esm/icons/clock-icon'; import WalkingIcon from '@patternfly/react-icons/dist/esm/icons/walking-icon'; -import pfLogo from '@patternfly/react-core/src/demos/assets/pf-logo.svg'; +import pfLogo from '@patternfly/react-core/src/demos/assets/PF-HorizontalLogo-Color.svg'; import BarsIcon from '@patternfly/react-icons/dist/esm/icons/bars-icon'; import CogIcon from '@patternfly/react-icons/dist/esm/icons/cog-icon'; import QuestionCircleIcon from '@patternfly/react-icons/dist/esm/icons/question-circle-icon'; diff --git a/packages/react-core/src/demos/Wizard/WizardDemo.md b/packages/react-core/src/demos/Wizard/WizardDemo.md index 9aac19d69f7..052701f6cc9 100644 --- a/packages/react-core/src/demos/Wizard/WizardDemo.md +++ b/packages/react-core/src/demos/Wizard/WizardDemo.md @@ -4,7 +4,7 @@ section: components source: react-demos --- -import pfLogo from '@patternfly/react-core/src/demos/assets/pf-logo.svg'; +import pfLogo from '@patternfly/react-core/src/demos/assets/PF-HorizontalLogo-Color.svg'; import BarsIcon from '@patternfly/react-icons/dist/js/icons/bars-icon'; ## Demos diff --git a/packages/react-core/src/demos/assets/PF-HorizontalLogo-Color.svg b/packages/react-core/src/demos/assets/PF-HorizontalLogo-Color.svg new file mode 100644 index 00000000000..7f227158ad8 --- /dev/null +++ b/packages/react-core/src/demos/assets/PF-HorizontalLogo-Color.svg @@ -0,0 +1,29 @@ + + + PF-HorizontalLogo-Color + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/react-core/src/demos/examples/Masthead/MastheadWithUtilitiesAndUserDropdownMenu.tsx b/packages/react-core/src/demos/examples/Masthead/MastheadWithUtilitiesAndUserDropdownMenu.tsx index 6a84cf2830f..515e4d37074 100644 --- a/packages/react-core/src/demos/examples/Masthead/MastheadWithUtilitiesAndUserDropdownMenu.tsx +++ b/packages/react-core/src/demos/examples/Masthead/MastheadWithUtilitiesAndUserDropdownMenu.tsx @@ -57,7 +57,7 @@ import ThIcon from '@patternfly/react-icons/dist/esm/icons/th-icon'; import QuestionCircleIcon from '@patternfly/react-icons/dist/esm/icons/question-circle-icon'; import imgAvatar from '@patternfly/react-core/src/components/assets/avatarImg.svg'; import pfIcon from '@patternfly/react-core/src/demos/assets/pf-logo-small.svg'; -import pfLogo from '@patternfly/react-core/src/demos/assets/pf-logo.svg'; +import pfLogo from '@patternfly/react-core/src/demos/assets/PF-HorizontalLogo-Color.svg'; interface NavOnSelectProps { groupId: number | string; diff --git a/packages/react-core/src/demos/examples/Nav/NavFlyout.tsx b/packages/react-core/src/demos/examples/Nav/NavFlyout.tsx index f15bbaf36d6..894fbd6cb82 100644 --- a/packages/react-core/src/demos/examples/Nav/NavFlyout.tsx +++ b/packages/react-core/src/demos/examples/Nav/NavFlyout.tsx @@ -40,7 +40,7 @@ import EllipsisVIcon from '@patternfly/react-icons/dist/esm/icons/ellipsis-v-ico import HelpIcon from '@patternfly/react-icons/dist/esm/icons/help-icon'; import QuestionCircleIcon from '@patternfly/react-icons/dist/esm/icons/question-circle-icon'; import imgAvatar from '@patternfly/react-core/src/components/assets/avatarImg.svg'; -import pfLogo from '@patternfly/react-core/src/demos/assets/pf-logo.svg'; +import pfLogo from '@patternfly/react-core/src/demos/assets/PF-HorizontalLogo-Color.svg'; export const NavFlyout: React.FunctionComponent = () => { const [isDropdownOpen, setIsDropdownOpen] = React.useState(false); diff --git a/packages/react-core/src/demos/examples/Nav/NavHorizontal.tsx b/packages/react-core/src/demos/examples/Nav/NavHorizontal.tsx index f08a331d00f..1fbe9738904 100644 --- a/packages/react-core/src/demos/examples/Nav/NavHorizontal.tsx +++ b/packages/react-core/src/demos/examples/Nav/NavHorizontal.tsx @@ -37,7 +37,7 @@ import QuestionCircleIcon from '@patternfly/react-icons/dist/esm/icons/question- import EllipsisVIcon from '@patternfly/react-icons/dist/esm/icons/ellipsis-v-icon'; import BellIcon from '@patternfly/react-icons/dist/esm/icons/bell-icon'; import imgAvatar from '@patternfly/react-core/src/components/assets/avatarImg.svg'; -import pfLogo from '@patternfly/react-core/src/demos/assets/pf-logo.svg'; +import pfLogo from '@patternfly/react-core/src/demos/assets/PF-HorizontalLogo-Color.svg'; import { DashboardBreadcrumb } from '@patternfly/react-core/src/demos/DashboardWrapper'; export const NavHorizontal: React.FunctionComponent = () => { diff --git a/packages/react-core/src/demos/examples/Nav/NavHorizontalWithSubnav.tsx b/packages/react-core/src/demos/examples/Nav/NavHorizontalWithSubnav.tsx index 088079714d3..b10683eb195 100644 --- a/packages/react-core/src/demos/examples/Nav/NavHorizontalWithSubnav.tsx +++ b/packages/react-core/src/demos/examples/Nav/NavHorizontalWithSubnav.tsx @@ -41,7 +41,7 @@ import BellIcon from '@patternfly/react-icons/dist/esm/icons/bell-icon'; import BarsIcon from '@patternfly/react-icons/dist/esm/icons/bars-icon'; import EllipsisVIcon from '@patternfly/react-icons/dist/esm/icons/ellipsis-v-icon'; import imgAvatar from '@patternfly/react-core/src/components/assets/avatarImg.svg'; -import pfLogo from '@patternfly/react-core/src/demos/assets/pf-logo.svg'; +import pfLogo from '@patternfly/react-core/src/demos/assets/PF-HorizontalLogo-Color.svg'; import { DashboardBreadcrumb } from '@patternfly/react-core/src/demos/DashboardWrapper'; export const NavHorizontalWithSubnav: React.FunctionComponent = () => { diff --git a/packages/react-core/src/demos/examples/Nav/NavManual.tsx b/packages/react-core/src/demos/examples/Nav/NavManual.tsx index 61889609523..b097c3a9537 100644 --- a/packages/react-core/src/demos/examples/Nav/NavManual.tsx +++ b/packages/react-core/src/demos/examples/Nav/NavManual.tsx @@ -42,7 +42,7 @@ import EllipsisVIcon from '@patternfly/react-icons/dist/esm/icons/ellipsis-v-ico import BellIcon from '@patternfly/react-icons/dist/esm/icons/bell-icon'; import BarsIcon from '@patternfly/react-icons/dist/esm/icons/bars-icon'; import imgAvatar from '@patternfly/react-core/src/components/assets/avatarImg.svg'; -import pfLogo from '@patternfly/react-core/src/demos/assets/pf-logo.svg'; +import pfLogo from '@patternfly/react-core/src/demos/assets/PF-HorizontalLogo-Color.svg'; export const NavManual: React.FunctionComponent = () => { const [isDropdownOpen, setIsDropdownOpen] = React.useState(false); diff --git a/packages/react-core/src/demos/examples/Page/PageStickySectionBreadcrumb.tsx b/packages/react-core/src/demos/examples/Page/PageStickySectionBreadcrumb.tsx index 93e10b2c88b..ce284c71ba6 100644 --- a/packages/react-core/src/demos/examples/Page/PageStickySectionBreadcrumb.tsx +++ b/packages/react-core/src/demos/examples/Page/PageStickySectionBreadcrumb.tsx @@ -45,7 +45,7 @@ import HelpIcon from '@patternfly/react-icons/dist/esm/icons/help-icon'; import QuestionCircleIcon from '@patternfly/react-icons/dist/esm/icons/question-circle-icon'; import EllipsisVIcon from '@patternfly/react-icons/dist/esm/icons/ellipsis-v-icon'; import imgAvatar from '@patternfly/react-core/src/components/assets/avatarImg.svg'; -import pfLogo from '@patternfly/react-core/src/demos/assets/pf-logo.svg'; +import pfLogo from '@patternfly/react-core/src/demos/assets/PF-HorizontalLogo-Color.svg'; interface NavOnSelectProps { groupId: number | string; itemId: number | string; diff --git a/packages/react-core/src/demos/examples/Page/PageStickySectionGroup.tsx b/packages/react-core/src/demos/examples/Page/PageStickySectionGroup.tsx index bc79c632504..93299479df2 100644 --- a/packages/react-core/src/demos/examples/Page/PageStickySectionGroup.tsx +++ b/packages/react-core/src/demos/examples/Page/PageStickySectionGroup.tsx @@ -45,7 +45,7 @@ import HelpIcon from '@patternfly/react-icons/dist/esm/icons/help-icon'; import QuestionCircleIcon from '@patternfly/react-icons/dist/esm/icons/question-circle-icon'; import EllipsisVIcon from '@patternfly/react-icons/dist/esm/icons/ellipsis-v-icon'; import imgAvatar from '@patternfly/react-core/src/components/assets/avatarImg.svg'; -import pfLogo from '@patternfly/react-core/src/demos/assets/pf-logo.svg'; +import pfLogo from '@patternfly/react-core/src/demos/assets/PF-HorizontalLogo-Color.svg'; interface NavOnSelectProps { groupId: number | string; itemId: number | string; diff --git a/packages/react-core/src/demos/examples/Page/PageStickySectionGroupAlternate.tsx b/packages/react-core/src/demos/examples/Page/PageStickySectionGroupAlternate.tsx index bfb176da2bc..9d391f2ac28 100644 --- a/packages/react-core/src/demos/examples/Page/PageStickySectionGroupAlternate.tsx +++ b/packages/react-core/src/demos/examples/Page/PageStickySectionGroupAlternate.tsx @@ -47,7 +47,7 @@ import HelpIcon from '@patternfly/react-icons/dist/esm/icons/help-icon'; import QuestionCircleIcon from '@patternfly/react-icons/dist/esm/icons/question-circle-icon'; import EllipsisVIcon from '@patternfly/react-icons/dist/esm/icons/ellipsis-v-icon'; import imgAvatar from '@patternfly/react-core/src/components/assets/avatarImg.svg'; -import pfLogo from '@patternfly/react-core/src/demos/assets/pf-logo.svg'; +import pfLogo from '@patternfly/react-core/src/demos/assets/PF-HorizontalLogo-Color.svg'; interface NavOnSelectProps { groupId: number | string; diff --git a/packages/react-core/src/demos/examples/Wizard/InPageWithDrawer.tsx b/packages/react-core/src/demos/examples/Wizard/InPageWithDrawer.tsx index 4e106a3cdc5..30254bcd7b1 100644 --- a/packages/react-core/src/demos/examples/Wizard/InPageWithDrawer.tsx +++ b/packages/react-core/src/demos/examples/Wizard/InPageWithDrawer.tsx @@ -31,7 +31,7 @@ import { WizardStep, DrawerColorVariant } from '@patternfly/react-core'; -import pfLogo from '@patternfly/react-core/src/demos/assets/pf-logo.svg'; +import pfLogo from '@patternfly/react-core/src/demos/assets/PF-HorizontalLogo-Color.svg'; import BarsIcon from '@patternfly/react-icons/dist/js/icons/bars-icon'; export const WizardFullPageWithDrawerDemo: React.FunctionComponent = () => { diff --git a/packages/react-core/src/demos/examples/Wizard/InPageWithDrawerInformationalStep.tsx b/packages/react-core/src/demos/examples/Wizard/InPageWithDrawerInformationalStep.tsx index 6cc5afd3a4e..d6cfd475960 100644 --- a/packages/react-core/src/demos/examples/Wizard/InPageWithDrawerInformationalStep.tsx +++ b/packages/react-core/src/demos/examples/Wizard/InPageWithDrawerInformationalStep.tsx @@ -31,7 +31,7 @@ import { Wizard, WizardStep } from '@patternfly/react-core'; -import pfLogo from '@patternfly/react-core/src/demos/assets/pf-logo.svg'; +import pfLogo from '@patternfly/react-core/src/demos/assets/PF-HorizontalLogo-Color.svg'; import BarsIcon from '@patternfly/react-icons/dist/js/icons/bars-icon'; export const WizardFullPageWithDrawerInfoStepDemo: React.FunctionComponent = () => {