README

This is a React Hook that helps make various CSS styles responsive by setting current styles specific to the screen width.

Usage

const Container: FC = ({ children }) => {
  const styles = useResponsiveStyles({
    margin: {
      sm: "10px",
      md: "20px",
      lg: "30px",
      xl: "40px",
    },
    backgroundColor: {
      sm: "black",
      md: "blue",
    },
  });

  return (
    <div className="container" style={styles}>
      {children}
    </div>
  );
};