James lowenthal/134/replace dropdown with choices js #176
Conversation
|
Thanks! Looks like there's a merge conflict. Also the test upgrade was causing CI to fail; I fixed this in #137. |
JamesLowenthal
force-pushed
the
JamesLowenthal/134/replace-dropdown-with-choices-js
branch
from
811d517
to
164b542
Compare
Ah sorry about that, still getting used to the forking workflow. Also I missed in the readme where it says I think it should be good now. |
src/css/_header.scss
Outdated
| #city-dropdown { | ||
| display: flex; | ||
| align-items: center; | ||
| gap: 10px; |
There was a problem hiding this comment.
Nit: we've been using em rather than px. Web dev is not my specialty, but my understanding is that em works better for responsive design and things like retina displays. https://www.reddit.com/r/webdev/comments/wlnt6e/should_i_use_emrem_instead_of_px/
There was a problem hiding this comment.
Honestly I'm finding it difficult to redo my styling using em without breaking the layout. I've changed for the gap and media query since that seemed to work fine. I'll confess my CSS workflow (as well as many of the webdevs I know) is basically hack on it until it does what I want but I won't tell you I understand it particular well. This url that was in the thread you sent seems pretty good for understanding it better: https://www.joshwcomeau.com/css/surprising-truth-about-pixels-and-accessibility/.
It looks like in most cases you'd switch back and forth anyway. That all being said I'd say most of the frontend codebases I've seen use a mix of the two and px is still used in many places I don't think many web-devs would agree with "never use px" but maybe I'm wrong.
If it's obvious to you how I can redo this layout using em I'm happy to make the changes (it doesn't seem to be as simple as calculating em and subbing those values in)
There was a problem hiding this comment.
That's fine with me. Thanks, James!
Fwiw, I like rem because it's always the same size. Easier to reason about than em.
src/js/setUpSite.js
Outdated
| const lots = await parkingLots; | ||
| parkingLayer.addData(await lots[`${cityId}.geojson`]()); |
There was a problem hiding this comment.
Why this change? Btw the dynamic import is so that we lazily load the GeoJSON file because they are large and loading everything eagerly slows down the site too much. Implemented recently in #142.
There was a problem hiding this comment.
I'm reverting it. I thought it solved an issue I was having with an error I was getting in the console but I can't seem to reproduce the error. I'm finding it a bit difficult to make sure the version of the app I have served is up to date with my changes and I've gotten what I think is a corrupted cache a number of times (weird segfauls/mutex lock complaints?). Anyway sorry that crept in.
There was a problem hiding this comment.
Hm, possibly Parcel bugs. Sometimes it can help to rm -rf .parcel-cache.
There was a problem hiding this comment.
Yeah that's what I ended up doing.
There was a problem hiding this comment.
Huzzah, thanks!
Btw with at least the open source repos I've worked on, the PR title conventionally wouldn't include your name. It sometimes includes the issue number, but usually, that's only in the body.
Here, it can be something like "Switch dropdown component to choices.js"
See https://www.pantsbuild.org/2.18/docs/contributions#opening-a-pull-request for how one project I was a previous maintainer for does PR titles. Of course, other projects may vary.
Solves #134