searchpage implementation

ReactJS/alfaprentice/src/Components/CTA/CTA.js

@@ -7,14 +7,21 @@ import "./Cta.css"
 class CTA extends React.Component {
     constructor(props) {
         super(props);
+        this.state = {
+            BTNText : this.props.BtnText,
+            ContentText : this.props.ContentText,
+        }
     }
 
     render() {
+
+
         return (
             <div className="Cta mt-5">
                 <div className="container">
                     <h1 className="mb-5">{this.props.title}</h1>
                     <a className="AP-Btn-outline">{this.props.BtnText}</a>
+                    
                 </div>
             </div>
         )

ReactJS/alfaprentice/src/Components/Pages/HomePage.css

@@ -1,6 +1,6 @@
 .HomeHero{
     position: relative;
-    background-image: url("../Components/images/Stock.png");
+    background-image: url("../images/Stock.png");
     padding: 150px 50px;
     background-size: cover;
 }
@@ -48,7 +48,7 @@
 }
 
 .OpleidingItemInner{
-    background:linear-gradient( rgba(0, 0, 0, 0.5) 100%, rgba(0, 0, 0, 0.5)100%),url("../Components/images/stock2.png");
+    background:linear-gradient( rgba(0, 0, 0, 0.5) 100%, rgba(0, 0, 0, 0.5)100%),url("../images/stock2.png");
     background-size: cover;
     background-position: center;
     height: 300px;

ReactJS/alfaprentice/src/Components/Pages/HomePage.js

@@ -8,7 +8,7 @@ import "./HomePage.css";
 import {
     HeroOne,
     CTA,
-    } from "../Components";
+    } from "../";
 
 class HomePage extends React.Component {
     render() {

ReactJS/alfaprentice/src/Components/Pages/Search/InternSearchPage.js

@@ -0,0 +1,21 @@
+//Module
+import React from 'react';
+
+//Component
+import {
+    HeroOne,
+    CTA,
+    } from "../../";
+
+class InternSearch extends React.Component {
+    render() {
+        return (
+            <div className="SearchPage">
+                <HeroOne title="Stageplek zoeken" content="Voor de opleiding Applicatie en mediaontwikkeling"/>
+                <CTA title="Geen plek kunnen vinden of vragen of je ook bij een eigen benadert bedrijf stage mag lopen" ContentText="Neem dan contact op met je mentor of stage begeleider om te vragen naar de mogelijkheden"/>
+            </div>
+        )
+    }
+}
+
+export default InternSearch;

ReactJS/alfaprentice/src/Components/Routing/Router.js

@@ -11,7 +11,10 @@ import {
 import { DefaultLayout } from '../';
 
 //Main routes
-import {HomePage} from '../';
+import { 
+        HomePage,
+        InternSearch
+      } from '../';
 
 //Sub routes
 
@@ -33,6 +36,7 @@ class GlobalRouter extends React.Component {
                   <DefaultLayout>
                     <Switch>
                         <Route exact path="/" component={HomePage} />
+                        <Route path="/zoeken" component={InternSearch} />
                     </Switch> 
                 </DefaultLayout>
               </Router>     

ReactJS/alfaprentice/src/Components/index.js

@@ -9,7 +9,8 @@ import Footer from "./Footer/Footer";
 import DefaultLayout from "./Layouts/DefaultLayout";
 
 //Pages imports
-import HomePage from '../Pages/HomePage';
+import HomePage from './Pages/HomePage';
+import InternSearch from "./Pages/Search/InternSearchPage";
 
 //Style
 import "./GlobalStyles.css";
@@ -33,4 +34,5 @@ export {
 //Pages export
 export {
     HomePage,
+    InternSearch,
 }