fix(app): full-width jog controls

The jog controls were not wide enough in MeasureTip and MeasureNozzle, where they have only Z displayed. Use the new styled props to specify width=100%, which fixes the issue.
Opentrons · Nov 11, 2020 · b4cf09b · b4cf09b
1 parent 2ce4cb8
commit b4cf09b
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 14 deletions.
diff --git a/app/src/components/CalibrationPanels/MeasureNozzle.js b/app/src/components/CalibrationPanels/MeasureNozzle.js
@@ -194,13 +194,12 @@ export function MeasureNozzle(props: CalibrationPanelProps): React.Node {
             </Box>
           </Flex>
         </Box>
-        <div>
-          <JogControls
-            jog={jog}
-            stepSizes={[0.1, 1]}
-            planes={[VERTICAL_PLANE]}
-          />
-        </div>
+        <JogControls
+          jog={jog}
+          stepSizes={[0.1, 1]}
+          planes={[VERTICAL_PLANE]}
+          width="100%"
+        />
         <Flex width="100%" justifyContent={JUSTIFY_CENTER} marginY={SPACING_3}>
           <PrimaryBtn onClick={proceed} flex="1">
             {isHealthCheck ? CHECK_NOZZLE_Z_AXIS : SAVE_NOZZLE_Z_AXIS}

diff --git a/app/src/components/CalibrationPanels/MeasureTip.js b/app/src/components/CalibrationPanels/MeasureTip.js
@@ -208,13 +208,12 @@ export function MeasureTip(props: CalibrationPanelProps): React.Node {
             </Box>
           </Flex>
         </Box>
-        <div>
-          <JogControls
-            jog={jog}
-            stepSizes={[0.1, 1]}
-            planes={[VERTICAL_PLANE]}
-          />
-        </div>
+        <JogControls
+          jog={jog}
+          stepSizes={[0.1, 1]}
+          planes={[VERTICAL_PLANE]}
+          width="100%"
+        />
         <Flex width="100%" justifyContent={JUSTIFY_CENTER} marginY={SPACING_3}>
           <PrimaryBtn title="saveTipLengthButton" onClick={proceed} flex="1">
             {isHealthCheck ? CHECK_NOZZLE_Z_AXIS : SAVE_NOZZLE_Z_AXIS}