Merge branch 'dev' into links

Author: JoseSanchez1996

reactime-website

@@ -34,6 +34,11 @@ const hoverClass = {
   stroke: '#ab269b' //pinkish
 }
 
+/* Heat Map Colors (for links) */
+const lightOrange = '#F1B476';
+const darkOrange = '#E4765B';
+const red = '#C64442';
+const plum = '#8C2743';
 
 const defaultMargin: DefaultMargin = {
   top: 30,
@@ -262,12 +267,20 @@ export default function ComponentMap({
                   const strokeWidthIndex = y0 + L / (1 + Math.exp(-k * (childPropsLength - x0)));
                   // const strokeWidthIndex = childPropsLength * 2.5 + 1;
                   console.log('strokeWidthIndex: ', strokeWidthIndex);
-                  
+
                   if (strokeWidthIndex <= 1) {
-                    // strokeWidthIndex = 1;
-                    stroke = '#000000';
+                    stroke = '#808080';
                   } else {
-                    stroke = '#df6f37'
+                    if (childPropsLength <= 1) {
+                      stroke = lightOrange;
+                    } else if (childPropsLength <= 2) {
+                      stroke = darkOrange;
+                    } else if (childPropsLength <= 3) {
+                      stroke = red;
+                    } else {
+                      stroke = plum;
+                    }
+                    // stroke = '#df6f37'
                   }
 
                   //testing hover functionality

src/app/components/StateRoute/ComponentMap/ComponentMap.tsx

@@ -15,7 +15,7 @@ import { useDispatch, useSelector } from 'react-redux';
 import PerformanceVisx from './PerformanceVisx/PerformanceVisx';
 import WebMetricsContainer from './WebMetrics/WebMetricsContainer';
 import { MainState, RootState, StateRouteProps } from '../../FrontendTypes';
-import AxContainer from './AxMap/AxMap';
+import type AxContainer from './AxMap/AxMap';
 
 /*
   Loads the appropriate StateRoute view and renders the Map, Performance, History, Webmetrics, and Tree navbar buttons after clicking on the 'State' button located near the top rightmost corner.

src/app/components/StateRoute/StateRoute.tsx

@@ -93,6 +93,9 @@
     background-color: $navbar-unselected;
     text-decoration: none;
     color: $navbar-unselected-text;
+
+    border-top-right-radius: 10px;
+    border-top-left-radius: 10px;
   }
 
   .router-link:hover {