style: DOCTYPE tag, and related CSS cleanup/refactoring (#10302)

superset-frontend/src/explore/components/ExploreChartPanel.jsx

@@ -18,8 +18,8 @@
  */
 import React from 'react';
 import PropTypes from 'prop-types';
-import { Panel } from 'react-bootstrap';
 import { ParentSize } from '@vx/responsive';
+import styled from '@superset-ui/style';
 import { chartPropShape } from '../../dashboard/util/propShapes';
 import ChartContainer from '../../chart/ChartContainer';
 import ExploreChartHeader from './ExploreChartHeader';
@@ -49,6 +49,19 @@ const propTypes = {
   triggerRender: PropTypes.bool,
 };
 
+const Styles = styled.div`
+  background-color: ${({ theme }) => theme.colors.grayscale.light5};
+  padding: ${({ theme }) => theme.gridUnit * 4}px;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+  align-content: stretch;
+  div:last-of-type {
+    flex-basis: 100%;
+  }
+`;
+
 class ExploreChartPanel extends React.PureComponent {
   renderChart() {
     const { chart } = this.props;
@@ -113,13 +126,12 @@ class ExploreChartPanel extends React.PureComponent {
         chart={this.props.chart}
       />
     );
+
     return (
-      <div className="chart-container">
-        <Panel style={{ height: this.props.height }}>
-          <Panel.Heading>{header}</Panel.Heading>
-          <Panel.Body>{this.renderChart()}</Panel.Body>
-        </Panel>
-      </div>
+      <Styles className="chart-container">
+        <div>{header}</div>
+        <div>{this.renderChart()}</div>
+      </Styles>
     );
   }
 }