GitHub user search app solution

Community feedback

• 

  Vanza Setia•27,775

  @vanzasetiaPosted about 2 years ago

  Hi, Lorenzo Franco! 👋

  For the search input, I would recommend making it the main container of the search icon and the search button. So, instead of using form, I suggest making the input the main container. You can try using absolute positioning to position the search button inside the input. For the search icon, I would recommend making it the background image of the input. (Inspiration: my solution)

  Regarding your second question, I assume that it's about when the users select the value of the input, there's blue background color appears. If that's the case, then it's fine to have it. You can control the background color with using ::selection CSS pseudo-element. As a side note, never remove the ::selection background color. It exists so that the users know the current text that they are selecting.

  For your last question, you can use JavaScript to make the website listens to the user's color scheme preference. (Reference: https://web.dev/building-a-theme-switch-component/#synchronizing-with-the-system)

  window
      .matchMedia("(prefers-color-scheme: dark)")
      .addEventListener("change", ({ matches }) => {
        // do something with the "matches"
      });
  

  That's it! I hope you find this useful! 🙂

  0
• 

  Shashree Samuel•9,260

  @shashreesamuelPosted over 2 years ago

  Hey good job completing this challenge.

  Keep up the good work

  Your solution looks great however I think the placeholder in the search bar can be a bit bigger.

  In terms of your accessibility issues simply wrap all your content between main tags

  I hope this helps

  Cheers Happy coding

  0