Skip to content
OverviewSolutions
11
Comments
2
John Schlesinger
@Jschles1

All comments

  • John Schlesinger•280
    @Jschles1Posted about 1 year ago

    Hey Kiran,

    Great job completing this challenge. The only thing that sticks out to me is that the font size is set in px. Ideally we should be setting the font size using rem for accessibility reasons.

    See more here

    Marked as helpful
    1
  • John Schlesinger•280
    @Jschles1Submitted over 1 year ago

    I'm unsure if there is a more optimal way to implement the SVG images. On previous challenges I utilized Next.js' next/image package to implement SVG images as recommended per their documentation. However, due to the SVGs needing to change the fill color based on hover or focus state, I was unable to utilize that package. Instead, I resorted to putting the SVG tags directly inside the JSX and added the hover and focus styles directly via CSS.

    Password Generator w/ Next.js 13 & TailwindCSS

    1
    John Schlesinger•280
    @Jschles1Posted over 1 year ago

    Some additional notes to add:

    • Made "Generate" button disabled if both uppercase and lowercase checkboxes are unchecked. Didn't make much sense to allow the user to generate a password without either of those options selected. I'm assuming a strong password is impossible to generate using only numbers and symbols.
    • Made the character length slider min value 8, and the max value 20.
    • Had to change some padding/height values provided by the figma design to more closely match the official design.
    0