Fixed the issue by adding the h3 css to the pageHeader component and …

…fixed the header margin issue on the open source internship programs page. Signed-off-by: faatima_abidi <[email protected]>
layer5io · Dec 19, 2024 · 860d443 · 860d443
1 parent a199d8c
commit 860d443
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 12 deletions.
diff --git a/src/reusecore/PageHeader/pageHeader.style.js b/src/reusecore/PageHeader/pageHeader.style.js
@@ -24,6 +24,15 @@ const PageHeaderWrapper = styled.div`
 
                 }
             }
+            h3 {
+                color: ${(props) => props.theme.whiteSixToGreen3C494F};
+                margin-top: 2rem;
+                padding: 0;
+                font-weight: 500;
+                text-align: center;
+                transition: 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);
+            }
+
         }
         
         .feature-image{

diff --git a/src/sections/Careers/Careers-Programs-grid/ProgramGrid.style.js b/src/sections/Careers/Careers-Programs-grid/ProgramGrid.style.js
@@ -1,15 +1,6 @@
 import styled from "styled-components";
 export const ProgramsPageWrapper = styled.div`
-
-    h3 {
-        color: ${(props) => props.theme.whiteSixToGreen3C494F};
-        margin: 0;
-        padding: 0;
-        font-weight: 500;
-        text-align: center;
-        transition: 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);
-    }
-
+    
     h1{
         color: ${props => props.theme.text};
         transition: 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);

diff --git a/src/sections/Careers/Careers-Programs-grid/index.js b/src/sections/Careers/Careers-Programs-grid/index.js
@@ -57,8 +57,7 @@ const ProgramsGrid = ({ hide_path, sub_section }) => {
 
   return (
     <ProgramsPageWrapper>
-      <PageHeader className="title" title="Open Source Internship Programs" path={path} />
-      <h3>Build Your Career at Layer5</h3>
+      <PageHeader title="Open Source Internship Programs" subtitle="Build Your Career at Layer5" path={path} />
       <div className={sub_section ? "sub-header_wrapper" : "programs-page-wrapper"}>
         <Container>
           <div className="program-grid-wrapper">