Add exchange list

[michalsmiarowski]

Closes: #335

This PR adds whole new Exchange List section for the TBTC Website.

Main changes:

• Add exchange list section

• Modify formatRows function so it can be used by both ExchangeList and Integrations. Rename it formatRows-->formatImageLinkRows and move it to utils.js file

• Add proper styles to make sure all the section is responsive

• change <div> tag to <ul><li> tag inside formatImageLinkRows function so both Exchange List and Integrations will be rendered as unordered list

• Add flexibility for future dark mode mentioned in #338

• Add exchange list to Gatsby so it can be added, edited etc. by CMS

• Add exchange list section title to translation files (will need to be translated - right know it's in english in all languages)

Notes:

• for svg files to work properly i had to use react-svg. It was needed to render the svg file as raw <svg> tag so they could be colored in in scss. We need different colors not only for dark mode, but also for hovering the buttons and matcha logo itself has 3 different colors (black, white, gray) that we have to apply.

• the flexibility for dark mode was written based on a #338 Pull Request. It will require similar changes to inverse a colors in darkMode for this section (changing $black/$white to var(--body-foreground-color)/var(--body-background-color)) + additionally swapping --svg-main-color i --svg-secondary-color variables when in dark Mode (same as swapping foreground and background color in #338).

• to test the dark mode look for the exchange list section right now, you have to do 2 things:

  1. Swap values of $black and $white variables in src/css/color.scss
  2. Swap values of --svg-main-color and --svg-secondary-color in src/css/typography.scss

Examples:

Basic example

On button hover:

Responsiveness for 4 items

Responsiveness for 5 items

Responsiveness for 6 items

Responsiveness for 7 items

Dark mode

On button hover:

[r-czajkowski]

Could you please add screenshots to the PR description? Also, please let's link an issue with Closes: #335 in PR description.

[pdyraga]

We should also add Kraken to this list cc @liz-shinn

[liz-shinn]

We should also add Kraken to this list cc @liz-shinn

@Gluzman Looks like there's another exchange needed here for the tbtc website

[michalsmiarowski]

This PR is ready for another review. I fixed the issues you guys mentioned and added some more changes. Please see the first post of this PR to view the full list of changes with examples.