Create Custom Radio Button and Checkbox CSS Styles for Focus and Disabled States

In the last two lessons, we set up the initial state styles for radio buttons and checkboxes. Now we'll add styles for the focus and disabled states using our existing Sass mixins. We'll do this by layering box-shadow effects of a white border and blurred primary color.

We'll also learn about an up and coming pseudo selector - :focus-within - that will be used to apply styles to the label of a control in a :focus state.