summaryrefslogtreecommitdiff
path: root/frontend/src/components/app/sidebars/simulation/LoadMetricComponent.js
diff options
context:
space:
mode:
Diffstat (limited to 'frontend/src/components/app/sidebars/simulation/LoadMetricComponent.js')
-rw-r--r--frontend/src/components/app/sidebars/simulation/LoadMetricComponent.js61
1 files changed, 28 insertions, 33 deletions
diff --git a/frontend/src/components/app/sidebars/simulation/LoadMetricComponent.js b/frontend/src/components/app/sidebars/simulation/LoadMetricComponent.js
index 3e4cf810..6ee6a3b9 100644
--- a/frontend/src/components/app/sidebars/simulation/LoadMetricComponent.js
+++ b/frontend/src/components/app/sidebars/simulation/LoadMetricComponent.js
@@ -1,40 +1,35 @@
-import React from "react";
-import {
- SIM_HIGH_COLOR,
- SIM_LOW_COLOR,
- SIM_MID_HIGH_COLOR,
- SIM_MID_LOW_COLOR
-} from "../../../../util/colors";
-import { LOAD_NAME_MAP } from "../../../../util/simulation-load";
+import React from 'react'
+import { SIM_HIGH_COLOR, SIM_LOW_COLOR, SIM_MID_HIGH_COLOR, SIM_MID_LOW_COLOR } from '../../../../util/colors'
+import { LOAD_NAME_MAP } from '../../../../util/simulation-load'
const LoadMetricComponent = ({ loadMetric }) => (
- <div>
<div>
- Colors represent <strong>{LOAD_NAME_MAP[loadMetric]}</strong>
- </div>
- <div className="btn-group mb-2" style={{ display: "flex" }}>
- <span
- className="btn btn-secondary"
- style={{ backgroundColor: SIM_LOW_COLOR, flex: 1 }}
- title="0-25%"
- />
- <span
- className="btn btn-secondary"
- style={{ backgroundColor: SIM_MID_LOW_COLOR, flex: 1 }}
- title="25-50%"
- />
- <span
- className="btn btn-secondary"
- style={{ backgroundColor: SIM_MID_HIGH_COLOR, flex: 1 }}
- title="50-75%"
- />
+ <div>
+ Colors represent <strong>{LOAD_NAME_MAP[loadMetric]}</strong>
+ </div>
+ <div className="btn-group mb-2" style={{ display: 'flex' }}>
<span
- className="btn btn-secondary"
- style={{ backgroundColor: SIM_HIGH_COLOR, flex: 1 }}
- title="75-100%"
+ className="btn btn-secondary"
+ style={{ backgroundColor: SIM_LOW_COLOR, flex: 1 }}
+ title="0-25%"
/>
+ <span
+ className="btn btn-secondary"
+ style={{ backgroundColor: SIM_MID_LOW_COLOR, flex: 1 }}
+ title="25-50%"
+ />
+ <span
+ className="btn btn-secondary"
+ style={{ backgroundColor: SIM_MID_HIGH_COLOR, flex: 1 }}
+ title="50-75%"
+ />
+ <span
+ className="btn btn-secondary"
+ style={{ backgroundColor: SIM_HIGH_COLOR, flex: 1 }}
+ title="75-100%"
+ />
+ </div>
</div>
- </div>
-);
+)
-export default LoadMetricComponent;
+export default LoadMetricComponent