Better formatting

src/Home.tsx

@@ -1,6 +1,8 @@
 import React, { useState, useContext } from "react";
 import { NavLink, useHistory } from "react-router-dom";
 import { ethers } from "ethers";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { faBurn } from "@fortawesome/free-solid-svg-icons";
 import Logo from "./Logo";
 import Timestamp from "./components/Timestamp";
 import { RuntimeContext } from "./useRuntime";
@@ -56,7 +58,15 @@ const Home: React.FC = () => {
         </button>
         <div className="mx-auto mt-5 mb-5 text-lg text-link-blue hover:text-link-blue-hover font-bold">
           <NavLink to="/special/london">
-            Check the special dashboard for EIP-1559
+            <div className="flex space-x-2 items-baseline text-orange-500 hover:text-orange-700 hover:underline">
+              <span>
+                <FontAwesomeIcon icon={faBurn} />
+              </span>
+              <span>Check the special dashboard for EIP-1559</span>
+              <span>
+                <FontAwesomeIcon icon={faBurn} />
+              </span>
+            </div>
           </NavLink>
         </div>
         {latestBlock && (

src/special/london/BlockRow.tsx

@@ -34,14 +34,14 @@ const BlockRow: React.FC<BlockRowProps> = ({ now, block }) => {
       >
         {ethers.utils.commify(block.gasUsed.toString())}
       </div>
-      <div className="text-right">
+      <div className="text-right text-gray-400">
         {ethers.utils.commify(gasTarget.toString())}
       </div>
       <div className="text-right">{block.baseFeePerGas?.toString()} wei</div>
       <div className="text-right col-span-2">
         {ethers.utils.commify(ethers.utils.formatEther(totalReward))} Ether
       </div>
-      <div className="text-right">
+      <div className="text-right line-through text-orange-500">
         {ethers.utils.commify(
           ethers.utils.formatUnits(
             block.gasUsed.mul(block.baseFeePerGas!).toString(),
@@ -50,7 +50,7 @@ const BlockRow: React.FC<BlockRowProps> = ({ now, block }) => {
         )}{" "}
         Gwei
       </div>
-      <div className="text-right">
+      <div className="text-right text-gray-400">
         <TimestampAge now={now / 1000} timestamp={block.timestamp} />
       </div>
     </div>

src/special/london/Blocks.tsx

@@ -15,6 +15,7 @@ import {
   faCoins,
   faCube,
   faGasPump,
+  faHistory,
 } from "@fortawesome/free-solid-svg-icons";
 import BlockRow from "./BlockRow";
 import { ExtendedBlock, readBlock } from "../../useErigonHooks";
@@ -168,7 +169,12 @@ const Blocks: React.FC<BlocksProps> = ({ latestBlock, targetBlockNumber }) => {
             </span>
             <span>Burnt fees</span>
           </div>
-          <div className="text-right">Age</div>
+          <div className="text-right flex space-x-1 justify-end items-baseline">
+            <span className="text-gray-500">
+              <FontAwesomeIcon icon={faHistory} />
+            </span>
+            <span>Age</span>
+          </div>
         </div>
         {blocks.map((b, i) => (
           <Transition