Fixes for broken EDEngineer button, plus styling changes to improve the modal popup for exporting builds. (#24)

src/app/components/ModalShoppingList.jsx

@@ -355,8 +355,8 @@ export default class ModalShoppingList extends TranslatedComponent {
     this.sendToEDEng = this.sendToEDEng.bind(this);
     this.sendToEDOMH = this.sendToEDOMH.bind(this);
     return <div className='modal' onClick={ (e) => e.stopPropagation() }>
-      <h2>{translate('PHRASE_SHOPPING_MATS')}</h2>
+      <h3>{translate('PHRASE_SHOPPING_MATS')}</h3>
-      <p>{translate('PHRASE_DIFFERENT_ROLLS')}</p>
+
       {/* <label>{translate('Grade 1 rolls ')}</label>
       <input id={1} type={'number'} min={0} defaultValue={this.state.matsPerGrade[1]} onChange={this.changeHandler} />
       <br/>
@@ -373,22 +373,28 @@ export default class ModalShoppingList extends TranslatedComponent {
       <input id={5} type={'number'} min={0} value={this.state.matsPerGrade[5]} onChange={this.changeHandler} /> */}
       <div>
         <textarea className='cb json' readOnly value={this.state.matsList} />
+        <p>{translate('PHRASE_DIFFERENT_ROLLS')}</p>
       </div>
-      <p hidden={compatible} id={'browserbad'} className={'l'}>{translate('PHRASE_FIREFOX_EDENGINEER')}</p>
+
-      <p hidden={!this.state.failed} id={'failed'} className={'l'}>{translate('PHRASE_FAILED_TO_FIND_EDENGINEER')}</p>
       <div id='edengineer' display={this.display} hidden={!!this.state.failed && !compatible}>
-        <label hidden={!compatible || !!this.state.failed} className={'l cap'}>{translate('CMDR Name')}</label>
+      <hr />
-        <br/>
+        <h3>ED Engineer</h3>
-        <select hidden={!compatible || !!this.state.failed} className={'cmdr-select l cap'} onChange={this.cmdrChangeHandler} defaultValue={this.state.cmdrName}>
+        <h4 hidden={compatible} id={'browserbad'} className={'l'}>{translate('PHRASE_FIREFOX_EDENGINEER')}</h4>
+        <h4 hidden={!this.state.failed} id={'failed'} className={'l'}>{translate('PHRASE_FAILED_TO_FIND_EDENGINEER')}</h4>
+        <label for='cmdr-select' hidden={!!this.state.failed || !compatible} className={'l cap'}>{translate('CMDR Name:')}</label>
+        <select id='cmdr-select' hidden={!!this.state.failed || !compatible} className={'cmdr-select l cap'} onChange={this.cmdrChangeHandler} defaultValue={this.state.cmdrName}>
           {this.state.cmdrs.map(e => <option key={e}>{e}</option>)}
         </select>
         <br/>
-          <button className={'l cb dismiss cap'} hidden={!this.state.failed} disabled={!!this.state.failed || !compatible} onClick={this.sendToEDEng}>{translate('Send to EDEngineer')}</button>
+          <button className={'l cb dismiss cap'} disabled={!!this.state.failed || !compatible} onClick={this.sendToEDEng}>{translate('Send to EDEngineer')}</button>
       </div>
       <div id='edomh'>
+      <hr />
+        <h3>ED Odyssey Materials Helper</h3>
         <p>{translate('PHRASE_ENSURE_EDOMH')}</p>
         <button style={{marginTop: 5}} className={'l cb dismiss cap'} onClick={this.sendToEDOMH}>{translate('Send to EDOMH')}</button>
       </div>
+      <hr />
 
       <button className={'r dismiss cap'} onClick={this.context.hideModal}>{translate('close')}</button>
     </div>;

src/app/i18n/en.json

@@ -82,7 +82,6 @@
     "TT_SUMMARY_UNLADEN_TOTAL_JUMP": "Farthest possible range with no cargo, a full fuel tank, and jumping as far as possible each time",
     "TT_SUMMARY_LADEN_TOTAL_JUMP": "Farthest possible range with full cargo, a full fuel tank, and jumping as far as possible each time",
     "HELP_MODIFICATIONS_MENU": "Click on a number to enter a new value, or drag along the bar for small changes",
-    "PHRASE_FAIL_EDENGINEER": "Failed to send to EDEngineer (Launch EDEngineer and make sure the API is started then refresh the page.)",
     "PHRASE_ENSURE_EDOMH": "Ensure EDO Material Helper is installed and registered to handle edomh:// urls, else this button will do nothing!",
     "PHRASE_FIREFOX_EDENGINEER": "Sending to EDEngineer is not compatible with Firefox's security settings. Please try again with Chrome.",
     "PHRASE_FAILED_TO_FIND_EDENGINEER": "Failed to find ED Engineer API. Please ensure it is running and try again.",

src/less/modal.less

@@ -42,13 +42,41 @@
     margin: 0;
   }
 
+  h4 {
+    text-transform: uppercase;
+    font-family: @fStandard;
+    font-weight: normal;
+    font-size: 1em;
+    margin: 1em;
+    color: @warning;
+  }
+
   p {
     clear: left;
-    padding: 30, 0, 0, 0;
+    padding: 30, 0, 10, 0;
   }
 
   button {
-    margin: 100px, 0;
+    clear: bottom;
+    margin: 10px;
+  }
+
+  hr {
+    clear: both;
+    margin: 15px, 10px, 15px, 10px;
+    padding: top, 5;
+  }
+
+  select {
+    clear: bottom;
+    margin: 10px;
+    width: 50%;
+  }
+
+  label {
+    clear: bottom;
+    margin: 20px;
+    color: @primary;
   }
 }
 
@@ -64,7 +92,7 @@ textarea {
     min-height: 10em;
     resize: vertical;
     user-select: text;
-    margin:2em 0;
+    margin:1em 0;
   }
 }