Как верстается данная карточка?

<div class="goods-count">
   <span class="amount">
         <span class="down">-</span>
         <input type="text" class="counter" value="1 шт." data-price="375" data-count="1"/>
        <span class="up">+</span>
    </span>
</div>

$('.goods').on('click', function(evt) {
        var elem = evt.target;
        var container = evt.currentTarget;
        var input = container.getElementsByClassName('counter')[0];
        var sum = container.getElementsByClassName('sum')[0];
        var count = parseInt(input.getAttribute('data-count'), 10);
        var price = parseInt(input.getAttribute('data-price'), 10);
        
    	if (elem.classList.contains('down')) {
        	count = count == 1 ? count : (count - 1);
        } else if (elem.classList.contains('up')){
        	count += 1;
        }
        console.log(count)
        input.value = count + ' шт.';
        sum.innerHTML = price * count;
        input.setAttribute('data-count', count);
    });