Add styling to header

Add color and size properties to header title Add mail address to contact tab
redhatcloudx · Aug 24, 2023 · de4a6c5 · de4a6c5
1 parent e8d4a98
commit de4a6c5
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 2 deletions.
diff --git a/src/app/AppLayout/AppLayout.tsx b/src/app/AppLayout/AppLayout.tsx
@@ -95,7 +95,7 @@ const AppLayout: React.FunctionComponent<IAppLayout> = ({ children }) => {
           href='https://imagedirectory.cloud'
           alt='Cloud Image Directory'
           className='header-section'>
-          <Title headingLevel='h1' size='lg' className='header-text'>
+          <Title headingLevel='h1' className="header-title">
             Cloud Image Directory
           </Title>
         </MastheadBrand>

diff --git a/src/app/app.css b/src/app/app.css
@@ -2,6 +2,11 @@ html, body, #root {
   height: 100%;
 }
 
+.header-title {
+  size: lg;
+  color: white;
+}
+
 .hero-section {
   background-color: black;
 }

diff --git a/src/app/routes.tsx b/src/app/routes.tsx
@@ -47,7 +47,7 @@ const routes: AppRouteConfig[] = [
     component: <Home title='Cloud Image Directory | Contact Us' />,
     exact: true,
     label: 'Contact Us',
-    path: '/contact',
+    path: 'mailto: contact@imagedirectory.cloud',
   },
   {
     component: <ImageDetails title='Cloud Image Directory | Image Details' />,