You've already forked wc-tier-and-package-prices
magdev
e5aca708cc
Fixed both critical issues that were not resolved in v1.2.6: 1. Variable Product Forms Still Not Showing (Critical) - v1.2.6 used wrong hook (woocommerce_product_options_pricing) - That hook only fires for simple products, not variable products - Changed to woocommerce_product_options_general_product_data - This hook fires for all product types after general tab - Forms now appear correctly for variable product parents 2. Table Headers Still Visible When Empty (Critical) - CSS :has() pseudo-class wasn't working reliably - Implemented JavaScript + CSS class approach instead - Added updateTableHeaders() function that toggles has-rows class - Headers hide by default, show only when table has rows - Function called on page load and after all add/remove operations - Works across all browsers without modern CSS requirements Changed files: - includes/class-wc-tpp-product-meta.php - Fixed WooCommerce hook - assets/css/admin.css - Class-based header visibility - assets/js/admin.js - Added updateTableHeaders() and parent handlers 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
157 lines
3.5 KiB
CSS
157 lines
3.5 KiB
CSS
/**
|
|
* Admin styles for WooCommerce Tier and Package Prices
|
|
*/
|
|
|
|
.wc-tpp-tier-pricing,
|
|
.wc-tpp-package-pricing {
|
|
border-top: 1px solid #eee;
|
|
padding-top: 15px;
|
|
margin-top: 15px;
|
|
}
|
|
|
|
.wc-tpp-tier-pricing > p:first-child,
|
|
.wc-tpp-package-pricing > p:first-child {
|
|
font-weight: 600;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.wc-tpp-tier-pricing .description,
|
|
.wc-tpp-package-pricing .description {
|
|
display: block;
|
|
margin-top: 5px;
|
|
font-style: italic;
|
|
color: #666;
|
|
}
|
|
|
|
/* Table styling - borderless design for all tier/package tables */
|
|
.wc-tpp-tiers-table,
|
|
.wc-tpp-packages-table {
|
|
margin-top: 15px;
|
|
margin-bottom: 15px;
|
|
border: none !important;
|
|
border-collapse: collapse !important;
|
|
}
|
|
|
|
.wc-tpp-tiers-table th,
|
|
.wc-tpp-packages-table th,
|
|
.wc-tpp-tiers-table td,
|
|
.wc-tpp-packages-table td {
|
|
border: none !important;
|
|
}
|
|
|
|
.wc-tpp-tiers-table th {
|
|
font-weight: 600;
|
|
text-align: left;
|
|
}
|
|
|
|
.wc-tpp-packages-table th {
|
|
font-weight: 600;
|
|
text-align: left;
|
|
}
|
|
|
|
.wc-tpp-tiers-table thead,
|
|
.wc-tpp-packages-table thead,
|
|
.wc-tpp-tiers-table tbody,
|
|
.wc-tpp-packages-table tbody,
|
|
.wc-tpp-tiers-table tr,
|
|
.wc-tpp-packages-table tr {
|
|
border: none !important;
|
|
}
|
|
|
|
/* Table row styling - rows are now <tr> elements in a table */
|
|
.wc-tpp-tier-row,
|
|
.wc-tpp-package-row {
|
|
/* No special styling needed - standard table row */
|
|
}
|
|
|
|
.wc-tpp-tier-row td,
|
|
.wc-tpp-package-row td {
|
|
padding: 8px;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
/* Ensure WooCommerce input classes work properly in table cells */
|
|
.wc-tpp-tier-row input,
|
|
.wc-tpp-package-row input {
|
|
margin: 0;
|
|
}
|
|
|
|
.wc-tpp-remove-tier,
|
|
.wc-tpp-remove-package {
|
|
color: #b32d2e;
|
|
border-color: #b32d2e;
|
|
}
|
|
|
|
.wc-tpp-remove-tier:hover,
|
|
.wc-tpp-remove-package:hover {
|
|
background: #b32d2e;
|
|
color: #fff;
|
|
}
|
|
|
|
.wc-tpp-add-tier,
|
|
.wc-tpp-add-package {
|
|
margin-top: 10px;
|
|
}
|
|
|
|
.wc-tpp-tiers-container,
|
|
.wc-tpp-packages-container {
|
|
margin-bottom: 15px;
|
|
}
|
|
|
|
.wc-tpp-tiers-container:empty::before,
|
|
.wc-tpp-packages-container:empty::before {
|
|
content: "No items added yet. Click 'Add' button to create pricing rules.";
|
|
display: block;
|
|
padding: 20px;
|
|
background: #f0f0f1;
|
|
border: 1px dashed #ccc;
|
|
border-radius: 4px;
|
|
text-align: center;
|
|
color: #666;
|
|
font-style: italic;
|
|
}
|
|
|
|
/* Hide table headers when there are no pricing rules */
|
|
/* Default: hide headers initially, JavaScript will show them when rows are added */
|
|
.wc-tpp-tiers-table thead,
|
|
.wc-tpp-packages-table thead {
|
|
display: none;
|
|
}
|
|
|
|
/* Show headers when table has pricing rows */
|
|
.wc-tpp-tiers-table.has-rows thead,
|
|
.wc-tpp-packages-table.has-rows thead {
|
|
display: table-header-group !important;
|
|
}
|
|
|
|
/* Checkbox styling improvements */
|
|
#_wc_tpp_restrict_to_packages,
|
|
input[id^="wc_tpp_restrict_to_packages_"] {
|
|
margin-right: 12px !important;
|
|
}
|
|
|
|
/* Position help tip icon right next to the label text */
|
|
.wc-tpp-tier-pricing .woocommerce-help-tip,
|
|
.wc-tpp-package-pricing .woocommerce-help-tip,
|
|
.wc-tpp-variation-pricing .woocommerce-help-tip {
|
|
margin-left: 6px;
|
|
margin-right: 0;
|
|
float: none;
|
|
display: inline-block;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
/* Fix WooCommerce checkbox label layout for our checkboxes */
|
|
label[for="_wc_tpp_restrict_to_packages"],
|
|
label[for^="wc_tpp_restrict_to_packages_"] {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 0;
|
|
}
|
|
|
|
/* Hide inline description text when tooltip is shown */
|
|
#_wc_tpp_restrict_to_packages + .description,
|
|
input[id^="wc_tpp_restrict_to_packages_"] + .description {
|
|
display: none;
|
|
}
|