Abdulazeez Yusuf• 150
@horler408
Submitted
Still having issues with the filter section of the project, any help will be highly appreciated. Thanks
Tom Trung Zacchia
@tomzacchia
All comments
- Tom Trung Zacchia• 125
@tomzacchia
Posted
Hi Abdulazeez,
Great work so far. Here are some things that I noticed:
-
For the language elements, in some cases the text itself is larger than its parent. This is due to the fact that on line 123 of your CSS you have the following: .languages { width: 100px; padding: 5px auto; } The div with className .languages has a fixed width regardless of the text inside of it. I recommend that you removed the width property from this div.
-
Pay more attention to the smaller details in the design, such as:
- The job titles are black in the original design
- There are also tags such as "new" and "featured" that are missing in your application
Hope this helps, Tom
0 -
- Philani Ncube• 150
@PhilaniNcube
Submitted
I wanted to add transitions on the slides but that was a bit challenging
Tom Trung Zacchia• 125@tomzacchia
Posted
Hi Philani,
One animation that you can add with relative ease is a "slider" like transition. You can use the "hidden: overflow" CSS property with some javascript to move one image out and "slide" in another on a user interaction, i.e click. I have done something similar in the past and I will link you to a codepen for reference.
Hope this helps, Tom
https://css-tricks.com/almanac/properties/o/overflow/ https://codepen.io/tomtomato/pen/BGRoPj (best viewed full screen)
0 - Pierre• 215
@pchatard
Submitted
Made this one with float for the top part and flexbox for the bottom part.
Also used nth-of-type to shift ratings and quotes parts.
I just saw the comparison on the page looks weird, I don't really know why because my view looks good when I open the link. I'm open to any suggestions of improvements !
Tom Trung Zacchia• 125@tomzacchia
Posted
Hi Pierre,
Your solution looks good. The only difference I see is that the original design has a larger font size for the "10,000+" text and there is more empty space between the top of the page and the content.
Tom
0 - Olatunji Oye• 30
@mystevotgit
Submitted
How can I track the exact ip of a device to find it's location
Tom Trung Zacchia• 125@tomzacchia
Posted
Hi OLATUNJI,
Its looking good. The only thing I noticed is that it only seems to accept IP addresses as input however the IPIFY API also accepts domain names as a query parameter for get requests. This capability will greatly enhance your application.
Cheers, Tom
0 - Rafaela Gomes Ferreira• 10
@Rafahh97
Submitted
I started learning frontend two months ago and now I have completed my first challenge. I had a hard time putting the cards in place (I needed some help). I am open to suggestions on how to improve not only this challenge, but my frontend skills in general.
Tom Trung Zacchia• 125@tomzacchia
Posted
Hey Gabriela,
Something that seems very minor but adds up in bigger projects is the order you place CSS properties. I've attached a link that has some useful examples. Personally I struggle to always stick to conventions when styling as quick as possible but getting better at it one project at a time.
Cheers, Tom
https://css-tricks.com/poll-results-how-do-you-order-your-css-properties/
0 - PDaniel Beccaria• 115
@timegated
Submitted
Tom Trung Zacchia• 125@tomzacchia
Posted
Hi Daniel,
Pay special attention to the section that has the IP address information (IP Address, Location, etc..). I briefly checked it out and on mobile devices that part of the website takes up the entire view therefore obscuring the view of the map itself.Additionally one thing to note is that the input element is the width of the IP address information section on mobile screens.
Hope that helps. Tom
1
