Top Charities Search Page

[aissshah]

Hi @winterstein, we have completed the next chunk of work and it is ready for review. This branch builds upon the charity page pull request #217 so you will see those changes listed here too until they are merged into revamp-2020 :)

Return all charities rather than top feature change and mobile-specific changes to follow in a separate pull request.

The figma link for reference: https://www.figma.com/file/yTLbUNroqex2Z5baACamDY/SoGive-Masterfile?node-id=18%3A53

• [x] Search Bar / banner

  • [x] change placeholder to 'Enter charity name'
  • [x] add search icon to the left
  • [x] change search button to say 'Search'
  • [x] Add 'Search for a Charity' text above search box - h2
  • [x] Styling
  • [x] Background image

• [x] Style the charity search result boxes

  • [x] Remove background colours
  • [x] Add border
  • [x] Style name
  • [x] Style description
  • [x] Style impact
  • [x] Add donate button
  • [x] Style Read More button
  • [x] Include bar between impact and description

• [x] Text above search results ('Showing all high impact charities' / 'Results for '...')

  • [x] Change text to "All Charities by rating" / "Searching for .."
  • [x] Style it to match Figma and as h1
  • [x] Add description text
  • [x] 'Learn about our ratings' button
  • [x] Style it to match Figma
  • [x] Make it show the modal dialog when you click on it
  • [x] Make description & button disappear on search

• [x] Other Issues

  • [x] Style Downloads csv button
  • [x] Style 'N charities found' text
  • [x] Add hover effect to all buttons (including in other pages)
  • [x] General layout
  • [x] Make sure read more button always is on a new line (check for charities w/o impact)
  • [x] Add donate button for no impact charities
  • [x] Add rating badge

[winterstein]

...there's a merge conflict.

[aissshah]

Looks like the conflicts on the SearchPage are because of a formatter 😬 and we took out imports we didn't need in ImpactCalculator