MUI CSS and JQuery Birding Hotspots Maps

Today, I used the extraordinarily hot and humid day to make a first draft of a Birding Hotspots Maps App that I am envisioning will eventually include weather forecast for the zipcode, plus other info about the hotspot, such as hiking maps, and geology, etc.  This version uses WAY TOO MUCH code, it is quite redundant actually, but I think visually the app is appealing, in a modern flattish sort of way.

I used the responsive MUI CSS framework and JQuery for the JSON ajax calls to the eBird API at Cornell University, the google map, marker and infowindow  rendering and to highlight clicked common names in the list of birds sighted and push the terms to a custom google search (that clears and repopulates each time a new term is clicked), and that limits searches to the online bird guide at National Audubon.  I was drawn to MUI CSS as I really like the toggleable sidenav which disappears into a hamburger menu for mobile screens.  The grayed out overlay when the sidenav opens on mobile screens is also cool

Up next — use JQuery to navigate to different markers on a single map on button or menu item click.  That should seriously cut down on the code!

After that, I would like to return to my struggles yesterday to do something similar in Angular.  I was really having difficulty getting the library ngMap to play nice with ui-router and partials though.