Added comment where to fix mobile screen issues

amosproj · Jun 29, 2021 · 5185530 · 5185530
1 parent acdb325
commit 5185530
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 5 deletions.
diff --git a/.vs/slnx.sqlite b/.vs/slnx.sqlite
diff --git a/frontend/src/components/details/MobileTableComponent.jsx b/frontend/src/components/details/MobileTableComponent.jsx
@@ -12,8 +12,8 @@ import PropTypes from 'prop-types';
  */
 class MobileTableComponent extends Component {
     state = {
-        headers: getImpactCategoriesTableHeaders(this.props.modelID),
-        rows: getImpactCategoriesTableData(this.props.modelID)
+        headers: getImpactCategoriesTableHeaders(),
+        rows: getImpactCategoriesTableData()
     };
     render() {
         const idKey = this.props.tableKey;

diff --git a/frontend/src/components/details/PieChartComponent.jsx b/frontend/src/components/details/PieChartComponent.jsx
@@ -44,15 +44,18 @@ const PieChartComponent = () => {
             {
                 breakpoint: 5600,
                 options: {
-                    chart: {},
+                    chart: {
+                        heigt: 'auto'
+                    },
                     legend: {
                         position: 'bottom'
                     }
                 }
             }
         ]
     };
-
+    //lassName='ChartItems' cause PieChart to overlap: needs to be fixed in charts_tables.css
+    // works fine if className is taken out
     return (
         <div className='ChartItems' id='chart'>
             <ReactApexChart options={options} series={series} type='donut' />

diff --git a/frontend/src/components/details/ScenarioComponent.js b/frontend/src/components/details/ScenarioComponent.js
@@ -53,6 +53,7 @@ class ScenarioComponent extends Component {
                             <PieChartComponent />
                         </Col>
                     </Row>
+                    <Row />
                     <Row>
                         <div className='TableContainer'>
                             {/* Swaps out the table with a mobile version for screens <= sm 
@@ -72,11 +73,17 @@ class ScenarioComponent extends Component {
                                 mdUp={this.props.loadComparePage ? false : true}
                                 xlUp={this.props.loadComparePage ? true : false}
                             >
-                                <MobileTableComponent
+                                {/* <MobileTableComponent
                                     productName={this.props.selectedProduct.productName}
                                     modelName={this.props.selectedProduct.modelName}
                                     modelID={this.props.selectedProduct.modelID}
                                     tableKey={this.props.scenarioName}
+                                /> */}
+                                <TableComponent
+                                    productName={this.props.selectedProduct.productName}
+                                    modelID={this.props.selectedProduct.modelID}
+                                    modelName={this.props.selectedProduct.modelName}
+                                    tableKey={this.props.scenarioName}
                                 />
                             </Hidden>
                         </div>