Change arm movement buttons based on figma model

equinor · Apr 10, 2024 · f194cf6 · f194cf6
1 parent abf7bbf
commit f194cf6
Show file tree

Hide file tree

Showing 4 changed files with 16 additions and 13 deletions.
diff --git a/frontend/src/components/Pages/RobotPage/RobotArmMovement.tsx b/frontend/src/components/Pages/RobotPage/RobotArmMovement.tsx
@@ -24,6 +24,8 @@ const LimitWidthStyle = styled.div`
 
 const StyledTextButton = styled(StyledButton)`
     text-align: left;
+    padding: 8px;
+    width: 8rem;
 `
 
 export const MoveRobotArm = ({ robot, armPosition, isRobotAvailable }: RobotProps) => {
@@ -89,7 +91,7 @@ export const MoveRobotArm = ({ robot, armPosition, isRobotAvailable }: RobotProp
                 onClick={!usable ? openPopover : onClickMoveArm}
                 ref={anchorRef}
             >
-                {TranslateText('Set robot arm to ') + '"' + TranslateText(armPosition) + '"'}
+                {TranslateText(armPosition)}
             </StyledTextButton>
             <StyledDialog open={feedback !== ''}>
                 {feedback}

diff --git a/frontend/src/components/Pages/RobotPage/RobotPage.tsx b/frontend/src/components/Pages/RobotPage/RobotPage.tsx
@@ -22,7 +22,7 @@ const StyledRobotPage = styled.div`
     gap: 1rem;
     margin: 2rem;
 `
-const StyledButtons = styled.div`
+const RobotArmMovementSection = styled.div`
     display: flex;
     flex-direction: row;
     gap: 1rem;
@@ -32,6 +32,9 @@ const RobotInfo = styled.div`
     align-items: start;
     gap: 1rem;
     width: calc(80vw);
+    @media (max-width: 800px) {
+        flex-direction: column;
+    }
 `
 const VerticalContent = styled.div<{ $alignItems?: string }>`
     display: flex;
@@ -100,8 +103,8 @@ export const RobotPage = () => {
 
                         {selectedRobot.model.type === RobotType.TaurobInspector && (
                             <>
-                                <Typography variant="h2">{TranslateText('Move robot arm')}</Typography>
-                                <StyledButtons>
+                                <Typography variant="h4">{TranslateText('Set robot arm to ')}</Typography>
+                                <RobotArmMovementSection>
                                     <MoveRobotArm
                                         robot={selectedRobot}
                                         armPosition="battery_change"
@@ -117,7 +120,7 @@ export const RobotPage = () => {
                                         armPosition="lookout"
                                         isRobotAvailable={selectedRobot.status === RobotStatus.Available}
                                     />
-                                </StyledButtons>
+                                </RobotArmMovementSection>
                             </>
                         )}
                     </>

diff --git a/frontend/src/language/en.json b/frontend/src/language/en.json
@@ -73,7 +73,6 @@
     "Moving arm to ": "Moving arm to ",
     " Error message: ": " Error message: ",
     "Error moving robot arm to ": "Error moving robot arm to ",
-    "Move robot arm": "Move robot arm",
     "Click on the map to move the localization position": "Click on the map to move the localization position",
     "Select direction": "Select direction",
     "North": "North",
@@ -156,9 +155,9 @@
     "Days between inspections": "Days between inspections",
     "Confirm installation": "Confirm installation",
     "N": "N",
-    "battery_change": "battery change",
-    "lookout": "lookout",
-    "transport": "transport",
+    "battery_change": "Battery change",
+    "lookout": "Lookout",
+    "transport": "Transport",
     "Queue the missions": "Queue the missions",
     "Deck Overview": "Deck Overview",
     "Predefined Missions": "Predefined Missions",

diff --git a/frontend/src/language/no.json b/frontend/src/language/no.json
@@ -73,7 +73,6 @@
     "Moving arm to ": "Flytter armen til ",
     " Error message: ": " Feilmelding: ",
     "Error moving robot arm to ": "Feil med å flytte robotarm til ",
-    "Move robot arm": "Flytt robotarm",
     "Click on the map to move the localization position": "Klikk på kartet for å flytte lokaliseringspunktet",
     "Select direction": "Velg retning",
     "North": "Nord",
@@ -156,9 +155,9 @@
     "Days between inspections": "Dager mellom inspeksjoner",
     "Confirm installation": "Bekreft anlegg",
     "N": "N",
-    "battery_change": "batteribytte",
-    "lookout": "utkikk",
-    "transport": "transport",
+    "battery_change": "Batteribytte",
+    "lookout": "Hevet posisjon",
+    "transport": "Transport",
     "Queue the missions": "Legg oppdragene i kø",
     "Deck Overview": "Dekkoversikt",
     "Predefined Missions": "Forhåndsdefinerte oppdrag",