From a268c552e6e28e58bbc2aae59709d66543f38f66 Mon Sep 17 00:00:00 2001
From: Alexandre Rousseau <alexandre@rsseau.fr>
Date: Tue, 17 Dec 2024 15:57:08 +0100
Subject: [PATCH] fix(ui): adapt Dataframe bg color when selected - WF-131

The `CoreDataframe` component has a custom background color set with
`dataframeBackgroundColor` variable. This custom background prevents the
user to seeing that this component is being selected in Builder mode.

The workaround is to simply `unset` the background color when the
component has a `.selected` class.
---
 src/ui/src/components/core/content/CoreDataframe.vue       | 5 +++++
 src/ui/src/components/core/content/CoreDataframeLegacy.vue | 5 +++++
 2 files changed, 10 insertions(+)

diff --git a/src/ui/src/components/core/content/CoreDataframe.vue b/src/ui/src/components/core/content/CoreDataframe.vue
index fa9470da4..c0b9c306e 100644
--- a/src/ui/src/components/core/content/CoreDataframe.vue
+++ b/src/ui/src/components/core/content/CoreDataframe.vue
@@ -696,6 +696,11 @@ onUnmounted(() => {
 	max-height: 90vh;
 }
 
+/* remove the background if the dataframe is being selected in builder mode */
+.CoreDataframe.selected .gridContainer {
+	background: unset;
+}
+
 .grid {
 	margin-bottom: -1px;
 	position: v-bind("isRowCountMassive ? 'sticky': 'unset'");
diff --git a/src/ui/src/components/core/content/CoreDataframeLegacy.vue b/src/ui/src/components/core/content/CoreDataframeLegacy.vue
index cddbe3073..3709027e8 100644
--- a/src/ui/src/components/core/content/CoreDataframeLegacy.vue
+++ b/src/ui/src/components/core/content/CoreDataframeLegacy.vue
@@ -573,6 +573,11 @@ onUnmounted(() => {
 	max-height: 90vh;
 }
 
+/* remove the background if the dataframe is being selected in builder mode */
+.CoreDataframe.selected .gridContainer {
+	background: unset;
+}
+
 .grid {
 	margin-bottom: -1px;
 	position: v-bind("isRowCountMassive ? 'sticky': 'unset'");