CSS backgrounds in react - css

Question

so i'm in the process of learning react and to do so i'm trying to convert my personal webpage to use it.. But i've hit a wall. Before I had a background image on my home page that took up 100% width and 80% height. But when I try to do that in react it's not showing my image. Here is my code.
body,h1,h2,h3,h4,h5,h6 {font-family: "Lato", sans-serif;}
body, html {
height: 100%;
color: #777;
line-height: 1.8;
margin: 0;
}
/* Create a Parallax Effect */
.bgimg-1, .bgimg-2, .bgimg-3 {
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.bgimg-1 {
background-image: url('../images/haha.jpg');
min-height: 80%;
}
#homeTest {
white-space:nowrap;
}
and on the react side i'm just doing:
import React from 'react';
import ReactDOM from 'react-dom';
import './css/w3.css';
import './css/landing.css'
class Landing extends React.Component {
render() {
return (
<div className="bgimg-1" id="home">
<div id="homeText">
<h1>David Dennis <small>Im here to create meaningful and lasting software</small>
<a href="https://www.youtube.com/channel/UCun833t1bRiYlpoRAkg0S1g?view_as=subscriber">
<button class="btn draw-border" >Subscribe on YouTube</button></a></h1>
</div>
</div>
);
}
}