Fix/tm 1375 fixes dashboard learn more

src/components/extensive/BlurContainer/BlurContainer.tsx

@@ -17,8 +17,8 @@ const BlurContainer = ({ isBlur, textInformation, children, ...props }: BlurCont
   return (
     <div className="relative w-full text-black">
       <div
-        className={`absolute left-0 top-0 flex h-full w-full items-center justify-center rounded-xl   ${
-          isBlur ? "z-10 bg-[#9d9a9a29] backdrop-blur-sm" : ""
+        className={`absolute left-0 top-0 flex h-full w-full items-center justify-center rounded-xl ${
+          isBlur ? "z-[1] bg-[#9d9a9a29] backdrop-blur-sm" : ""
         }`}
       >
         <When condition={isBlur && textInformation}>

src/components/extensive/PageElements/Card/PageCard.tsx

@@ -77,6 +77,7 @@ const PageCard = ({
                 <When condition={!!tooltip}>
                   &nbsp;
                   <ToolTip
+                    className="normal-case"
                     content={tooltip || ""}
                     width={widthTooltip || "w-44 lg:w-52"}
                     title={title}

src/pages/dashboard/about-us/index.page.tsx

@@ -1,5 +1,7 @@
+import { useT } from "@transifex/react";
 import { useEffect, useRef } from "react";
 
+import Button from "@/components/elements/Button/Button";
 import Text from "@/components/elements/Text/Text";
 import Icon, { IconNames } from "@/components/extensive/Icon/Icon";
 
@@ -10,6 +12,8 @@ const Homepage = () => {
   const second = useRef<HTMLDivElement>(null);
   const third = useRef<HTMLDivElement>(null);
 
+  const t = useT();
+
   useEffect(() => {
     const elements = [first, second, third];
 
@@ -70,7 +74,7 @@ const Homepage = () => {
                   organizations that grow trees, their financial and government partners, and the wider public – can
                   access data and insights about projects that are tracked through&nbsp;
                   <a
-                    href="https://www.terramatch.org/"
+                    href="https://terramatchsupport.zendesk.com/hc/en-us/articles/21178354112539-The-TerraFund-Monitoring-Reporting-and-Verification-Framework"
                     target="_blank"
                     className="text-14-bold underline underline-offset-4"
                     rel="noreferrer"
@@ -95,6 +99,13 @@ const Homepage = () => {
                   Please note that the dashboard is pre-filtered upon page load to display only projects from the
                   TerraFund Landscapes programme. Each project reports 12 times over six years.
                 </Text>
+                <Button
+                  variant="about-us"
+                  className="mt-6"
+                  onClick={() => (window.location.href = "/dashboard?programmes=terrafund-landscapes")}
+                >
+                  {t("Access the Dashboards")}
+                </Button>
               </div>
             </div>
             <div className="w-2/5 pr-5">

src/pages/dashboard/components/ContentOverview.tsx

@@ -23,7 +23,6 @@ import { DashboardGetProjectsData } from "@/generated/apiSchemas";
 import { HectaresUnderRestorationData } from "@/utils/dashboardUtils";
 
 import {
-  HECTARES_UNDER_RESTORATION_SECTION_TOOLTIP,
   MAP_TOOLTIP,
   RESTORATION_STRATEGIES_REPRESENTED_TOOLTIP,
   TARGET_LAND_USE_TYPES_REPRESENTED_TOOLTIP,
@@ -233,9 +232,8 @@ const ContentOverview = (props: ContentOverviewProps<RowData>) => {
           gap={8}
           isUserAllowed={isUserAllowed}
           subtitleMore={true}
-          title={t("Hectares Under Restoration")}
+          title={t("HECTARES UNDER RESTORATION")}
           variantSubTitle="text-14-light"
-          tooltip={t(HECTARES_UNDER_RESTORATION_SECTION_TOOLTIP)}
           iconClassName="h-3.5 w-3.5 text-darkCustom lg:h-5 lg:w-5"
           subtitle={t(
             `The numbers and reports below display data related to Indicator 2: Hectares Under Restoration described in <span class="underline">TerraFund’s MRV framework</span>. Please refer to the linked MRV framework for details on how these numbers are sourced and verified.`

src/pages/dashboard/components/ObjectiveSec.tsx

@@ -4,7 +4,32 @@ import { When } from "react-if";
 
 import Text from "@/components/elements/Text/Text";
 
-import { DashboardDataProps } from "../project/index.page";
+export interface DashboardTableDataProps {
+  label: string;
+  valueText: string;
+  value: number;
+}
+
+export interface GraphicLegendProps {
+  label: string;
+  value: string;
+  color: string;
+}
+export interface DashboardDataProps {
+  value?: number;
+  unit?: string;
+  secondValue?: string;
+  graphic?: string;
+  tableData?: DashboardTableDataProps[];
+  maxValue?: number;
+  totalSection?: { numberOfSites: number; totalHectaresRestored: number };
+  graphicLegend?: GraphicLegendProps[];
+  graphicTargetLandUseTypes?: DashboardTableDataProps[];
+  objetiveText?: string;
+  preferredLanguage?: string;
+  landTenure?: string;
+  totalValue?: number;
+}
 
 const ObjectiveSec = ({ data }: { data: DashboardDataProps }) => {
   const t = useT();

src/pages/dashboard/index.page.tsx

@@ -36,15 +36,10 @@ import {
   NUMBER_OF_TREES_PLANTED_BY_YEAR_TOOLTIP,
   TOP_5_PROJECTS_WITH_MOST_PLANTED_TREES_TOOLTIP,
   TOTAL_VOLUNTEERS_TOOLTIP,
-  TREES_RESTORED_SECTION_TOOLTIP,
   VOLUNTEERS_CREATED_BY_AGE_TOOLTIP,
   VOLUNTEERS_CREATED_BY_GENDER_TOOLTIP
 } from "./constants/tooltips";
-import {
-  JOBS_CREATED_SECTION_TOOLTIP,
-  NO_DATA_PRESENT_ACTIVE_PROJECT_TOOLTIPS,
-  NUMBER_OF_TREES_PLANTED_TOOLTIP
-} from "./constants/tooltips";
+import { NO_DATA_PRESENT_ACTIVE_PROJECT_TOOLTIPS, NUMBER_OF_TREES_PLANTED_TOOLTIP } from "./constants/tooltips";
 import { useDashboardData } from "./hooks/useDashboardData";
 import { LABEL_LEGEND } from "./mockedData/dashboard";
 
@@ -352,8 +347,7 @@ const Dashboard = () => {
             gap={8}
             subtitleMore={true}
             isUserAllowed={isUserAllowed?.allowed}
-            title={t("Trees Restored")}
-            tooltip={t(TREES_RESTORED_SECTION_TOOLTIP)}
+            title={t("TREES RESTORED")}
             widthTooltip="w-52 lg:w-64"
             iconClassName="h-3.5 w-3.5 text-darkCustom lg:h-5 lg:w-5"
             variantSubTitle="text-14-light"
@@ -403,7 +397,6 @@ const Dashboard = () => {
             tooltipTrigger="click"
             widthTooltip="w-80 lg:w-96"
             iconClassName="h-3.5 w-3.5 text-darkCustom lg:h-5 lg:w-5"
-            tooltip={t(JOBS_CREATED_SECTION_TOOLTIP)}
             subtitle={t(
               `The numbers and reports below display data related to Indicator 3: Jobs Created described in <span class="underline">TerraFund's MRV framework</span>. TerraFund defines a job as a set of tasks and duties performed by one person aged 18 or over in exchange for monetary pay in line with living wage standards. All indicators in the Jobs Created category are disaggregated by number of women, number of men, and number of youths. Restoration Champions are required to report on jobs and volunteers every 6 months and provide additional documentation to verify employment. Please refer to the linked MRV framework for additional details on how these numbers are sourced and verified.`
             )}