diff --git a/src/configs/settings.ts b/src/configs/settings.ts index 85c751cb4f..8e1d1003f3 100644 --- a/src/configs/settings.ts +++ b/src/configs/settings.ts @@ -603,6 +603,9 @@ export const lineLayerConfig = { visible: false, }; +export const jurisdictionSelectionTooltipHint: string = + 'Shift+Click a Jurisdiction to toggle its selection'; + /** Fill opacity configuration */ export const structureFillOpacity: Expression = [ 'match', diff --git a/src/containers/pages/InterventionPlan/IRS/plan/index.tsx b/src/containers/pages/InterventionPlan/IRS/plan/index.tsx index 25f8b6bba6..75e13b45bb 100644 --- a/src/containers/pages/InterventionPlan/IRS/plan/index.tsx +++ b/src/containers/pages/InterventionPlan/IRS/plan/index.tsx @@ -58,6 +58,7 @@ import { fillLayerConfig, JurisdictionLevels, JurisdictionsByCountry, + jurisdictionSelectionTooltipHint, JurisdictionTypes, lineLayerConfig, } from './../../../../../configs/settings'; @@ -1498,7 +1499,7 @@ class IrsPlan extends React.Component< const tooltipVal = tilesets[t].labelField || tilesets[t].idField; if (tooltipVal && tooltipVal.length) { (adminFillLayer as any).popup = { - body: `

{{${tooltipVal}}}

`, + body: `

{{${tooltipVal}}}

${jurisdictionSelectionTooltipHint}
`, }; } diff --git a/src/containers/pages/InterventionPlan/IRS/plan/style.css b/src/containers/pages/InterventionPlan/IRS/plan/style.css index 057743e018..c082f65b1b 100644 --- a/src/containers/pages/InterventionPlan/IRS/plan/style.css +++ b/src/containers/pages/InterventionPlan/IRS/plan/style.css @@ -56,5 +56,13 @@ } .select-jurisdictin-tooltip { - padding: 6px 8px !important; + padding: 6px 8px 0 !important; + font-weight: 600 !important; +} + +.select-jurisdictin-tooltip-hint { + color: grey; + font-size: 0.75rem; + font-style: italic; + padding: 0 6px 8px !important; }