Styling pass of app

[alexelash]

Overview

This is a styling pass of the currently available features of the app. As there isn't a ton of time in the contract, these will still not look exactly like the flat designs in abstract.

Demo

Notes

• I added an images/ directory, where some custom icons live (we are pulling in FontAwesome rather than using Fontello on this project) as well as client logos.
• We still need to add the "Sponsored by IDB" message. There is a corresponding image in the images/ folder.
• We still need (?) to add the "Something look wrong? Update..." message to the bottom-left of the map. This is not dynamic in anyway and is always visible.
• It would be nice to try and style the react-select inputs' selected and hover states. @kellyi and I were discussing how this could be done, but it might require some React-writing rather than SCSS.
• The extract button should be disabled until the "required" fields in the sidebar are filled in.

Testing Instructions

• git pull
• In the browser, put a .-disabled class on the .-extract button to see the disabled styles
• Try running a search in the Geocoder. Toggle to Coordinates to see the Lat/Long design.
• Click the "i" icon in the sidebar header to see style revisions.
• Click one of the site boundary buttons and try drawing on the map to see the various states of the buttons.

[kellyi]

Looks great! I pushed a commit to disabled the extract button contextually and also to make the focused select dropdown option's background $lightyellow to match the geocoder's.

[kellyi]

👍

Will make new issues for the logo & OSM link.