Feature/add crypto coins and stock heatmaps to resources page (#3548)

* Add heatmaps

* Crypto Coins Heatmap
* Stock Heatmap

* Update changelog

CHANGELOG.md

@@ -7,6 +7,11 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## Unreleased
 
+### Added
+
+- Added the _Crypto Coins Heatmap_ to the resources section
+- Added the _Stock Heatmap_ to the resources section
+
 ### Changed
 
 - Improved the allocations by ETF holding on the allocations page for the impersonation mode (experimental)

apps/client/src/app/pages/resources/resources-page.html

@@ -55,6 +55,22 @@
       </div>
       <h2 class="h4 mb-3" i18n>Markets</h2>
       <div class="mb-5">
+        <div class="mb-4 media">
+          <div class="media-body">
+            <h3 class="h5 mt-0">Crypto Coins Heatmap</h3>
+            <div class="mb-1">
+              With the <i>Crypto Coins Heatmap</i> you can track the daily
+              market movements of cryptocurrencies as a visual snapshot.
+            </div>
+            <div>
+              <a
+                href="https://www.tradingview.com/heatmap/crypto"
+                target="_blank"
+                >Crypto Coins Heatmap →</a
+              >
+            </div>
+          </div>
+        </div>
         <div class="mb-4 media">
           <div class="media-body">
             <h3 class="h5 mt-0">Fear & Greed Index</h3>
@@ -73,10 +89,10 @@
           </div>
         </div>
         <div class="media">
-          <div class="media-body">
+          <div class="mb-4 media">
             <h3 class="h5 mt-0">Inflation Chart</h3>
             <div class="mb-1">
-              Inflation Chart helps you find the intrinsic value of stock
+              <i>Inflation Chart</i> helps you find the intrinsic value of stock
               markets, stock prices, goods and services by adjusting them to the
               amount of the money supply (M0, M1, M2) or price of other goods
               (food or oil).
@@ -88,6 +104,22 @@
             </div>
           </div>
         </div>
+        <div class="media">
+          <div class="media-body">
+            <h3 class="h5 mt-0">Stock Heatmap</h3>
+            <div class="mb-1">
+              With the <i>Stock Heatmap</i> you can track the daily market
+              movements of stocks as a visual snapshot.
+            </div>
+            <div>
+              <a
+                href="https://www.tradingview.com/heatmap/stock"
+                target="_blank"
+                >Stock Heatmap →</a
+              >
+            </div>
+          </div>
+        </div>
       </div>
       <h2 class="h4 mb-3" i18n>Glossary</h2>
       <div>