All solutions

This was my first time dipping my toes into Parcel - it was a really pleasant experience!

I guess my only questions revolve around "Did I do something silly?"

I normally get stuck in to these challenges with frontend frameworks and/or CSS preprocessors or frameworks. For this challenge I decided to just use pure CSS and HTML, since recently I feel I have really been ignoring basic HTML/CSS principles and I don't want to lose sight of my fundamentals. So... here's a bare-bones project! I coded this up in the latter half of an afternoon and would like to revisit it after getting some feedback on my semantic HTML and CSS styles.

Ultimately, I'm looking for feedback on my HTML semantic (or not!) markup, CSS best practices, that sort of thing.

Many thanks!

This is my first time using tailwindcss - if you find any bugs please let me know!

This challenge was also my first time building a lightbox element and was a much larger challenge than expected. Since it's a very HTML/CSS-focussed challenge, I'm particularly interested in any semantic HTML feedback and suggested improvements you have.

I'm aware that the site layout breaks a little when you input numbers that are too large - what improvements could I make to the "Totals" section of the UI to handle larger numbers?

Are there better ways I could've semantically written the HTML?

Can you find any bugs in my JS logic?

First attempt at using React Router in a project. I think it turned out alright! I tried my best to stick to "mobile first" CSS, so all of the CSS outside of media queries should prioritise mobile view with some breakpoints for tablet and desktop views where stuff started looking wonky.

Apart from a couple of sizing discrepancies, unless I've missed something I think it's mostly done! I've been staring at this on-and-off for a couple of weeks now so I'm probably missing something obvious but I wanted to get something submitted for now and go from there!

P.S. there's an Easter egg in there - try to find it without browsing the code!

Let me know if you find any bugs! I spent quite a bit of time trying to squash bugs in the calculator but I'm sure I missed some.

I struggled to get the map to work consistently - it sometimes appears greyed out - has anyone else had much success with this? I haven't used Leaflet.JS before so I don't know if my implementation is particularly good.

Also just general feedback would be great! I didn't bother making it look good on screens >1440px in width since the provided screenshots weren't bigger than that.