I am hoping this is a simple question. I am trying to resize a Component I imported.

Specifically, I would like to be able to set a height and width in CSS for this component. However, adding a className and targeting that class in CSS or trying to style the parent div does absolutely nothing to the Component.

The component I am referring to is: <DarkModeToggle/> There is a size={} property available on the Component, but it only accepts a single value, I'd like the ability to use Media Queries in CSS instead.

I got the npm package from here.

import React from 'react';
import {DarkModeToggle} from 'react-dark-mode-toggle-2';
import '../style.css';

function App() {
  const [isDarkMode, setIsDarkMode] = React.useState(false);
  return (
    <nav className="navbar">
      <div className="nav-flex">
        <div className="brand">devfinder</div>
        <div className="light-toggle">
          <DarkModeToggle
            onChange={setIsDarkMode}
            isDarkMode={isDarkMode}
            size={80}
          />
        </div>
      </div>
    </nav>
  );
}

export default App;

You can see the problem I am having in this image.

Thank you guys!