Material-UI how to change label style on click on text field (JSS)?

Question

JavaScript

There is a component with textfield.

const TextFieldd = () => {
  const classes = useStyles();
  return (
    <form className={classes.root} noValidate autoComplete="off">
      <TextField id="outlined-basic" label="Some Label" variant="outlined" />
    </form>
  );
};

when you click on it, the label from the input field goes to the side, and at this moment you need to change its style so that the label text becomes bold. How to register it in override?

MuiInputLabel: {
    root: {
      fontWeight: '300',
    },
  },

Answer 1

Customized Inputs