-
Notifications
You must be signed in to change notification settings - Fork 215
Fix Mini Cart Block global styles #7379 #7515
Conversation
|
The release ZIP for this PR is accessible via: |
|
Size Change: -525 B (0%) Total Size: 992 kB
ℹ️ View Unchanged
|
76a8193 to
ce17afb
Compare
Fix Mini Cart Block global styles
ce17afb to
22983da
Compare
Script Dependencies ReportThe
This comment was automatically generated by the |
danielwrobert
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@gigitux this does fix the sizing issue that occurs with the custom font size from the pattern - nice work!
However, these changes seem to introduce a regression to where the font-weight property is no longer respected on the front-end. See the following examples:
From trunk:
trunk-7515.mp4
From fix/mini-cart-hover-global-style:
fix-branch-7515.mp4
|
|
||
| .wc-block-mini-cart__amount { | ||
| font-size: inherit; | ||
| font-weight: inherit; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
If this is being hidden via the display: none; rule on the next line, does it still make sense to set the font size and weight?
| .wc-block-mini-cart__amount { | ||
| display: initial; | ||
| font-weight: 600; | ||
| font-weight: inherit; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
If the font-weight is being set in the base ruleset above, this line doesn't seem to be needed.
Although, it may make sense to declare both the font weight and size here instead, since we're adjusting the display property. What do you think?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@danielwrobert, thanks for catching this! With b838f00 should be fixed 🚀
d2a757e to
4e4508a
Compare
Aljullu
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is testing well to me and code changes look good as well. 👍
albarin
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looks good! 🚀
* Empty commit for release pull request * Added readme.txt changelog entry * Update HPOS compatibility snippet (#7395) * 8.7.2 Testing notes * Update testing notes * Update testing notes * Bumped version * Refactor force billing: remove forcedBillingAddress from conditions for showBillingFields (#7393) Co-authored-by: Niels Lange <[email protected]> * Updated testing instructions and changelog to include #7393 * Updated testing zip * Bumping version strings to new version. * Empty commit for release pull request * Fix wrong keys being sent in `canMakePayment` and customer data showing in the Checkout block in the editor (#7434) * Construct args for canMakePayment with correct keys * When the CheckoutEventsContext mounts, initialize payment store * Destructure useSelect correctly * Dispatch __internalInitializePaymentStore in selector tests * Update selector name to __internalUpdateAvailablePaymentMethods * Remove check for editor when registering checkout store * Add check for when express payment methods have updated too * Ensure billingAddress key exists in canMakePayment arg * Use editor context to know if we're in editor * Updated readme.txt * Reverted stable tag change on readme.txt * Testing instructions * Cleaned out testing instructions * Bumping version strings to new version. * Empty commit for release pull request * Testing instructions * package-lock.json version bump * Revert "Fix `useForcedLayout` to re-select inner blocks after we manually insert one (#6676)" (#7447) This reverts commit 1564de2. * Testing zip * Bumping version strings to new version. * add testing instructions * upload a new zip file * Update styles of the Filter by Attribute dropdown so it looks good in TT3 (#7506) * Use theme's body background color as the mini cart contents default background color (#7510) Co-authored-by: Albert Juhé Lluveras <[email protected]> * Price Slider: use `currentColor` for the slider (#7527) * Fixed Price Slider Issue Located where the price slider was hard coded and replaced it. * fix CSS lint * use currentColor instead of hard-coded color for the slider of the Filter By Price block #7130 use currentColor instead of hard-coded color for the slider of the Filte By Price block * use currentColor instead of hard-coded color for the slider of the Filter By Price block #7130 use currentColor instead of hard-coded color for the slider of the Filte By Price block * remove background-color Co-authored-by: EmptySet-Exe <[email protected]> Co-authored-by: Niels Lange <[email protected]> * Make price slider 'inactive' range half transparent so it looks better in dark themes (#7525) * Fix inconsistent button styling with TT3 (#7516) * fix inconsistent button styling with TT3 * use wc_wp_theme_get_element_class_name * add check to be sure that wc_wp_theme_get_element_class_name function exists * Fix Mini Cart Block global styles #7379 (#7515) * Fix Mini Cart Block global styles #7379 Fix Mini Cart Block global styles * add font_size * upload a new build Co-authored-by: github-actions <[email protected]> Co-authored-by: Paulo Arromba <[email protected]> Co-authored-by: Alex Florisca <[email protected]> Co-authored-by: Tarun Vijwani <[email protected]> Co-authored-by: Niels Lange <[email protected]> Co-authored-by: Thomas Roberts <[email protected]> Co-authored-by: Luigi <[email protected]> Co-authored-by: Albert Juhé Lluveras <[email protected]> Co-authored-by: Tung Du <[email protected]> Co-authored-by: EmptySet-Exe <[email protected]>
* Empty commit for release pull request * Calculate cart totals after running extensions (#7490) * calculate cart totals afer running extensions * update totlas call in CartUpdateCustomer * test that cart is recalcing * Update changelog in readme * Add release testing notes * Update release date in readme * Bumping version strings to new version. * update readme * Update styles of the Filter by Attribute dropdown so it looks good in TT3 (#7506) * Use theme's body background color as the mini cart contents default background color (#7510) Co-authored-by: Albert Juhé Lluveras <[email protected]> * Price Slider: use `currentColor` for the slider (#7527) * Fixed Price Slider Issue Located where the price slider was hard coded and replaced it. * fix CSS lint * use currentColor instead of hard-coded color for the slider of the Filter By Price block #7130 use currentColor instead of hard-coded color for the slider of the Filte By Price block * use currentColor instead of hard-coded color for the slider of the Filter By Price block #7130 use currentColor instead of hard-coded color for the slider of the Filte By Price block * remove background-color Co-authored-by: EmptySet-Exe <[email protected]> Co-authored-by: Niels Lange <[email protected]> * Make price slider 'inactive' range half transparent so it looks better in dark themes (#7525) * Fix inconsistent button styling with TT3 (#7516) * fix inconsistent button styling with TT3 * use wc_wp_theme_get_element_class_name * add check to be sure that wc_wp_theme_get_element_class_name function exists * Fix Mini Cart Block global styles #7379 (#7515) * Fix Mini Cart Block global styles #7379 Fix Mini Cart Block global styles * add font_size * upload a new build * Bumping version strings to new version. Co-authored-by: github-actions <[email protected]> Co-authored-by: Seghir Nadir <[email protected]> Co-authored-by: Thomas Roberts <[email protected]> Co-authored-by: Luigi <[email protected]> Co-authored-by: Albert Juhé Lluveras <[email protected]> Co-authored-by: Tung Du <[email protected]> Co-authored-by: EmptySet-Exe <[email protected]> Co-authored-by: Niels Lange <[email protected]>
* use full link for WordPress resources (#7211) Co-authored-by: Niels Lange <[email protected]> * Empty commit for release pull request * update readme * add testing instructions * add zip file link * update testing instructions and changelog entry * Bumping version strings to new version. * Empty commit for release pull request * Update styles of the Filter by Attribute dropdown so it looks good in TT3 (#7506) * Use theme's body background color as the mini cart contents default background color (#7510) Co-authored-by: Albert Juhé Lluveras <[email protected]> * Price Slider: use `currentColor` for the slider (#7527) * Fixed Price Slider Issue Located where the price slider was hard coded and replaced it. * fix CSS lint * use currentColor instead of hard-coded color for the slider of the Filter By Price block #7130 use currentColor instead of hard-coded color for the slider of the Filte By Price block * use currentColor instead of hard-coded color for the slider of the Filter By Price block #7130 use currentColor instead of hard-coded color for the slider of the Filte By Price block * remove background-color Co-authored-by: EmptySet-Exe <[email protected]> Co-authored-by: Niels Lange <[email protected]> * Make price slider 'inactive' range half transparent so it looks better in dark themes (#7525) * Fix inconsistent button styling with TT3 (#7516) * fix inconsistent button styling with TT3 * use wc_wp_theme_get_element_class_name * add check to be sure that wc_wp_theme_get_element_class_name function exists * Fix Mini Cart Block global styles #7379 (#7515) * Fix Mini Cart Block global styles #7379 Fix Mini Cart Block global styles * add font_size * Empty commit for release pull request * add changelog and testing instructions * add zip link for testing * Bumping version strings to new version. Co-authored-by: Seghir Nadir <[email protected]> Co-authored-by: Niels Lange <[email protected]> Co-authored-by: github-actions <[email protected]> Co-authored-by: Luigi <[email protected]> Co-authored-by: Albert Juhé Lluveras <[email protected]> Co-authored-by: Tung Du <[email protected]> Co-authored-by: EmptySet-Exe <[email protected]>
* Fix Mini Cart Block global styles woocommerce#7379 Fix Mini Cart Block global styles * add font_size
* Empty commit for release pull request * Added readme.txt changelog entry * Update HPOS compatibility snippet (woocommerce#7395) * 8.7.2 Testing notes * Update testing notes * Update testing notes * Bumped version * Refactor force billing: remove forcedBillingAddress from conditions for showBillingFields (woocommerce#7393) Co-authored-by: Niels Lange <[email protected]> * Updated testing instructions and changelog to include woocommerce#7393 * Updated testing zip * Bumping version strings to new version. * Empty commit for release pull request * Fix wrong keys being sent in `canMakePayment` and customer data showing in the Checkout block in the editor (woocommerce#7434) * Construct args for canMakePayment with correct keys * When the CheckoutEventsContext mounts, initialize payment store * Destructure useSelect correctly * Dispatch __internalInitializePaymentStore in selector tests * Update selector name to __internalUpdateAvailablePaymentMethods * Remove check for editor when registering checkout store * Add check for when express payment methods have updated too * Ensure billingAddress key exists in canMakePayment arg * Use editor context to know if we're in editor * Updated readme.txt * Reverted stable tag change on readme.txt * Testing instructions * Cleaned out testing instructions * Bumping version strings to new version. * Empty commit for release pull request * Testing instructions * package-lock.json version bump * Revert "Fix `useForcedLayout` to re-select inner blocks after we manually insert one (woocommerce#6676)" (woocommerce#7447) This reverts commit 1564de2. * Testing zip * Bumping version strings to new version. * add testing instructions * upload a new zip file * Update styles of the Filter by Attribute dropdown so it looks good in TT3 (woocommerce#7506) * Use theme's body background color as the mini cart contents default background color (woocommerce#7510) Co-authored-by: Albert Juhé Lluveras <[email protected]> * Price Slider: use `currentColor` for the slider (woocommerce#7527) * Fixed Price Slider Issue Located where the price slider was hard coded and replaced it. * fix CSS lint * use currentColor instead of hard-coded color for the slider of the Filter By Price block woocommerce#7130 use currentColor instead of hard-coded color for the slider of the Filte By Price block * use currentColor instead of hard-coded color for the slider of the Filter By Price block woocommerce#7130 use currentColor instead of hard-coded color for the slider of the Filte By Price block * remove background-color Co-authored-by: EmptySet-Exe <[email protected]> Co-authored-by: Niels Lange <[email protected]> * Make price slider 'inactive' range half transparent so it looks better in dark themes (woocommerce#7525) * Fix inconsistent button styling with TT3 (woocommerce#7516) * fix inconsistent button styling with TT3 * use wc_wp_theme_get_element_class_name * add check to be sure that wc_wp_theme_get_element_class_name function exists * Fix Mini Cart Block global styles woocommerce#7379 (woocommerce#7515) * Fix Mini Cart Block global styles woocommerce#7379 Fix Mini Cart Block global styles * add font_size * upload a new build Co-authored-by: github-actions <[email protected]> Co-authored-by: Paulo Arromba <[email protected]> Co-authored-by: Alex Florisca <[email protected]> Co-authored-by: Tarun Vijwani <[email protected]> Co-authored-by: Niels Lange <[email protected]> Co-authored-by: Thomas Roberts <[email protected]> Co-authored-by: Luigi <[email protected]> Co-authored-by: Albert Juhé Lluveras <[email protected]> Co-authored-by: Tung Du <[email protected]> Co-authored-by: EmptySet-Exe <[email protected]>
* use full link for WordPress resources (woocommerce#7211) Co-authored-by: Niels Lange <[email protected]> * Empty commit for release pull request * update readme * add testing instructions * add zip file link * update testing instructions and changelog entry * Bumping version strings to new version. * Empty commit for release pull request * Update styles of the Filter by Attribute dropdown so it looks good in TT3 (woocommerce#7506) * Use theme's body background color as the mini cart contents default background color (woocommerce#7510) Co-authored-by: Albert Juhé Lluveras <[email protected]> * Price Slider: use `currentColor` for the slider (woocommerce#7527) * Fixed Price Slider Issue Located where the price slider was hard coded and replaced it. * fix CSS lint * use currentColor instead of hard-coded color for the slider of the Filter By Price block woocommerce#7130 use currentColor instead of hard-coded color for the slider of the Filte By Price block * use currentColor instead of hard-coded color for the slider of the Filter By Price block woocommerce#7130 use currentColor instead of hard-coded color for the slider of the Filte By Price block * remove background-color Co-authored-by: EmptySet-Exe <[email protected]> Co-authored-by: Niels Lange <[email protected]> * Make price slider 'inactive' range half transparent so it looks better in dark themes (woocommerce#7525) * Fix inconsistent button styling with TT3 (woocommerce#7516) * fix inconsistent button styling with TT3 * use wc_wp_theme_get_element_class_name * add check to be sure that wc_wp_theme_get_element_class_name function exists * Fix Mini Cart Block global styles woocommerce#7379 (woocommerce#7515) * Fix Mini Cart Block global styles woocommerce#7379 Fix Mini Cart Block global styles * add font_size * Empty commit for release pull request * add changelog and testing instructions * add zip link for testing * Bumping version strings to new version. Co-authored-by: Seghir Nadir <[email protected]> Co-authored-by: Niels Lange <[email protected]> Co-authored-by: github-actions <[email protected]> Co-authored-by: Luigi <[email protected]> Co-authored-by: Albert Juhé Lluveras <[email protected]> Co-authored-by: Tung Du <[email protected]> Co-authored-by: EmptySet-Exe <[email protected]>
* Empty commit for release pull request * Calculate cart totals after running extensions (woocommerce#7490) * calculate cart totals afer running extensions * update totlas call in CartUpdateCustomer * test that cart is recalcing * Update changelog in readme * Add release testing notes * Update release date in readme * Bumping version strings to new version. * update readme * Update styles of the Filter by Attribute dropdown so it looks good in TT3 (woocommerce#7506) * Use theme's body background color as the mini cart contents default background color (woocommerce#7510) Co-authored-by: Albert Juhé Lluveras <[email protected]> * Price Slider: use `currentColor` for the slider (woocommerce#7527) * Fixed Price Slider Issue Located where the price slider was hard coded and replaced it. * fix CSS lint * use currentColor instead of hard-coded color for the slider of the Filter By Price block woocommerce#7130 use currentColor instead of hard-coded color for the slider of the Filte By Price block * use currentColor instead of hard-coded color for the slider of the Filter By Price block woocommerce#7130 use currentColor instead of hard-coded color for the slider of the Filte By Price block * remove background-color Co-authored-by: EmptySet-Exe <[email protected]> Co-authored-by: Niels Lange <[email protected]> * Make price slider 'inactive' range half transparent so it looks better in dark themes (woocommerce#7525) * Fix inconsistent button styling with TT3 (woocommerce#7516) * fix inconsistent button styling with TT3 * use wc_wp_theme_get_element_class_name * add check to be sure that wc_wp_theme_get_element_class_name function exists * Fix Mini Cart Block global styles woocommerce#7379 (woocommerce#7515) * Fix Mini Cart Block global styles woocommerce#7379 Fix Mini Cart Block global styles * add font_size * upload a new build * Bumping version strings to new version. Co-authored-by: github-actions <[email protected]> Co-authored-by: Seghir Nadir <[email protected]> Co-authored-by: Thomas Roberts <[email protected]> Co-authored-by: Luigi <[email protected]> Co-authored-by: Albert Juhé Lluveras <[email protected]> Co-authored-by: Tung Du <[email protected]> Co-authored-by: EmptySet-Exe <[email protected]> Co-authored-by: Niels Lange <[email protected]>
* use full link for WordPress resources (woocommerce#7211) Co-authored-by: Niels Lange <[email protected]> * Empty commit for release pull request * update readme * add testing instructions * add zip file link * update testing instructions and changelog entry * Bumping version strings to new version. * Empty commit for release pull request * Update styles of the Filter by Attribute dropdown so it looks good in TT3 (woocommerce#7506) * Use theme's body background color as the mini cart contents default background color (woocommerce#7510) Co-authored-by: Albert Juhé Lluveras <[email protected]> * Price Slider: use `currentColor` for the slider (woocommerce#7527) * Fixed Price Slider Issue Located where the price slider was hard coded and replaced it. * fix CSS lint * use currentColor instead of hard-coded color for the slider of the Filter By Price block woocommerce#7130 use currentColor instead of hard-coded color for the slider of the Filte By Price block * use currentColor instead of hard-coded color for the slider of the Filter By Price block woocommerce#7130 use currentColor instead of hard-coded color for the slider of the Filte By Price block * remove background-color Co-authored-by: EmptySet-Exe <[email protected]> Co-authored-by: Niels Lange <[email protected]> * Make price slider 'inactive' range half transparent so it looks better in dark themes (woocommerce#7525) * Fix inconsistent button styling with TT3 (woocommerce#7516) * fix inconsistent button styling with TT3 * use wc_wp_theme_get_element_class_name * add check to be sure that wc_wp_theme_get_element_class_name function exists * Fix Mini Cart Block global styles woocommerce#7379 (woocommerce#7515) * Fix Mini Cart Block global styles woocommerce#7379 Fix Mini Cart Block global styles * add font_size * Empty commit for release pull request * add changelog and testing instructions * add zip link for testing * Bumping version strings to new version. Co-authored-by: Seghir Nadir <[email protected]> Co-authored-by: Niels Lange <[email protected]> Co-authored-by: github-actions <[email protected]> Co-authored-by: Luigi <[email protected]> Co-authored-by: Albert Juhé Lluveras <[email protected]> Co-authored-by: Tung Du <[email protected]> Co-authored-by: EmptySet-Exe <[email protected]>
* use full link for WordPress resources (woocommerce#7211) Co-authored-by: Niels Lange <[email protected]> * Empty commit for release pull request * update readme * add testing instructions * add zip file link * update testing instructions and changelog entry * Bumping version strings to new version. * Empty commit for release pull request * Update styles of the Filter by Attribute dropdown so it looks good in TT3 (woocommerce#7506) * Use theme's body background color as the mini cart contents default background color (woocommerce#7510) Co-authored-by: Albert Juhé Lluveras <[email protected]> * Price Slider: use `currentColor` for the slider (woocommerce#7527) * Fixed Price Slider Issue Located where the price slider was hard coded and replaced it. * fix CSS lint * use currentColor instead of hard-coded color for the slider of the Filter By Price block woocommerce#7130 use currentColor instead of hard-coded color for the slider of the Filte By Price block * use currentColor instead of hard-coded color for the slider of the Filter By Price block woocommerce#7130 use currentColor instead of hard-coded color for the slider of the Filte By Price block * remove background-color Co-authored-by: EmptySet-Exe <[email protected]> Co-authored-by: Niels Lange <[email protected]> * Make price slider 'inactive' range half transparent so it looks better in dark themes (woocommerce#7525) * Fix inconsistent button styling with TT3 (woocommerce#7516) * fix inconsistent button styling with TT3 * use wc_wp_theme_get_element_class_name * add check to be sure that wc_wp_theme_get_element_class_name function exists * Fix Mini Cart Block global styles woocommerce#7379 (woocommerce#7515) * Fix Mini Cart Block global styles woocommerce#7379 Fix Mini Cart Block global styles * add font_size * Empty commit for release pull request * add changelog and testing instructions * add zip link for testing * Bumping version strings to new version. Co-authored-by: Seghir Nadir <[email protected]> Co-authored-by: Niels Lange <[email protected]> Co-authored-by: github-actions <[email protected]> Co-authored-by: Luigi <[email protected]> Co-authored-by: Albert Juhé Lluveras <[email protected]> Co-authored-by: Tung Du <[email protected]> Co-authored-by: EmptySet-Exe <[email protected]>
* Empty commit for release pull request * Added readme.txt changelog entry * Update HPOS compatibility snippet (#7395) * 8.7.2 Testing notes * Update testing notes * Update testing notes * Bumped version * Refactor force billing: remove forcedBillingAddress from conditions for showBillingFields (#7393) Co-authored-by: Niels Lange <[email protected]> * Updated testing instructions and changelog to include #7393 * Updated testing zip * Bumping version strings to new version. * Empty commit for release pull request * Fix wrong keys being sent in `canMakePayment` and customer data showing in the Checkout block in the editor (#7434) * Construct args for canMakePayment with correct keys * When the CheckoutEventsContext mounts, initialize payment store * Destructure useSelect correctly * Dispatch __internalInitializePaymentStore in selector tests * Update selector name to __internalUpdateAvailablePaymentMethods * Remove check for editor when registering checkout store * Add check for when express payment methods have updated too * Ensure billingAddress key exists in canMakePayment arg * Use editor context to know if we're in editor * Updated readme.txt * Reverted stable tag change on readme.txt * Testing instructions * Cleaned out testing instructions * Bumping version strings to new version. * Empty commit for release pull request * Testing instructions * package-lock.json version bump * Revert "Fix `useForcedLayout` to re-select inner blocks after we manually insert one (#6676)" (#7447) This reverts commit 1564de2. * Testing zip * Bumping version strings to new version. * add testing instructions * upload a new zip file * Update styles of the Filter by Attribute dropdown so it looks good in TT3 (#7506) * Use theme's body background color as the mini cart contents default background color (#7510) Co-authored-by: Albert Juhé Lluveras <[email protected]> * Price Slider: use `currentColor` for the slider (#7527) * Fixed Price Slider Issue Located where the price slider was hard coded and replaced it. * fix CSS lint * use currentColor instead of hard-coded color for the slider of the Filter By Price block #7130 use currentColor instead of hard-coded color for the slider of the Filte By Price block * use currentColor instead of hard-coded color for the slider of the Filter By Price block #7130 use currentColor instead of hard-coded color for the slider of the Filte By Price block * remove background-color Co-authored-by: EmptySet-Exe <[email protected]> Co-authored-by: Niels Lange <[email protected]> * Make price slider 'inactive' range half transparent so it looks better in dark themes (#7525) * Fix inconsistent button styling with TT3 (#7516) * fix inconsistent button styling with TT3 * use wc_wp_theme_get_element_class_name * add check to be sure that wc_wp_theme_get_element_class_name function exists * Fix Mini Cart Block global styles #7379 (#7515) * Fix Mini Cart Block global styles #7379 Fix Mini Cart Block global styles * add font_size * upload a new build * Bumping version strings to new version. * update changelog * Empty commit for release pull request * add testing instructions * update zip file link * Prevent Mini Cart loading the same script twice (#7794) Co-authored-by: github-actions <[email protected]> Co-authored-by: Paulo Arromba <[email protected]> Co-authored-by: Alex Florisca <[email protected]> Co-authored-by: Tarun Vijwani <[email protected]> Co-authored-by: Niels Lange <[email protected]> Co-authored-by: Thomas Roberts <[email protected]> Co-authored-by: Luigi <[email protected]> Co-authored-by: Albert Juhé Lluveras <[email protected]> Co-authored-by: Tung Du <[email protected]> Co-authored-by: EmptySet-Exe <[email protected]>
This PR fixes #7379. I noticed that we applied the global styles to the inner div (
wc-block-mini-cart__amount), while we should apply the styles to the parent and inherit them. Cc'ing @danielwrobert, that worked on this, maybe I'm missing something.User Facing Testing
WooCommerce Essential Header | Lightpattern.WooCommerce Visibility
Performance Impact
Changelog