sidebar contrast bug fixed, landing page started

1 files changed, 4 insertions, 4 deletions

diff --git a/react-frontend/src/components/Modal.js b/react-frontend/src/components/Modal.js
index 3ce5d39..ad69650 100644
--- a/react-frontend/src/components/Modal.js
+++ b/react-frontend/src/components/Modal.js
@@ -32,21 +32,21 @@ function Modal() {
     <div>
     <div id="main-modal"className="modal" style={{display : 'block'}}>
       {(count == 0) && <p className="m modal0">
-        <p className="align-center"><span>Welcome to WatchDogs!</span></p> 
+        <p className="align-center"><span className="span">Welcome to WatchDogs!</span></p> 
         <p className="align-center">Click start for an introduction to the WatchDogs interface.</p>
         <p className="align-center"><button className="next" onClick={nextModal1}>Start</button></p>
         <p className="align-center"><button className="skip" onClick={exitModal}>Skip</button></p>
         </p>}
       {(count == 1) && <p className="m modal1">
         <p className="align-right"><i class="arrow right"></i></p>
-        <span>This is the suspicion ranking pane,</span> which displays 
+        <span className="span">This is the suspicion ranking pane,</span> which displays 
         high-profile traders and the suspicion score our algorithm assigned 
         to them. The higher an individual is ranked, the more likely they are involved in insider trading.
         <p className="align-center"><button className="next" onClick={nextModal2}>Next</button></p>
       </p>}
       {(count == 2) && <p className="m modal2">
         <p></p>
-        <span>The Timeframe pane </span> 
+        <span className="span">The Timeframe pane </span> 
         allows you to chose the timespan you'd like to see trade data from. Individuals' suspicion score will
         be calculated based on the trades that occured during the timeframe you select. 
         <p className="align-center"><button className="next" onClick={nextModal3}>Next</button></p>
@@ -54,7 +54,7 @@ function Modal() {
       </p>}
       {count == 3 && <p className="m modal3">
         <p className="align-left"><i class="arrow left"></i></p>
-        <span>The Trader Graph </span> 
+        <span className="span">The Trader Graph </span> 
         shows how traders are related. Click on a name in the graph to see more information about that individual. 
         <p className="align-center"><button className="next" onClick={nextModal4}>Next</button></p>
       </p>}