Reply To: Add to cart button change design

[wanderval]

Hi dani,

I looked the your code on codepen, but I think that you will stay more confuse if I make a modified, because I believe you have on code a loop logic for generate html, am I right? the modified is simple, but you will need take a attention to this possibility.

1- first you need get the element <i> that is the icon and put for out of element <button>, so will handler the position the elements.
2- The element parent of button it is a div they have a class called text-center, do you need put other class, because is need to leave more simple to apply a specific css commands.

this will be your structure: <div class="wrapper-card-button"><button></button><i></i>

modified css

.product-thumb {
  padding-bottom: 0;
}

.product-thumb .wrapper-card-button {
  display: flex;
}

.product-thumb .wrapper-card-button button {
  flex: 1;
}

.product-thumb .wrapper-card-button i {
  padding: 0 15px;
  background: red;
  color: #fff;
  align-items: center;
  display: flex;
  font-size: 18px;
}

https://codepen.io/wanderval/pen/KGzMqQ?editors=1100