Ensure the remove icon shows properly on smaller screens when using the Twenty Twenty One theme #37859
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Submission Review Guidelines:
Changes proposed in this Pull Request:
As reported in #32023, when using the Twenty Twenty One theme on smaller screens (less than 768px), when multiple products are in the cart, the remove icon does not properly show on every other item (so the 1st, 3rd, 5th, etc).
The issue here is we apply a custom CSS filter to each
tdelement that gives us the alternating background colors. This ends up overlapping with the remove icon and in essence, hides it. This PR fixes this by adding az-indexandpositionargument to the close icon.Closes #32023
Screenshots
How to test the changes in this Pull Request: