need help using certain type of styling with react

Question

I'm using React and trying to add a slider on my page from a Github account I found. I cant figure out how to add the css because its in js form??? I have added webpack and even a npm compiler but it still doesn't recognize the type of styling used. Any ideas?

    .slider {
position: relative;
width: 100%;
height: 400px;
overflow: hidden;
& a {
    &.previousButton,
    &.nextButton {
        font-size: 22px;
        line-height: 0;
        display: block;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        transition: all .3s linear;
        z-index: 1;
        color: #333;
        padding: 10px;
        text-decoration: none;
        backface-visibility: hidden;
        /* prevent jump effect when scaling */
        &:not(.disabled):hover {
            transform: translateY(-50%) scale(1.25);
            cursor: pointer;
        }
    }
    &.previousButton

Answer 1

Rather than using “class” or “className”, apply it to your element with style={ theNameOfTheStyleObject}.

For inline js styles, use style={{ }} (not class).

The main difference in syntax is that you'll replace hyphenated rules with the camelCase equivalent (use borderRadius instead of border-radius), numeric values with qualifiers (10px) need to be quoted. Also, the js style is an object, so replace the semicolon with a comma.

I've probably forgotten something so apologies in advance.

Hopefully the first paragraph answered the actual question.