Hello! Loke I mentioned in an earlier post, I got kinda bored of the frontend certification projects (with only the horrifying 25+5 clock left to do) and decided to do some other projects.
I finally finished one of them: The weather app
I’d really appreciate some opinions on it! Here it is:
I like how the icons match the weather.
The inputs for latitude and longitude can use some resizing.
Try asking specific questions, you are more likely to get better feedback.
Happy coding
Thanks for the suggestion!
This has been (mostly) fixed with only one problem
Sadly, it’s still not perfect, and the textbox still has a scrollbar
Any help on how to get rid of it would be appreciated
Not sure if it is intentional, but your geolocation lat lon is wrong because of the toFixed call.
It’s basically for two reasons:
There isn’t much point in letting me know what the weather is like in the country next to me.
Besides, it isn’t that accurate, and any website can geolocate you based on your IP.
Alright. Just got rid of the rounding!
The layout could use some more love.
Never use plain viewport units for font sizing. The text becomes unreadable at small screen sizes. You can use a clamp function instead.
font-size: clamp(1.5rem, 2vw + 1rem, 2.25rem);
Thanks for the feedback!
In the end I used media queries though, since they’re kinda easier to use (in my opinion)
You still end up with too small a font size. The clamp will as the name suggests clamp the dynamic value to an upper and lower min/max value (clamp(min, val, max)).
There are also online tools you can use to generate the values.
At the very least, you should add a min value to your viewport value that it won’t go below.
font-size: calc(5vw + 1rem);
Alright. Just added clamps, even to the flag size (cuz it was also gettin’ too smol)
Much better.
Still, the layout below 1055px looks nice, but not above. I don’t think the container needs to be wider than it is in the 1055px breakpoint, where everything is nicely stacked.
I see your pojnt, but the only annoying thing (for me) is the constant scrolling to have to go to the random button and back. In fact, the only reason I made the other layout was cuz the PC one is too thick
Not sure what you mean by scrolling, but the layout above 1055px is just kind of broken.
Anyway, you have to think about how a user would use it. They are not going to sit and click the random button all day long. They will check their weather and maybe click it a few times just to test it.
hmm. true. Perhaps I got too excited about that functionality.
may the old layout rest in peace