🍊

client/src/pages/Session.tsx

@@ -2,7 +2,7 @@ import React, { useEffect, useState } from 'react'
 import { RouteComponentProps, useHistory } from 'react-router-dom'
 import { getClient, killSession, restartSession } from '../api'
 import { SessionPictures } from './SessionPictures'
-import { Button, message, PageHeader, Popconfirm, Row } from 'antd'
+import { Button, Divider, message, PageHeader, Popconfirm, Row } from 'antd'
 import { Content } from 'antd/lib/layout/layout'
 
 type Props = RouteComponentProps<{ clientId: string }>
@@ -43,47 +43,50 @@ export const Session = (props: Props) => {
 
   return (
     <Content>
-      <div className="site-page-header-ghost-wrapper">
-        <PageHeader
-          ghost={false}
-          onBack={() => history.goBack()}
-          title={`Session for ${clientId}`}
-          subTitle={`session has ${active ? 'started' : 'not started'}`}
-          extra={[
-            <Button
-              key="startsession"
-              disabled={active}
-              type="primary"
-              onClick={handleStartSession}
-            >
-              Capture
-            </Button>,
-            <Popconfirm
-              title="Re-capture set?"
-              onConfirm={handleRestartSession}
-            >
-              <Button key="retry" type="default" disabled={!active}>
-                Retry Capture
-              </Button>
-            </Popconfirm>,
-            <Popconfirm title="Delete all photos?" onConfirm={handleNuke}>
-              <Button key="nuke" danger disabled={!active}>
-                Nuke Session
-              </Button>
-            </Popconfirm>,
-            <Button
-              key="finish"
-              ghost
-              type="primary"
-              disabled={!active}
-              onClick={handleExit}
-            >
-              Finish Session
-            </Button>,
-          ]}
-        ></PageHeader>
-      </div>
-
+      <PageHeader
+        ghost={false}
+        onBack={() => history.goBack()}
+        title={`Session for ${clientId}`}
+        subTitle={`session has ${active ? 'started' : 'not started'}`}
+        extra={[
+          <Button
+            key="startsession"
+            disabled={active}
+            type="primary"
+            onClick={handleStartSession}
+          >
+            Capture
+          </Button>,
+          <Popconfirm
+            key="retry"
+            title="Re-capture set?"
+            onConfirm={handleRestartSession}
+          >
+            <Button type="default" disabled={!active}>
+              Retry Capture
+            </Button>
+          </Popconfirm>,
+          <Popconfirm
+            key="nuke"
+            title="Delete all photos?"
+            onConfirm={handleNuke}
+          >
+            <Button danger disabled={!active}>
+              Nuke Session
+            </Button>
+          </Popconfirm>,
+          <Button
+            key="finish"
+            ghost
+            type="primary"
+            disabled={!active}
+            onClick={handleExit}
+          >
+            Finish Session
+          </Button>,
+        ]}
+      ></PageHeader>
+      <Divider />
       <Row className="controls">
         {active && <SessionPictures clientId={clientId} />}
       </Row>