icons

src/Components/PageHeader.jsx

@@ -1,12 +1,28 @@
+import plus from '../assets/plus.svg'
+import pencil from '../assets/pencil.svg'
+import trash from '../assets/trash.svg'
+import { Link } from 'react-router-dom'
 export default function (props){
     return(
-        <header>
+        <header id="page-header">
             <h2>
                 {props.super}
             </h2>
             <h1>
                 {props.heading}
             </h1>
+            <span id="icon-container">
+            <Link to={`${props.url}/create`} >
+            <img src={plus}/>    
+            </Link>
+            <Link to={`${props.url}${props?.id?`/${props.id}`:""}/edit`} >
+            <img src={pencil}/>
+            </Link>
+            <Link to={`${props.url}${props?.id?`/${props.id}`:""}/delete`} >
+            <img src={trash}/>
+            </Link>  
+            </span>
+            
         </header>
     )
 }

src/assets/pencil.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="8" height="8" viewBox="0 0 8 8">
+  <path d="M6 0l-1 1 2 2 1-1-2-2zm-2 2l-4 4v2h2l4-4-2-2z" />
+</svg>

src/assets/plus.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="8" height="8" viewBox="0 0 8 8">
+  <path d="M3 0v3h-3v2h3v3h2v-3h3v-2h-3v-3h-2z" />
+</svg>

src/assets/trash.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="8" height="8" viewBox="0 0 8 8">
+  <path d="M3 0c-.55 0-1 .45-1 1h-1c-.55 0-1 .45-1 1h7c0-.55-.45-1-1-1h-1c0-.55-.45-1-1-1h-1zm-2 3v4.81c0 .11.08.19.19.19h4.63c.11 0 .19-.08.19-.19v-4.81h-1v3.5c0 .28-.22.5-.5.5s-.5-.22-.5-.5v-3.5h-1v3.5c0 .28-.22.5-.5.5s-.5-.22-.5-.5v-3.5h-1z" />
+</svg>