diff --git a/license-config.json b/license-config.json index 323cefda6..9183cac66 100644 --- a/license-config.json +++ b/license-config.json @@ -9,5 +9,5 @@ } } }, - "ignore": [".git", "tags", "coverage", "stories", "__mocks__","**/.*", "README.md", "**/*.js", "yarn.lock", ".github/**/*"] + "ignore": [".git", "tags", "coverage", "stories", "__mocks__","**/.*", "README.md", "**/*.js", "yarn.lock", ".github/**/*", "src/app/assets/*"] } diff --git a/src/app/AppLayout/AppLayout.tsx b/src/app/AppLayout/AppLayout.tsx index e25cc7b12..5f92303b0 100644 --- a/src/app/AppLayout/AppLayout.tsx +++ b/src/app/AppLayout/AppLayout.tsx @@ -41,23 +41,24 @@ import { ServiceContext } from '@app/Shared/Services/Services'; import { NotificationCenter } from '@app/Notifications/NotificationCenter'; import { IAppRoute, routes } from '@app/routes'; import { AboutModal, Alert, AlertGroup, AlertVariant, AlertActionCloseButton, - Button, Nav, NavItem, NavList, NotificationBadge, Page, PageHeader, + Brand, Button, Nav, NavItem, NavList, NotificationBadge, Page, PageHeader, PageHeaderTools, PageHeaderToolsGroup, PageHeaderToolsItem, PageSidebar, SkipToContent, Text, TextContent, TextList, TextListItem, TextVariants } from '@patternfly/react-core'; import { BellIcon, CogIcon, HelpIcon } from '@patternfly/react-icons'; import { map } from 'rxjs/operators'; import { matchPath, NavLink, useHistory, useLocation } from 'react-router-dom'; -import { Notification, Notifications, NotificationsContext } from '../Notifications/Notifications'; +import { Notification, Notifications, NotificationsContext } from '@app/Notifications/Notifications'; import { AuthModal } from './AuthModal'; import { SslErrorModal } from './SslErrorModal'; +import cryostatLogoHorizontal from '@app/assets/logo-cryostat-3-horizontal.svg'; +import cryostatLogoWhite from '@app/assets/logo-cryostat-3.svg'; interface IAppLayout { children: React.ReactNode; } const AppLayout: React.FunctionComponent = ({children}) => { - const context = React.useContext(ServiceContext); const serviceContext = React.useContext(ServiceContext); const notificationsContext = React.useContext(NotificationsContext); const routerHistory = useHistory(); @@ -194,7 +195,7 @@ const AppLayout: React.FunctionComponent = ({children}) => { ); const Header = (<> } logoProps={logoProps} showNavToggle isNavOpen={isNavOpen} @@ -205,9 +206,8 @@ const AppLayout: React.FunctionComponent = ({children}) => { isOpen={aboutModalOpen} onClose={handleAboutModalToggle} trademark='Copyright The Cryostat Authors, The Universal Permissive License (UPL), Version 1.0' - brandImageSrc='' // TODO + brandImageSrc={cryostatLogoWhite} brandImageAlt='Cryostat Logo' - productName='Cryostat' > diff --git a/src/app/app.css b/src/app/app.css index cf10d4566..df7e11487 100644 --- a/src/app/app.css +++ b/src/app/app.css @@ -38,3 +38,11 @@ SOFTWARE. html, body, #root { height: 100%; } + +.pf-c-about-modal-box__brand-image { + height: 8em; +} + +.cryostat-logo { + height: 2em; +} diff --git a/src/app/assets/cryostat-3-icon-16px.png b/src/app/assets/cryostat-3-icon-16px.png new file mode 100644 index 000000000..49baeadfc Binary files /dev/null and b/src/app/assets/cryostat-3-icon-16px.png differ diff --git a/src/app/assets/icon-cryostat-3-white.svg b/src/app/assets/icon-cryostat-3-white.svg new file mode 100644 index 000000000..619434046 --- /dev/null +++ b/src/app/assets/icon-cryostat-3-white.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/app/assets/icon-cryostat-3.svg b/src/app/assets/icon-cryostat-3.svg new file mode 100644 index 000000000..d08dc48d0 --- /dev/null +++ b/src/app/assets/icon-cryostat-3.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/app/assets/logo-cryostat-3-horizontal.svg b/src/app/assets/logo-cryostat-3-horizontal.svg new file mode 100644 index 000000000..a0855f819 --- /dev/null +++ b/src/app/assets/logo-cryostat-3-horizontal.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/app/assets/logo-cryostat-3.svg b/src/app/assets/logo-cryostat-3.svg new file mode 100644 index 000000000..0907287e0 --- /dev/null +++ b/src/app/assets/logo-cryostat-3.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/index.html b/src/index.html index 0068cde05..1261d0691 100644 --- a/src/index.html +++ b/src/index.html @@ -43,7 +43,6 @@ Cryostat - diff --git a/webpack.common.js b/webpack.common.js index 54ad167c4..fbe1934d8 100644 --- a/webpack.common.js +++ b/webpack.common.js @@ -13,7 +13,8 @@ module.exports = { plugins: [ new ForkTsCheckerPlugin(), new HtmlWebpackPlugin({ - template: path.resolve(__dirname, 'src', 'index.html') + template: path.resolve(__dirname, 'src', 'index.html'), + favicon: './src/app/assets/cryostat-3-icon-16px.png', }), ], // https://medium.com/hackernoon/the-100-correct-way-to-split-your-chunks-with-webpack-f8a9df5b7758 @@ -108,13 +109,16 @@ module.exports = { (input.indexOf('background-filter') === -1) && (input.indexOf('pficon') === -1) ), + exclude: [ + path.resolve(__dirname, 'src/app/assets') + ], use: { loader: 'raw-loader', options: {} } }, { - test: /\.(jpg|jpeg|png|gif)$/i, + test: /\.(jpg|jpeg|png|gif|svg)$/i, include: [ path.resolve(__dirname, 'src'), path.resolve(__dirname, 'node_modules/patternfly'),