From 0af79b391baf12e213c96a0b0336a915d1eede14 Mon Sep 17 00:00:00 2001
From: Tsu-ba-me <ynho.li.aa.e@gmail.com>
Date: Fri, 17 Feb 2023 23:45:15 -0500
Subject: [PATCH] fix(striker-ui): emphasis fence name and enable scroll in
 ManageFencesPanel add/edit dialog

---
 striker-ui/components/ManageFencesPanel.tsx | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/striker-ui/components/ManageFencesPanel.tsx b/striker-ui/components/ManageFencesPanel.tsx
index dccbec20..6f391fd2 100644
--- a/striker-ui/components/ManageFencesPanel.tsx
+++ b/striker-ui/components/ManageFencesPanel.tsx
@@ -12,7 +12,7 @@ import List from './List';
 import { Panel, PanelHeader } from './Panels';
 import periodicFetch from '../lib/fetchers/periodicFetch';
 import Spinner from './Spinner';
-import { BodyText, HeaderText } from './Text';
+import { BodyText, HeaderText, InlineMonoText } from './Text';
 import useIsFirstRender from '../hooks/useIsFirstRender';
 import useProtectedState from '../hooks/useProtectedState';
 
@@ -70,7 +70,13 @@ const ManageFencesPanel: FC = () => {
                 previousFenceParameters={fenceParameters}
               />
             ),
-            titleText: `Update fence ${fenceName} parameters`,
+            titleText: (
+              <HeaderText>
+                Update fence device{' '}
+                <InlineMonoText variant="h4">{fenceName}</InlineMonoText>{' '}
+                parameters
+              </HeaderText>
+            ),
           });
 
           confirmDialogRef.current.setOpen?.call(null, true);
@@ -131,6 +137,7 @@ const ManageFencesPanel: FC = () => {
           PaperProps: { sx: { minWidth: { xs: '90%', md: '50em' } } },
         }}
         formContent
+        scrollContent
         {...confirmDialogProps}
         ref={confirmDialogRef}
       />