feat: tooltip ui

tailwarden · Jun 30, 2023 · 336f35d · 336f35d
1 parent 2a1628d
commit 336f35d
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 7 deletions.
diff --git a/dashboard/components/dashboard/components/cloud-map/DashboardCloudMapCard.tsx b/dashboard/components/dashboard/components/cloud-map/DashboardCloudMapCard.tsx
@@ -21,7 +21,7 @@ function DashboardCloudMapCard({ data }: DashboardCloudMapCardProps) {
     >
       <div className="-mx-6 flex items-center justify-between border-b border-black-200/40 px-6 pb-4">
         <div>
-          <p className="text-sm font-semibold text-black-900">Cloud map</p>
+          <p className="text-sm font-semibold text-black-900">Cloudsdf map</p>
           <div className="mt-1"></div>
           <p className="text-xs text-black-300">
             Analyze which regions have active resources

diff --git a/dashboard/components/dashboard/components/cloud-map/DashboardCloudMapTooltip.tsx b/dashboard/components/dashboard/components/cloud-map/DashboardCloudMapTooltip.tsx
@@ -1,5 +1,6 @@
 import { memo } from 'react';
 import { DashboardCloudMapTooltipProps } from './hooks/useCloudMapTooltip';
+import LinkIcon from '../../../icons/LinkIcon';
 
 type DashboardCloudMapProps = {
   tooltip: DashboardCloudMapTooltipProps | undefined;
@@ -26,12 +27,10 @@ function DashboardCloudMap({
                 tooltip.resources === 0 ? 'bg-black-300' : 'bg-info-600'
               }`}
             ></div>
-            <span className="font-medium text-white">{tooltip.label}</span>
+            <span className="font-medium text-white">{tooltip.name} </span>
+            <span className="font-medium text-white"> - {tooltip.label}</span>
           </div>
-          <span>
-            Region:{' '}
-            <span className="font-medium text-white">{tooltip.name}</span>
-          </span>
+
           <span>
             Active resources:{' '}
             <span className="font-medium text-white">{tooltip.resources}</span>
@@ -44,7 +43,8 @@ function DashboardCloudMap({
             ).toFixed(1)}%`}</span>
           </span>
           <div className="-mx-3 flex items-center gap-2 border-t border-white/30 px-3 pt-2 pb-1">
-            <span>Click to discover the resources</span>
+            <span className="text-white">Click to discover the resources</span>
+            <LinkIcon className="w-[20px]" />
           </div>
         </div>
       )}