Reorder panels

ChangeLog.md

@@ -3,6 +3,8 @@
   * Tidy up layout for module selection and lay everything out in a consistent best-to-worst for both class and grade
   * Make integrity for module reinforcement packages visible
   * Clean up breakpoints for modules in available modules list; stops 7- or 8- module long lines
+  * Add damager/range graphs to damage dealt
+  * Reorder panels
 
 #2.2.17
   * Use in-game terminology for shield generator optmul and optmass items

src/app/components/DamageDealt.jsx

@@ -483,7 +483,7 @@ export default class DamageDealt extends TranslatedComponent {
 
     return (
       <span>
-        <h1>{translate('damage dealt against')} {expanded ? <span onClick={onCollapseExpand}><CollapseSection className='summary'/></span> : <span onClick={onCollapseExpand}><ExpandSection className='summary'/></span>}</h1>
+        <h1>{translate('damage dealt to')} {expanded ? <span onClick={onCollapseExpand}><CollapseSection className='summary'/></span> : <span onClick={onCollapseExpand}><ExpandSection className='summary'/></span>}</h1>
         {expanded ?  <span>
         <ShipSelector initial={this.state.against} currentMenu={this.props.currentMenu} onChange={this._onShipChange} />
         <table className='summary' style={{ width: '100%' }}>
@@ -539,7 +539,7 @@ export default class DamageDealt extends TranslatedComponent {
           </tbody>
         </table>
         <div className='group half'>
-          <h1>{translate('damage against standard shields')}</h1>
+          <h1>{translate('sustained dps against standard shields')}</h1>
           <LineChart
             width={this.props.chartWidth}
             xMax={maxRange}
@@ -555,7 +555,7 @@ export default class DamageDealt extends TranslatedComponent {
           />
         </div>
         <div className='group half'>
-          <h1>{translate('damage against standard armour')}</h1>
+          <h1>{translate('sustained dps against standard armour')}</h1>
           <LineChart
             width={this.props.chartWidth}
             xMax={maxRange}

src/app/components/DamageReceived.jsx

@@ -278,7 +278,7 @@ export default class DamageReceived extends TranslatedComponent {
 
     return (
       <span>
-        <h1>{translate('damage received by')} {expanded ? <span onClick={onCollapseExpand}><CollapseSection className='summary'/></span> : <span onClick={onCollapseExpand}><ExpandSection className='summary'/></span>}</h1>
+        <h1>{translate('damage received from')} {expanded ? <span onClick={onCollapseExpand}><CollapseSection className='summary'/></span> : <span onClick={onCollapseExpand}><ExpandSection className='summary'/></span>}</h1>
 	{expanded ? <span>
         <table className='summary' style={{ width: '100%' }}>
           <thead>

src/app/i18n/en.js

@@ -99,8 +99,8 @@ export const terms = {
   // Items on the outfitting page
   // Notification of restricted slot
   emptyrestricted: 'empty (restricted)',
-  'damage dealt against': 'Damage dealt against',
-  'damage received by': 'Damage received by',
+  'damage dealt to': 'Damage dealt to',
+  'damage received from': 'Damage received from',
   'against shields': 'Against shields',
   'against hull': 'Against hull',
   // 'ammo' was overloaded for outfitting page and modul info, so changed to ammunition for outfitting page

src/app/pages/OutfittingPage.jsx

@@ -371,21 +371,20 @@ export default class OutfittingPage extends Page {
         <InternalSlotSection ship={ship} code={iStr} onChange={shipUpdated} currentMenu={menu} />
         <HardpointsSlotSection ship={ship} code={hStr || ''} onChange={shipUpdated} currentMenu={menu} />
         <UtilitySlotSection ship={ship} code={hStr || ''} onChange={shipUpdated} currentMenu={menu} />
-        <PowerManagement ship={ship} code={code || ''} onChange={shipUpdated} />
-        <CostSection ship={ship} buildName={buildName} code={code || ''} />
 
         <div className='group third'>
           <OffenceSummary ship={ship} code={code}/>
         </div>
-
         <div className='group third'>
           <DefenceSummary ship={ship} code={code}/>
         </div>
-
         <div className='group third'>
           <MovementSummary ship={ship} code={code}/>
         </div>
 
+        <PowerManagement ship={ship} code={code || ''} onChange={shipUpdated} />
+        <CostSection ship={ship} buildName={buildName} code={code || ''} />
+
         <div ref='chartHalf' className='group half' />
         <div className='group half' />