Cart panel

The cart panel is a representation of the cart. It has a line for every product that is added, displaying the number of items, the name of the item type, the total price, and a button to remove it from the cart, as shown in the following screenshot:

We would like to add a line each time a new product is added to the cart, as shown in the following screenshot:

In this case, we do not need to modify the main layout as we are going to represent each line as a row with columns. The model of a line in the cart is shown in the following code:

case class CartLine(qty: Int, product: Product)

The HTML content of the cart is shown in the following code:

def content: Div = div(`class` := "row", id := s"cart-${product.code}-row")(
  div(`class` := "col-1")(getDeleteButton),
  div(`class` := "col-2")(getQuantityInput),
  div(`class` := "col-6")(getProductLabel),
  div(`class` := "col")(getPriceLabel)
).render

The previous code is for a row with four columns. The code for the button to delete it...