Skip to content
This repository has been archived by the owner on Feb 23, 2024. It is now read-only.

Remove extra padding for cart sidebar #5430

Merged
merged 1 commit into from
Jan 13, 2022
Merged

Remove extra padding for cart sidebar #5430

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 0 additions & 7 deletions assets/js/blocks/cart-checkout/cart/style.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -238,13 +238,6 @@ table.wc-block-cart-items {
}
}

.wc-block-cart__sidebar {
& > div:not(.wc-block-components-totals-wrapper) {
Copy link
Contributor

@ralucaStan ralucaStan Jan 13, 2022 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In the Cart block, there is no direct child with class .wc-block-components-totals-wrapper in .wc-block-cart__sidebar. But there is in the Checkout block. So I think this is a leftover code somehow.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I can see .wc-block-components-totals-wrapper in both checkout and cart. This solution isn't bullet proof though because at a certain width, the browser will decide to wrap the input element and the button. The ideal solution would be to set flex-wrap: no-wrap on the .wc-points-rewards-redeem-form element but that needs to be done in the points and rewards app.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I can see .wc-block-components-totals-wrapper in both checkout and cart.

Yes, that is correct, but in the Cart is never a direct child of wc-block-cart__sidebar, like the selector here targets >. And it is a direct child in Checkout. That's why I think this could have been a common style at one point.

Exactly, setting flex-wrap: nowrap on the .wc-points-rewards-redeem-form fixes the issue if they always want to have them on the same line. With the current code, flex-wrap: wrap they actually say, hey go on another line if there is not enough space. But they don't have any styling in place for this case, like vertically spacing the button and so on.

We can actually open a ticket on their side.

margin-left: $gap;
margin-right: $gap;
}
}

.wc-block-components-radio-control__input {
left: 0;
}
Expand Down