magdev/wc-composable-product
1
Fork 0
Code Issues Pull Requests Activity

Fix admin CSS - tabs disappeared due to overly aggressive selectors

Browse Source 
CRITICAL FIX: The previous CSS change used .show_if_composable with !important
which hid ALL elements with that class, including the tab links themselves.

Changes:
- Changed from .show_if_composable to .options_group.show_if_composable
- Changed from .product_data_tabs .composable_options to li.composable_options
- Removed !important flags (not needed with specific selectors)
- Now only hides the general tab option groups, not the tab links

This fixes:
- Missing Composable Options tab in product edit screen
- Fields appearing out of context
- Tab navigation completely broken

The issue was that WooCommerce adds 'show_if_composable' class to BOTH:
1. The tab link (li.composable_options.show_if_composable)
2. The general tab fields (div.options_group.show_if_composable)

Now we specifically target only the option groups, leaving tabs alone.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
Marco Grätsch
2025-12-31 22:16:37 +01:00
parent f763e35d19
commit 4dc7b767a8
1 changed files with 6 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
assets/css/admin.css
View File

@@ -19,29 +19,23 @@
min-height: 150px;
}
/* Hide composable-specific elements by default */
.show_if_composable {
display: none !important;
/* Hide composable-specific elements by default (but not tabs) */
.options_group.show_if_composable {
display: none;
}
/* Show composable elements when composable product type is selected */
body.product-type-composable .show_if_composable,
.product-type-composable .show_if_composable {
display: block !important;
}
/* Ensure General tab fields don't show in Composable Options panel initially */
#composable_product_data .options_group {
body.product-type-composable .options_group.show_if_composable {
display: block;
}
/* Hide the Composable Options tab link by default */
.product_data_tabs .composable_options {
.product_data_tabs li.composable_options {
display: none;
}
/* Show the Composable Options tab when composable type selected */
body.product-type-composable .product_data_tabs .composable_options {
body.product-type-composable .product_data_tabs li.composable_options {
display: block;
}