Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Job listings solution using tailwindcss and vanilla JavaScript

Sagar Kaurav• 460

@sagarkaurav

Desktop design screenshot for the Job listings with filtering coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
3intermediate
View challenge

Design comparison


SolutionDesign

Solution retrospective


Feedback appreciated

Community feedback

Connor Z• 5,115

@zuolizhu

Posted

Hey Sagar,

Nice usage of tailwindcss! I'm also a big fan of tailwind 😆.

I don't know if I miss-understood how the filter should work, I thought the more tags you clicked, the less results should be listed, isn't it 🤔? (e.g. if I clicked python and react tag, it should lists the jobs with both python and react tags)

The tags in the search-bar has no reaction when I clicked. But it works sometimes 👀.

2

Sagar Kaurav• 460

@sagarkaurav

Posted

Hi, @zuolizhu Thanks for your feedback. The way I designed the filter if the job listing has one of the selected tags then it will show up(I am using OR instead of AND). That's why the more you select the tags the size of the listing will increase. For Example, if you selected React and Python tags then all the listing which contains either React OR Python will show up.

I am also having search-bar click issue if you click the close icon it will not work but if you click near close icon it will. I am looking into this issue.

update: I have resolved the click issue. It should work properly now.

2
P
Grace• 27,870

@grace-snow

Posted

I really like this. Only thing I'd change is to make the content a little less narrow on mobile screens. With that text size it's very hard for me to read on a small phone because the cards are so narrow I'm only getting 2 words per line and having to scroll a lot.

This is really good work though!!

0

Sagar Kaurav• 460

@sagarkaurav

Posted

@grace-snow I increased the size of listings card as well as searchbar. That will make more text in one line. Let me know its is still a problem. Then I will descrease the font size a bit for small screen

0
P
Grace• 27,870

@grace-snow

Posted

@sagarkaurav that's great, nice one!

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord