From c8d3870785a5bfc4b93fc9ea1ab026a07907a56e Mon Sep 17 00:00:00 2001
From: monsieurswag <mael.joumier@intuitem.com>
Date: Fri, 7 Jun 2024 10:29:25 +0200
Subject: [PATCH] Display colors for probability and impact risk matrix
 sections

---
 frontend/src/lib/components/RiskMatrix/RiskMatrix.svelte | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/frontend/src/lib/components/RiskMatrix/RiskMatrix.svelte b/frontend/src/lib/components/RiskMatrix/RiskMatrix.svelte
index 64c408e1f..ccfbbdc32 100644
--- a/frontend/src/lib/components/RiskMatrix/RiskMatrix.svelte
+++ b/frontend/src/lib/components/RiskMatrix/RiskMatrix.svelte
@@ -37,7 +37,8 @@
 			{@const reverseIndex = displayedRiskMatrix.length - i - 1}
 			{@const probability = parsedRiskMatrix.probability[reverseIndex]}
 			<div
-				class="flex flex-col items-center justify-center bg-gray-200"
+				class="flex flex-col items-center justify-center bg-gray-200 border-dotted border-black border-2"
+				style="background: {probability.hexcolor}"
 				data-testid="probability-row-header"
 			>
 				<span class="font-semibold text-center" data-testid="probability-name"
@@ -68,7 +69,8 @@
 		<div />
 		{#each parsedRiskMatrix.impact as impact}
 			<div
-				class="flex flex-col items-center justify-center bg-gray-200 h-20"
+				class="flex flex-col items-center justify-center bg-gray-200 h-20 border-dotted border-black border-2"
+				style="background: {impact.hexcolor}"
 				data-testid="impact-col-header"
 			>
 				<span class="font-semibold" data-testid="impact-name">{impact.name}</span>