From 4404a989a3fd9fea2f161cc65cd58efdc2f0d54b Mon Sep 17 00:00:00 2001
From: ArndalAndersen <Car:28359248>
Date: Wed, 1 May 2019 13:01:07 +0200
Subject: [PATCH] ENH: Styling of modals served via the frontend-build.

---
 CHANGES.md                  |  1 +
 EXECUTABLE.md               |  2 +-
 pyqmix_frontend/src/App.css |  4 ++--
 pyqmix_frontend/src/App.js  | 20 +++++++++++---------
 4 files changed, 15 insertions(+), 12 deletions(-)

diff --git a/CHANGES.md b/CHANGES.md
index 5e9cfa9..fb8eeda 100644
--- a/CHANGES.md
+++ b/CHANGES.md
@@ -7,6 +7,7 @@
   open the browser
 - Add versioneer
 - Enable user to specify pump configuration directory
+- Styling of frontend served via the build
 - Update to `react-scripts` 2.1.3
 
 2018.11.07
diff --git a/EXECUTABLE.md b/EXECUTABLE.md
index ebe7059..28ee260 100644
--- a/EXECUTABLE.md
+++ b/EXECUTABLE.md
@@ -44,4 +44,4 @@ This will create a run.spec file in the backend directory.
 3. Activate the virtual environment
 4. Type: `pyinstaller --clean run.spec`
 
-This generates a `run.exe` file inside the backend's `dist` folder. 
+This generates a `.exe` file inside the backend's `dist` folder. 
diff --git a/pyqmix_frontend/src/App.css b/pyqmix_frontend/src/App.css
index 3f2d170..9988ff4 100644
--- a/pyqmix_frontend/src/App.css
+++ b/pyqmix_frontend/src/App.css
@@ -70,8 +70,8 @@ body {
     }
 }
 
-.text-modal {
-    white-space: pre-line;
+.modal-input {
+    text-align: left;
 }
 
 .form-control {
diff --git a/pyqmix_frontend/src/App.js b/pyqmix_frontend/src/App.js
index 228738b..9a0e203 100644
--- a/pyqmix_frontend/src/App.js
+++ b/pyqmix_frontend/src/App.js
@@ -730,7 +730,7 @@ class PumpForm extends Component {
           </Button>
 
           <Modal isOpen={this.state.modal['locateConfigFiles']}
-                 className={this.props.className}>
+                 className="modal-input">
             <ModalHeader>Select a pump configuration</ModalHeader>
             {/*<ModalBody></ModalBody>*/}
             <ModalHeader>
@@ -809,7 +809,7 @@ class PumpForm extends Component {
           </Modal>
 
           <Modal isOpen={this.state.modal['noConfigOrDllFound']}
-                 className={this.props.className}>
+                 className="modal-input">
             <ModalHeader >Error - no pumps were detected.</ModalHeader>
             <ModalBody>
               Ensure that:
@@ -860,7 +860,8 @@ class PumpForm extends Component {
                           disabled={this.state.selectedPumps.length === 0}
                   > Reference Move </Button>
                   <FormText>Calibrate the selected pumps.</FormText>
-                  <Modal isOpen={this.state.modal['referenceMove']} className={this.props.className}>
+                  <Modal isOpen={this.state.modal['referenceMove']}
+                         className="modal-input">
                     <ModalHeader >Reference Move</ModalHeader>
                     <ModalBody>
                       Detach all syringes from the pumps before continuing.
@@ -894,7 +895,8 @@ class PumpForm extends Component {
                   > Fill Cycle </Button>
                   <FormText>Fill & empty the syringe multiple times. Ends with a filled syringe.</FormText>
 
-                  <Modal isOpen={this.state.modal['fill']} className={this.props.className}>
+                  <Modal isOpen={this.state.modal['fill']}
+                         className="modal-input">
                     <ModalHeader>Fill</ModalHeader>
                     <ModalBody>
                       Insert the inlet tube into the stimulus reservoir and
@@ -971,7 +973,7 @@ class PumpForm extends Component {
                   <FormText>Empty & fill the syringe multiple times. Ends with an empty syringe.</FormText>
 
                   <Modal isOpen={this.state.modal['empty']}
-                         className={this.props.className}>
+                         className="modal-input">
                     <ModalHeader>Empty</ModalHeader>
                     <ModalBody>
                       Remove the inlet tube from the stimulus reservoir and
@@ -1045,7 +1047,7 @@ class PumpForm extends Component {
                   > Bubble Cycle </Button>
                   <FormText>Guided procedure to remove air bubbles trapped in the syringe. Ends with a filled syringe.</FormText>
                   <Modal isOpen={this.state.modal['bubbleCycleStart']}
-                         className={this.props.className}>
+                         className="modal-input">
                     <ModalHeader>Bubble Cycle</ModalHeader>
                     <ModalBody>
                       Insert the inlet tube into the stimulus reservoir.
@@ -1060,7 +1062,7 @@ class PumpForm extends Component {
                     </ModalFooter>
                   </Modal>
                   <Modal isOpen={this.state.modal['bubbleCycleMiddle']}
-                         className={this.props.className}>
+                         className="modal-input">
                     <ModalHeader>Bubble Cycle</ModalHeader>
                     <ModalBody>
                       Remove the inlet tube from the stimulus reservoir to aspirate air.
@@ -1077,7 +1079,7 @@ class PumpForm extends Component {
                     </ModalFooter>
                   </Modal>
                   <Modal isOpen={this.state.modal['bubbleCycleEnd']}
-                         className={this.props.className}>
+                         className="modal-input">
                     <ModalHeader>Bubble Cycle</ModalHeader>
                     <ModalBody>
                       Insert the inlet tube into the stimulus reservoir.
@@ -1140,7 +1142,7 @@ class PumpForm extends Component {
                   > Rinse Cycle </Button>
                   <FormText>Empty & fill the syringe multiple times. Ends with an empty syringe.</FormText>
                   <Modal isOpen={this.state.modal['rinse']}
-                         className={this.props.className}>
+                         className="modal-input">
                     <ModalHeader>Rinse</ModalHeader>
                     <ModalBody>
                       Insert the inlet tube into the rinsing fluid