added images for piechart and barchart

csce378Project/src/features/myRed/audit.js

@@ -2,6 +2,8 @@
 import React, { PureComponent } from 'react';
 import { useSelector, useDispatch } from 'react-redux';
 import PropTypes from 'prop-types';
+import piechart from './prototype/piechart.png';
+import barchart from './prototype/barchart.png';
 
 import classNames from 'classnames';
 import styles from './audit.module.css';
@@ -177,7 +179,8 @@ SpecificCreditInfo.propTypes = {
 function ShowCreditDetails(props){
   return (
     <div className={styles.detailBox}>
-
+      <img src={piechart} alt="piechart showing credits remaining" className={styles.image} />
+      <img src={barchart} alt="barchart showing credits remaining" className={styles.image} />
     </div>
   );
 }

csce378Project/src/features/myRed/audit.module.css

@@ -76,4 +76,12 @@
   background-color: rgb(255 255 255);
   font-size: 3em;
   min-height: 2em;
+  display: flex;
+  justify-content: center;
+}
+
+.image {
+  max-height: 6.5em;
+  justify-content: center;
+  padding: 0.5em;
 }