From 41fbf1c20100ccda6d7208a57503ddbd3e5e31b9 Mon Sep 17 00:00:00 2001
From: Mark Woodard <mark.c.woodard@gmail.com>
Date: Wed, 11 Dec 2024 14:08:35 -0600
Subject: [PATCH] fixing issue with column styles and matching editor to
 frontend fro row selectors https://stellarwp.atlassian.net/browse/KAD-3950

---
 .../blocks/class-kadence-blocks-table-block.php     |  8 +++++++-
 .../table/children/row/backend-styles/index.js      |  8 ++------
 src/blocks/table/components/backend-styles/index.js | 13 ++++++++-----
 3 files changed, 17 insertions(+), 12 deletions(-)

diff --git a/includes/blocks/class-kadence-blocks-table-block.php b/includes/blocks/class-kadence-blocks-table-block.php
index 671a364b7..b09cbbc3b 100644
--- a/includes/blocks/class-kadence-blocks-table-block.php
+++ b/includes/blocks/class-kadence-blocks-table-block.php
@@ -177,7 +177,13 @@ public function build_css( $attributes, $css, $unique_id, $unique_style_id ) {
 		if( !empty( $attributes['columnBackgrounds'] ) ) {
 			foreach( $attributes['columnBackgrounds'] as $index => $background ) {
 				if ( $background ) {
-					$css->set_selector( '.kb-table-container .kb-table' . esc_attr( $unique_id ) . ' td:nth-of-type(' . ( $index + 1 ) . '), .kb-table-container .kb-table' . esc_attr( $unique_id ) . ' th:nth-of-type(' . ( $index + 1 ) . ')' );
+					if( $attributes['isFirstColumnHeader'] ) {
+						$css->set_selector( '.kb-table-container .kb-table' . esc_attr( $unique_id ) . ' td:nth-of-type(' . ( $index ) . ')' );
+					} else {
+						$css->set_selector( '.kb-table-container .kb-table' . esc_attr( $unique_id ) . ' td:nth-of-type(' . ( $index + 1 ) . ')' );
+					}
+					$css->add_property( 'background-color', $css->render_color( $background ) );
+					$css->set_selector( '.kb-table-container .kb-table' . esc_attr( $unique_id ) . ' th:nth-of-type(' . ( $index + 1 ) . ')' );
 					$css->add_property( 'background-color', $css->render_color( $background ) );
 				}
 			}
diff --git a/src/blocks/table/children/row/backend-styles/index.js b/src/blocks/table/children/row/backend-styles/index.js
index 362e5c44e..b65b13f59 100644
--- a/src/blocks/table/children/row/backend-styles/index.js
+++ b/src/blocks/table/children/row/backend-styles/index.js
@@ -24,9 +24,7 @@ export default function BackendStyles(props) {
 
 	const css = new KadenceBlocksCSS();
 
-	css.set_selector(
-		`.kb-table-container .kb-table tr.kb-table-row${uniqueID}, .kb-table-container .kb-table tr.kb-table-row${uniqueID} th, .kb-table-container .kb-table tr.kb-table-row${uniqueID} td`
-	);
+	css.set_selector(`.kb-table-container .kb-table tr.kb-table-row${uniqueID}`);
 	if (previewMinHeight) {
 		css.add_property('height', previewMinHeight + minHeightType);
 	}
@@ -34,9 +32,7 @@ export default function BackendStyles(props) {
 		css.add_property('background-color', KadenceColorOutput(backgroundColor));
 	}
 
-	css.set_selector(
-		`.kb-table-container .kb-table tr.kb-table-row${uniqueID}:hover, .kb-table-container .kb-table tr.kb-table-row${uniqueID}:hover th, .kb-table-container .kb-table tr.kb-table-row${uniqueID}:hover td`
-	);
+	css.set_selector(`.kb-table-container .kb-table tr.kb-table-row${uniqueID}:hover`);
 	if (backgroundHoverColor !== '') {
 		css.add_property('background-color', KadenceColorOutput(backgroundHoverColor));
 	}
diff --git a/src/blocks/table/components/backend-styles/index.js b/src/blocks/table/components/backend-styles/index.js
index e7c4ac16a..20f3afed8 100644
--- a/src/blocks/table/components/backend-styles/index.js
+++ b/src/blocks/table/components/backend-styles/index.js
@@ -57,6 +57,7 @@ export default function BackendStyles(props) {
 		tabletMargin,
 		mobileMargin,
 		marginType,
+		isFirstColumnHeader,
 	} = attributes;
 	const css = new KadenceBlocksCSS();
 
@@ -197,11 +198,13 @@ export default function BackendStyles(props) {
 	if (columnBackgrounds) {
 		columnBackgrounds.forEach((background, index) => {
 			if (background) {
-				css.set_selector(
-					`.kb-table${uniqueID} td:nth-of-type(${index + 1}), .kb-table${uniqueID} th:nth-of-type(${
-						index + 1
-					})`
-				);
+				if (isFirstColumnHeader) {
+					css.set_selector(`.kb-table${uniqueID} td:nth-of-type(${index})`);
+				} else {
+					css.set_selector(`.kb-table${uniqueID} td:nth-of-type(${index + 1})`);
+				}
+				css.add_property('background-color', KadenceColorOutput(background));
+				css.set_selector(`.kb-table${uniqueID} th:nth-of-type(${index + 1})`);
 				css.add_property('background-color', KadenceColorOutput(background));
 			}
 		});