refactor: use the PanelHeader component with nodes to get the shifted header effecft

striker-ui/components/AnvilNode.tsx

@@ -3,6 +3,7 @@ import { Grid, Switch } from '@material-ui/core';
 import InnerPanel from './InnerPanel';
 import ProgressBar from './ProgressBar';
 import { BodyText } from './Text';
+import PanelHeader from './PanelHeader';
 
 const AnvilNode = ({
   node,
@@ -16,14 +17,18 @@ const AnvilNode = ({
           (n): JSX.Element => {
             return (
               <InnerPanel key={n.node_uuid}>
-                <Grid container alignItems="center" justify="space-around">
-                  <Grid item xs={6}>
-                    <BodyText text={`Node: ${n.node_name}`} />
-                  </Grid>
-                  <Grid item xs={3}>
-                    <Switch checked />
+                <PanelHeader>
+                  <Grid container alignItems="center" justify="space-around">
+                    <Grid item xs={7}>
+                      <BodyText text={`Node: ${n.node_name}`} />
+                    </Grid>
+                    <Grid item xs={3}>
+                      <Switch checked />
+                    </Grid>
                   </Grid>
-                  <Grid item xs={6}>
+                </PanelHeader>
+                <Grid container alignItems="center" justify="space-around">
+                  <Grid item xs={5}>
                     <BodyText text={`State: ${n.state}`} />
                   </Grid>
                   <Grid item xs={4}>