Mortgage Calculator App react & react-hook-form & yup

Community feedback

• 

  MaelkMark•150

  @MaelkMarkPosted 3 months ago

  The radio buttons don't get skipped, you just can't see the outline because you've set their outline to transparent. If you remove that declaration, the styling won't change and you'll see the outline on focus. Or if you want the whole label to have a focus, keep the outline style for the input and declare a new rule: label:has(input[type="radio"]):focus and put the focus styling there.

  (Also, you can toggle between the two radio buttons by pressing the up/down arrow keys)

  Anyway, nice solution :)

  Marked as helpful

  1

  ---

  

  Zeynab Movasaqpoor•420

  @zeynabmvsPosted 3 months ago

  @MaelkMark Hi, Thanks a lot I fixed it, I'm using tailwind for styling, so I added these classes to label to make the whole label focused instead of just the radio: "focus-within:outline focus-within:outline-2 focus-within:outline-slate-700"

  1
• 

  Amjad Shadid•790

  @amjadsh97Posted 3 months ago

  @zeynabmvs Very good Job! 👏

  1