Skip to content
OverviewSolutions
0
Comments
2
Tobias Fuchs
@ToFu96

All comments

  • Austin•330
    @waustin45Submitted about 2 years ago

    Had fun with this project. JS is getting a bit easier to work with. I am getting better at troubleshooting and researching for answers through google. The only problem was styling the checkboxes and slider bar. I could not figure out how to make them green. So, if you have any input I would greatly appreciate it!

    Used React and CSS to complete project

    3
    Tobias Fuchs•40
    @ToFu96Posted about 2 years ago

    What you can consider using is "accent-color". It doesn't really solve the problem when it comes to custom designs, but it is a quick hack to adjust the colors to the other content.

    .your_css_selector {
    accent-color: hsl(127deg, 100%, 82%);
}

    That looks good enough for this project.

    Cheers!

    PS: Your copy to clipboard doesn't work for me, so I guess you didn't implement it? Also, if you want an additional (JS) challenge, you can try to come up with your own "forumla"/algorithm to compute password safety. For that you probably should research a bit what makes a password secure. In my case, all my passwords with a length of 8 are considered insecure because they are easy to crack via brute force attacks. I increased my max. length of passwords to 30 and so I obviously consider all passwords of that lengths secure, even if the password only uses numbers. (I used word-break: break-all to break it to the next line for long passwords.)

    If you want to go a step further you could even try to let the user decide which special characters they allow in the generation - I'm probably going to attempt that myself pretty soon. My idea is that a popup or something similar opens and the user can select which special characters they want to be used during password generation.

    I also noticed that your algorithm always uses lowercase characters to create the password, even when not selected. That's something that should be changed. If no options are selected, I guess it's fine to assume lowercase characters as a default setting.

    Marked as helpful
    1
  • Tobias Fuchs•40
    @ToFu96Posted over 2 years ago

    Hey, I recently did this challenge too and at first glance your solution seems very good to me. I like how you implemented the JavaScript. I'll try to remember some of your tricks, because they are cleaner than what my JavaScript code looks like (I didn't publish my code).

    Some comments (note that some are a bit nitpicky):

    • I might be wrong, but I think the submit button should change on hover. Otherwise the button doesn't feel as clickable.
    • Maybe consider renaming some classes. For example, "number" doesn't say much outside of context. This isn't a problem in a small project, but in bigger ones it increases the time to understand the code, especially for someone who never saw it before. Maybe something like "rating-button" is more describing? If you rename, make sure it's renamed in the JavaScript file as well.
    • You may want to read a bit about "px", "em" and "rem". From my understanding, setting font-size via pixels is bad practice regarding accessibility. For example, if someone (with bad eyesight) increases their browser's font size, text whose size was set via pixels won't be affected by that. I wouldn't get too worried about all this right now, but it's definitely worth researching what "em" and "rem" do and when they should be used.
    • If you are up for an additional challenge, try to change the submit button in a way that it only becomes clickable once you selected a rating option. Otherwise, make it unclickable and with lower opacity. You could create a new git branch to implement that feature and (if you are happy with your implementation) merge it with your main branch once you are done.

    That's all I have to say. Cheers!

    Marked as helpful
    1