Merge af4f8ae into aab8e56

docs/bridge/docs/01-About/03-Routes.md

@@ -0,0 +1,7 @@
+import Routes from '@site/src/components/Routes'
+
+# Chains & Tokens
+
+This page contains a list of supported tokens, listed per-chain. For a given pair, use the [Synapse Bridge](https://synapseprotocol.com) to see if a route between them exists.
+
+<Routes />

docs/bridge/docs/02-Bridge/04-Sample-Code.md → docs/bridge/docs/02-Bridge/04-Code-Examples.md

@@ -1,8 +1,8 @@
 ---
-sidebar_label: Sample Code
+sidebar_label: Examples
 ---
 
-# Sample Code
+# Example Code
 
 Example SDK & API implementations
 

docs/bridge/docs/02-Bridge/index.md

@@ -7,7 +7,7 @@ import SVGBridge from '@site/src/components/SVGBridge'
 
 # Synapse Bridge
 
-The [Synapse Bridge](https://synapseprotocol.com) and [Solana Bridge](https://solana.synapseprotocol.com/) seamlessly swap on-chain assets between [20+ EVM and non-EVM blockchains](./Supported-Routes) in a safe and secure manner.
+The [Synapse Bridge](https://synapseprotocol.com) and [Solana Bridge](https://solana.synapseprotocol.com/) seamlessly swap on-chain assets between [20+ EVM and non-EVM blockchains](/docs/About/Routes) in a safe and secure manner.
 
 <br />
 

docs/bridge/src/components/Routes.tsx

@@ -11,7 +11,7 @@ for (const { chainImg, id, name } of Object.values(CHAINS)) {
 export default () =>
   Object.entries(BRIDGABLE_TOKENS).map(([id, tokens]) => {
     const chain = CHAINS_BY_ID[id]
-    const chainImg = chain.chainImg({ width: 28, height: 28 })
+    const chainImg = chain.chainImg
     return (
       <section key={id}>
         <h2
@@ -22,7 +22,8 @@ export default () =>
             alignItems: 'center',
           }}
         >
-          {chainImg} {chain.name} <code>{id}</code>
+          <img width="28" height="28" src={chainImg} alt={chain.name} />
+          {chain.name} <code>{id}</code>
         </h2>
         {Object.values(tokens).map((token) => {
           const tokenImg =