Skip to content

Commit

Permalink
replacing some nth-child selectors with nth-of-type to handle things …
Browse files Browse the repository at this point in the history
…like <style> tags messing up the ordering
  • Loading branch information
mark-c-woodard committed Nov 27, 2024
1 parent 931ccb2 commit 950940f
Show file tree
Hide file tree
Showing 2 changed files with 16 additions and 14 deletions.
16 changes: 8 additions & 8 deletions includes/blocks/class-kadence-blocks-table-block.php
Original file line number Diff line number Diff line change
Expand Up @@ -99,8 +99,8 @@ public function build_css( $attributes, $css, $unique_id, $unique_style_id ) {
$has_fixed_columns = true;
$width_unit = ! empty( $settings['unit'] ) ? $settings['unit'] : '%';

$css->set_selector( '.kb-table' . esc_attr( $unique_id ) . ' td:nth-child(' . ( $index + 1 ) . '), ' .
'.kb-table' . esc_attr( $unique_id ) . ' th:nth-child(' . ( $index + 1 ) . ')' );
$css->set_selector( '.kb-table' . esc_attr( $unique_id ) . ' td:nth-of-type(' . ( $index + 1 ) . '), ' .
'.kb-table' . esc_attr( $unique_id ) . ' th:nth-of-type(' . ( $index + 1 ) . ')' );
$css->add_property( 'width', $settings['width'] . $width_unit );
}
}
Expand Down Expand Up @@ -130,16 +130,16 @@ public function build_css( $attributes, $css, $unique_id, $unique_style_id ) {


if ( !empty( $attributes['evenOddBackground'] ) ) {
$css->set_selector( '.kb-table-container .kb-table' . esc_attr( $unique_id ) . ' tr:nth-child(even)' );
$css->set_selector( '.kb-table-container .kb-table' . esc_attr( $unique_id ) . ' tr:nth-of-type(even)' );
$css->add_property( 'background-color', $css->render_color( $attributes['backgroundColorEven'] ?? 'undefined' ) );

$css->set_selector( '.kb-table-container .kb-table' . esc_attr( $unique_id ) . ' tr:nth-child(odd)' );
$css->set_selector( '.kb-table-container .kb-table' . esc_attr( $unique_id ) . ' tr:nth-of-type(odd)' );
$css->add_property( 'background-color', $css->render_color( $attributes['backgroundColorOdd'] ?? 'undefined' ) );

$css->set_selector( '.kb-table-container .kb-table' . esc_attr( $unique_id ) . ' tr:nth-child(odd):hover' );
$css->set_selector( '.kb-table-container .kb-table' . esc_attr( $unique_id ) . ' tr:nth-of-type(odd):hover' );
$css->add_property( 'background-color', $css->render_color( $attributes['backgroundHoverColorOdd'] ?? 'undefined' ) );

$css->set_selector( '.kb-table-container .kb-table' . esc_attr( $unique_id ) . ' tr:nth-child(even):hover' );
$css->set_selector( '.kb-table-container .kb-table' . esc_attr( $unique_id ) . ' tr:nth-of-type(even):hover' );
$css->add_property( 'background-color', $css->render_color( $attributes['backgroundHoverColorEven'] ?? 'undefined' ) );
} else {

Expand All @@ -157,7 +157,7 @@ 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-child(' . ( $index + 1 ) . ')' );
$css->set_selector( '.kb-table-container .kb-table' . $unique_id . ' td:nth-of-type(' . ( $index + 1 ) . ')' );
$css->add_property( 'background-color', $css->render_color( $background ) );
}
}
Expand All @@ -167,7 +167,7 @@ public function build_css( $attributes, $css, $unique_id, $unique_style_id ) {
if( !empty( $attributes['columnBackgroundsHover'] ) ) {
foreach( $attributes['columnBackgroundsHover'] as $index => $background ) {
if ( $background ) {
$css->set_selector( '.kb-table-container .kb-table' . esc_attr( $unique_id ) . ' td:nth-child(' . ( $index + 1 ) . '):hover' );
$css->set_selector( '.kb-table-container .kb-table' . esc_attr( $unique_id ) . ' td:nth-of-type(' . ( $index + 1 ) . '):hover' );
$css->add_property( 'background-color', $css->render_color( $background ) );
}
}
Expand Down
14 changes: 8 additions & 6 deletions src/blocks/table/components/backend-styles/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -160,16 +160,16 @@ export default function BackendStyles(props) {
);

if (evenOddBackground) {
css.set_selector(`.kb-table${uniqueID} tr:nth-child(even)`);
css.set_selector(`.kb-table${uniqueID} tr:nth-of-type(even)`);
css.add_property('background-color', KadenceColorOutput(backgroundColorEven));

css.set_selector(`.kb-table${uniqueID} tr:nth-child(odd)`);
css.set_selector(`.kb-table${uniqueID} tr:nth-of-type(odd)`);
css.add_property('background-color', KadenceColorOutput(backgroundColorOdd));

css.set_selector(`.kb-table${uniqueID} tr:nth-child(odd):hover`);
css.set_selector(`.kb-table${uniqueID} tr:nth-of-type(odd):hover`);
css.add_property('background-color', KadenceColorOutput(backgroundHoverColorOdd));

css.set_selector(`.kb-table${uniqueID} tr:nth-child(even):hover`);
css.set_selector(`.kb-table${uniqueID} tr:nth-of-type(even):hover`);
css.add_property('background-color', KadenceColorOutput(backgroundHoverColorEven));
} else {
css.set_selector(`.kb-table${uniqueID} tr`);
Expand All @@ -183,7 +183,9 @@ export default function BackendStyles(props) {
columnBackgrounds.forEach((background, index) => {
if (background) {
css.set_selector(
`.kb-table${uniqueID} td:nth-child(${index + 1}), .kb-table${uniqueID} th:nth-child(${index + 1})`
`.kb-table${uniqueID} td:nth-of-type(${index + 1}), .kb-table${uniqueID} th:nth-of-type(${
index + 1
})`
);
css.add_property('background-color', KadenceColorOutput(background));
}
Expand All @@ -194,7 +196,7 @@ export default function BackendStyles(props) {
columnBackgroundsHover.forEach((background, index) => {
if (background) {
css.set_selector(
`.kb-table${uniqueID} td:nth-child(${index + 1}):hover, .kb-table${uniqueID} th:nth-child(${
`.kb-table${uniqueID} td:nth-of-type(${index + 1}):hover, .kb-table${uniqueID} th:nth-of-type(${
index + 1
}):hover`
);
Expand Down

0 comments on commit 950940f

Please sign in to comment.