search

CodeForPittsburgh / food-access-map-data

Data for the food access map
MIT License
8 stars 18 forks source link

Style the map filters as buttons and/or toggles #189

Closed hellonewman closed 2 years ago

hellonewman commented 2 years ago

We'd like to see how our map filters might look as buttons or check boxes instead of filters. This explains how to style buttons/toggles in Bootstrap: https://getbootstrap.com/docs/5.0/forms/checks-radios/#toggle-buttons

Map code is located in our Github.io repo: https://github.com/CodeForPittsburgh/CodeForPittsburgh.github.io/tree/master/FoodAccessMap

Ideally by next meeting, we'd have these options styled as buttons: Supermarket

Convenience Store

Grow PGH Garden

Farmer's Market

And these styled as toggles: SNAP

WIC

FMNP

Food Bucks

Fresh Produce

Free Distribution

And we can see which we like best. Feel free to experiment with different styling/colors etc.

runstache commented 2 years ago

I took a stab at this one from last night and utilized the existing Bootstrap.

Was able to implement Toggle switches and organize each of the items into groups. If this looks good, I'll open a PR on it.

Screen Shot 2022-03-31 at 9 05 11 PM
hellonewman commented 2 years ago

@runstache yes this is beautiful! exactly what we were looking for.