Minor changes to case builder

relog-web/src/PipelineBlock.js

@@ -169,13 +169,13 @@ const PipelineBlock = (props) => {
             onConnect={onConnect}
             onElementsRemove={onElementsRemove}
             deleteKeyCode={46}
-            maxZoom={3}
+            maxZoom={1.25}
             minZoom={0.5}
             snapToGrid={true}
             preventScrolling={false}
           >
             <Background />
-            <Controls />
+            <Controls showInteractive={false} />
           </ReactFlow>
         </div>
         <div style={{ textAlign: "center" }}>
@@ -185,11 +185,11 @@ const PipelineBlock = (props) => {
             onClick={props.onAddProduct}
           />
           <Button label="Add plant" kind="inline" onClick={props.onAddPlant} />
-          <Button label="Auto-Layout" kind="inline" onClick={onLayout} />
+          <Button label="Auto Layout" kind="inline" onClick={onLayout} />
           <Button
             label="?"
             kind="inline"
-            tooltip="Drag from one connector to another to create links between products and plants. Double click to rename an element. Press [Delete] to remove an element."
+            tooltip="Drag from one connector to another to create links between products and plants. Double click to rename an element. Click an element to select and move it. Press the [Delete] key to remove it."
           />
         </div>
       </Card>

relog-web/src/PipelineBlock.module.css

@@ -1,5 +1,5 @@
 .PipelineBlock {
-  height: 600px !important;
+  height: 800px !important;
   border: 1px solid rgba(0, 0, 0, 0.1) !important;
   border-radius: var(--border-radius) !important;
   margin-bottom: 12px !important;

relog-web/src/PlantBlock.js

@@ -219,6 +219,7 @@ const PlantBlock = (props) => {
             tooltip="The cost to store a tonne of input product for one time period."
             value={props.value["storage"]["cost ($/tonne)"]}
             onChange={(v) => onChange(v, "storage", "cost ($/tonne)")}
+            validate="float"
           />
           <TextInputRow
             label="Storage limit"
@@ -226,6 +227,7 @@ const PlantBlock = (props) => {
             tooltip="The maximum amount of input product this plant can have in storage at any given time."
             value={props.value["storage"]["limit (tonne)"]}
             onChange={(v) => onChange(v, "storage", "limit (tonne)")}
+            validate="float"
           />
 
           <h1>Disposal</h1>
@@ -236,6 +238,7 @@ const PlantBlock = (props) => {
             value={props.value["disposal cost ($/tonne)"]}
             onChange={(v) => onChange(v, "disposal cost ($/tonne)")}
             disableKeys={true}
+            validate="float"
           />
           <DictInputRow
             label="Disposal limit"
@@ -245,6 +248,7 @@ const PlantBlock = (props) => {
             onChange={(v) => onChange(v, "disposal limit (tonne)")}
             disableKeys={true}
             valuePlaceholder="Unlimited"
+            validate="float"
           />
 
           <h1>Emissions</h1>
@@ -256,6 +260,7 @@ const PlantBlock = (props) => {
             onChange={(v) => onChange(v, "emissions (tonne/tonne)")}
             keyPlaceholder="Emission name"
             valuePlaceholder="0"
+            validate="float"
           />
         </Form>
       </Card>