Изменения Для Корзины

Добрый день! Можно сделать корзину как здесь http://freede.ru/kod...t-magazina.html

DEMO BOXES

Stas_Y (28 Август 2015 - 12:52) писал:

Здравствуйте.
Да, корзину для вашего интернет-магазина подобного типа возможно сделать, однако на это потребуется не мало времени.
Если вы хотите чтобы с данным вопросом вам помогала наша техническая поддержка, то вам необходимо написать нам в обратную связь письмо с подробным описанием того как вы хотите чтобы выглядела корзина вашего сайта и так же приложить скриншот, что имеется здесь и добавить пометку - для платной технической поддержки, так как только данный специалист сможет заняться подобным вопросом.
После отправки вами письма - вам в скором времени ответит наш специалист, с которым вы сможете обсудить стоимость и сроки выполнения данной работы.

В main.css найдите:

/* Корзина */
.header-top .mini-cartpro {position: relative;}
.header-top .mini-cartpro .block-title {background-image: url('{ASSETS_IMAGES_PATH}ico-cart.png?design=orange');background-repeat: no-repeat;background-position: 15px 12px;background-color: #f79242;padding: 18px 18px 12px 50px;color: #fff;height: 50px;margin-left: 1px;}
.header-top .mini-cartpro .block-title:hover {background-color: rgba(247,146,66,.7);}
.header-top .mini-cartpro .block-title .btn-cart-emty, .header-top .mini-cartpro .block-title a.btn-toggle {font-size: 0;z-index: 1;top: 0;right: 0;position: absolute;width: 100%;height: 50px;}
.header-top .mini-cartpro .block-title a {color: #fff;font-size:120%;}
.header-top .mini-cartpro .block-content .block-inner {position: absolute;top: 50px;right: 0;z-index: 999;overflow: hidden !important;background: #FFF;width: 360px;border-top: 6px solid transparent;border-color: #f79242;transition-property: margin-top, opacity, visibility;transition-duration: 0.5s, 0.5s, 0.5s;-webkit-transition-property: margin-top, opacity, visibility;-webkit-transition-duration: 0.5s, 0.5s, 0.5s;opacity: 0;visibility: hidden;}
.header-top .sm-cartpro:hover .block-content .block-inner {display:block;height:auto;opacity: 1;visibility: visible;}
.header-top .mini-cartpro .block-content .mini-products-list {padding: 20px 10px;max-height: 370px;overflow-y: auto;list-style: none;overflow-x:hidden;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item {margin-bottom: 30px;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item:last-child {margin-bottom: 10px;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item .product-image {float: left;margin-right: 10px;padding: 5px;height:85px;width:85px;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item .product-image img {display:block;margin:0 auto;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item .product-details {float: left;width: 67%;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item a.product-name {font-size: 116.6%;line-height: 12px;display:block;height:25px;overflow:hidden;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item a.product-name :hover {color: #f79242;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item .price {font-size: 150%;display: block;padding: 7px 0;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item .title-qty {float:left;font-size:110%;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item .qty-val {border-radius: 100%;-moz-border-radius: 100%;khtml-border-radius: 100%;-webkit-border-radius: 100%;width: 38px;height: 38px;border: 1px solid #e4e4e4;display: inline-block;text-align: center;line-height: 38px;font-size: 116.6%;}
.header-top .mini-cartpro .block-content .mini-products-list li.cart-item a.product-remove {background-image: url('{ASSETS_IMAGES_PATH}ico-edit-remove.png?design=orange');background-repeat: no-repeat;background-position: 0 -92px;display: block;width: 17px;height: 17px;float: right;}
.header-top .mini-cartpro .block-content .mini-products-list li.cart-item a.product-remove:hover {background-position: 0 -61px;}
.header-top .mini-cartpro .block-content .bottom-action {height: 67px;padding: 15px 0 0 10px;background-color: #f79242;}
.header-top .mini-cartpro .block-content .bottom-action .button {width: 38px;height: 38px;border-radius: 100%;-moz-border-radius: 100%;khtml-border-radius: 100%;-webkit-border-radius: 100%;background-color: #fff;background-repeat: no-repeat;float:left;margin-right:15px;}
.header-top .mini-cartpro .block-content .bottom-action .button.btn-gotocart:after {content: "\f014";font-family: 'FontAwesome';font-size: 28px;color: #E1464D;margin-left: -11px;top: 4px;position: relative;}
.header-top .mini-cartpro .block-content .bottom-action .button.btn-gotocart:hover {background-color: #f79242;box-shadow: 0 0 0 2px #fff;-webkit-box-shadow: 0 0 0 2px #fff;-moz-box-shadow: 0 0 0 2px #fff;}
.header-top .mini-cartpro .block-content .bottom-action .button.btn-gotocart:hover:after  {color: #fff;}
.header-top .mini-cartpro .block-content .bottom-action .button.btn-checkout {background-image: url('{ASSETS_IMAGES_PATH}minicart-action.png?design=orange');background-position: 4px -41px;}
.header-top .mini-cartpro .block-content .bottom-action .button.btn-checkout:hover {background-position: 4px 4px;background-color: #f79242;box-shadow: 0 0 0 2px #fff;-webkit-box-shadow: 0 0 0 2px #fff;-moz-box-shadow: 0 0 0 2px #fff;}
.header-top .mini-cartpro .block-content .summary {float: right;line-height: 38px;margin-right: 10px;}
.header-top .mini-cartpro .block-content .summary .subtotal {color: #fff;font-size: 150%;}

замените на:

/* Корзина */
.header-top .mini-cartpro {position: relative;}
.header-top .mini-cartpro .block-title {background-image: url('{ASSETS_IMAGES_PATH}ico-cart.png?design=orange');background-repeat: no-repeat;background-position: 15px 12px;background-color: #f79242;padding: 18px 18px 12px 50px;color: #fff;height: 50px;margin-left: 1px;}
.header-top .mini-cartpro .block-title:hover {background-color: rgba(247,146,66,.7);}
.header-top .mini-cartpro .block-title .btn-cart-emty, .header-top .mini-cartpro .block-title a.btn-toggle {font-size: 0;z-index: 1;top: 0;right: 0;position: absolute;width: 100%;height: 50px;}
.header-top .mini-cartpro .block-title a {color: #fff;font-size:120%;}
.header-top .mini-cartpro .block-content .block-inner {position: absolute;top: 50px;right: 0;z-index: 999;overflow: hidden !important;background: #FFF;width: 560px;border-top: 6px solid transparent;border-color: #f79242;transition-property: margin-top, opacity, visibility;transition-duration: 0.5s, 0.5s, 0.5s;-webkit-transition-property: margin-top, opacity, visibility;-webkit-transition-duration: 0.5s, 0.5s, 0.5s;opacity: 0;visibility: hidden;}
.header-top .sm-cartpro:hover .block-content .block-inner {display:block;height:auto;opacity: 1;visibility: visible;}
.header-top .mini-cartpro .block-content .mini-products-list {padding: 20px 10px;max-height: 370px;overflow-y: auto;list-style: none;overflow-x:hidden;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item {
	margin-bottom: 30px;
	display: inline-block;
	width: 170px;
	padding: 10px;
	position:relative;
}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item {
   background:#CF505E;
}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item:nth-child(2n) {
   background:#FA7D3E;
}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item:last-child {margin-bottom: 10px;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item .product-image {float: none;margin-right: 10px;padding: 5px;height:85px;width:85px;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item .product-image img {display:block;margin:0 auto;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item .product-details {float: left;width: 67%;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item a.product-name {color:#fff;font-size: 116.6%;line-height: 12px;display:block;height:25px;overflow:hidden;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item a.product-name :hover {color: #f79242;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item .price {color: #fff;font-size: 150%;display: block;padding: 7px 0;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item .title-qty {float:left;font-size:110%;color:#fff;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item .qty-val {border-radius: 100%;-moz-border-radius: 100%;khtml-border-radius: 100%;-webkit-border-radius: 100%;width: 38px;height: 38px;border: 1px solid #e4e4e4;display: inline-block;text-align: center;line-height: 38px;font-size: 116.6%;}
.header-top .mini-cartpro .block-content .mini-products-list li.cart-item a.product-remove {position: absolute; top: 5px; right: 5px;background-image: url('{ASSETS_IMAGES_PATH}ico-edit-remove.png?design=orange');background-repeat: no-repeat;background-position: 0 -92px;display: block;width: 17px;height: 17px;float: right;}
.header-top .mini-cartpro .block-content .mini-products-list li.cart-item a.product-remove:hover {background-position: 0 -61px;}
.header-top .mini-cartpro .block-content .bottom-action {
	height: 223px;
	padding: 15px 0px 0px 10px;
	background-color: #F79242;
	float: right;
}
.header-top .mini-cartpro .block-content .bottom-action .button {width: 38px;height: 38px;border-radius: 100%;-moz-border-radius: 100%;khtml-border-radius: 100%;-webkit-border-radius: 100%;background-color: #fff;background-repeat: no-repeat;float:left;margin-right:15px;}
.header-top .mini-cartpro .block-content .bottom-action .button.btn-gotocart:after {content: "\f014";font-family: 'FontAwesome';font-size: 28px;color: #E1464D;margin-left: -11px;top: 4px;position: relative;}
.header-top .mini-cartpro .block-content .bottom-action .button.btn-gotocart:hover {background-color: #f79242;box-shadow: 0 0 0 2px #fff;-webkit-box-shadow: 0 0 0 2px #fff;-moz-box-shadow: 0 0 0 2px #fff;}
.header-top .mini-cartpro .block-content .bottom-action .button.btn-gotocart:hover:after  {color: #fff;}
.header-top .mini-cartpro .block-content .bottom-action .button.btn-checkout {background-image: url('{ASSETS_IMAGES_PATH}minicart-action.png?design=orange');background-position: 4px -41px;}
.header-top .mini-cartpro .block-content .bottom-action .button.btn-checkout:hover {background-position: 4px 4px;background-color: #f79242;box-shadow: 0 0 0 2px #fff;-webkit-box-shadow: 0 0 0 2px #fff;-moz-box-shadow: 0 0 0 2px #fff;}
.header-top .mini-cartpro .block-content .summary {float: right;line-height: 38px;margin-right: 10px;}
.header-top .mini-cartpro .block-content .summary .subtotal {color: #fff;font-size: 150%;}

В шаблоне HTML найдите:

<!-- Выпадающая корзина-->
				  <div class="block-content dropdown-cart" {% IF MOD_LNAME = cart %}style="display:none;"{% ENDIF %}>
					<div class="block-inner" {% IF cart_count_empty %}style="display:none;"{% ENDIF %}>
					  <ul id="cart-sidebar" class="mini-products-list">
						{% FOR cart_items %}
						<li class="cart-item">
						  <a href="{cart_items.GOODS_URL}" title="{cart_items.GOODS_NAME}" class="product-image"><img src="{% IF cart_items.GOODS_IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-icon.png?design=orange{% ELSE %}{cart_items.GOODS_IMAGE_ICON}{% ENDIF %}" alt="{cart_items.GOODS_NAME}" class="goods-image-icon"></a>
						  <a href="{cart_items.GOODS_URL}" class="product-name">{cart_items.GOODS_NAME}</a>
						  <span class="price" data-price="{cart_items.GOODS_MOD_PRICE_NOW}">{cart_items.GOODS_MOD_PRICE_NOW | money_format}</span>
						  <span class="title-qty">Количество: <span class="qty-val">{cart_items.ORDER_LINE_QUANTITY}</span></span>
						  <a data-href="{cart_items.ORDER_LINE_DELETE_URL}" data-count="{cart_items.ORDER_LINE_QUANTITY}" title="Удалить позицию" class="product-remove"></a>
						</li>
						{% ENDFOR %}
					  </ul>
					  <div class="bottom-action actions">
						<a class="button btn-gotocart remove-products" title="Очистить корзину" data-href="{CART_TRUNCATE_URL}"></a>
						<a class="button btn-checkout" title="Перейти к оформлению заказа" href="{CART_URL}"></a>
						<div class="summary">
						  {% FOR cart_sum %}
						  <span class="subtotal">
							<span class="label-total">Итого:</span> <span class="total-sum">{cart_sum.NOW_WITH_DELIVERY_AND_DISCOUNT | money_format}</span>
						  </span>
						  {% ENDFOR %}
						</div>
					  </div>
					</div>
				  </div>
				  <!-- /END Выпадающая корзина-->

замените на:

<!-- Выпадающая корзина-->
				  <div class="block-content dropdown-cart" {% IF MOD_LNAME = cart %}style="display:none;"{% ENDIF %}>
					<div class="block-inner" {% IF cart_count_empty %}style="display:none;"{% ENDIF %}>
					  <ul id="cart-sidebar" class="mini-products-list">
						{% FOR cart_items %}
						<li class="cart-item">
						  <a href="{cart_items.GOODS_URL}" title="{cart_items.GOODS_NAME}" class="product-image"><img src="{% IF cart_items.GOODS_IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-icon.png?design=orange{% ELSE %}{cart_items.GOODS_IMAGE_ICON}{% ENDIF %}" alt="{cart_items.GOODS_NAME}" class="goods-image-icon"></a>
						  <a href="{cart_items.GOODS_URL}" class="product-name">{cart_items.GOODS_NAME}</a>
						  <span class="price" data-price="{cart_items.GOODS_MOD_PRICE_NOW}">{cart_items.GOODS_MOD_PRICE_NOW | money_format}</span>
						  <span class="title-qty">Количество: <span class="qty-val">{cart_items.ORDER_LINE_QUANTITY}</span></span>
						  <a data-href="{cart_items.ORDER_LINE_DELETE_URL}" data-count="{cart_items.ORDER_LINE_QUANTITY}" title="Удалить позицию" class="product-remove"></a>
						</li>
						{% ENDFOR %}
	  <li class="bottom-action actions cart-item">
						<a class="button btn-gotocart remove-products" title="Очистить корзину" data-href="{CART_TRUNCATE_URL}"></a>
						<a class="button btn-checkout" title="Перейти к оформлению заказа" href="{CART_URL}"></a>
						<div class="summary">
						  {% FOR cart_sum %}
						  <span class="subtotal">
							<span class="label-total">Итого:</span> <span class="total-sum">{cart_sum.NOW_WITH_DELIVERY_AND_DISCOUNT | money_format}</span>
						  </span>
						  {% ENDFOR %}
						</div>
					  </li>
					  </ul>
					</div>
				  </div>
				  <!-- /END Выпадающая корзина-->

ОТЛИЧНО! ПРОСТО ОТЛИЧНО! Все встало с первого раза)))

Осталось подредактировать:
1) Иконки товара подвинуть к линии
2) Блок где иконки корзина и цена подвинуть выше
3) Сократить высоту этого блочка
4)Сделать  чтобы не было разноцветного  фона вокруг товара, нужен белый фон, т.е полностью по квадрату

В main.css найдите:

/* Корзина */
.header-top .mini-cartpro {position: relative;}
.header-top .mini-cartpro .block-title {background-image: url('{ASSETS_IMAGES_PATH}ico-cart.png?design=orange');background-repeat: no-repeat;background-position: 15px 12px;background-color: #f79242;padding: 18px 18px 12px 50px;color: #fff;height: 50px;margin-left: 1px;}
.header-top .mini-cartpro .block-title:hover {background-color: rgba(247,146,66,.7);}
.header-top .mini-cartpro .block-title .btn-cart-emty, .header-top .mini-cartpro .block-title a.btn-toggle {font-size: 0;z-index: 1;top: 0;right: 0;position: absolute;width: 100%;height: 50px;}
.header-top .mini-cartpro .block-title a {color: #fff;font-size:120%;}
.header-top .mini-cartpro .block-content .block-inner {position: absolute;top: 50px;right: 0;z-index: 999;overflow: hidden !important;background: #FFF;width: 560px;border-top: 6px solid transparent;border-color: #f79242;transition-property: margin-top, opacity, visibility;transition-duration: 0.5s, 0.5s, 0.5s;-webkit-transition-property: margin-top, opacity, visibility;-webkit-transition-duration: 0.5s, 0.5s, 0.5s;opacity: 0;visibility: hidden;}
.header-top .sm-cartpro:hover .block-content .block-inner {display:block;height:auto;opacity: 1;visibility: visible;}
.header-top .mini-cartpro .block-content .mini-products-list {padding: 20px 10px;max-height: 370px;overflow-y: auto;list-style: none;overflow-x:hidden;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item {
		margin-bottom: 30px;
		display: inline-block;
		width: 170px;
		padding: 10px;
		position:relative;
}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item {
   background:#CF505E;
}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item:nth-child(2n) {
   background:#FA7D3E;
}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item:last-child {margin-bottom: 10px;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item .product-image {float: none;margin-right: 10px;padding: 5px;height:85px;width:85px;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item .product-image img {display:block;margin:0 auto;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item .product-details {float: left;width: 67%;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item a.product-name {color:#fff;font-size: 116.6%;line-height: 12px;display:block;height:25px;overflow:hidden;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item a.product-name :hover {color: #f79242;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item .price {color: #fff;font-size: 150%;display: block;padding: 7px 0;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item .title-qty {float:left;font-size:110%;color:#fff;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item .qty-val {border-radius: 100%;-moz-border-radius: 100%;khtml-border-radius: 100%;-webkit-border-radius: 100%;width: 38px;height: 38px;border: 1px solid #e4e4e4;display: inline-block;text-align: center;line-height: 38px;font-size: 116.6%;}
.header-top .mini-cartpro .block-content .mini-products-list li.cart-item a.product-remove {position: absolute; top: 5px; right: 5px;background-image: url('{ASSETS_IMAGES_PATH}ico-edit-remove.png?design=orange');background-repeat: no-repeat;background-position: 0 -92px;display: block;width: 17px;height: 17px;float: right;}
.header-top .mini-cartpro .block-content .mini-products-list li.cart-item a.product-remove:hover {background-position: 0 -61px;}
.header-top .mini-cartpro .block-content .bottom-action {
		height: 223px;
		padding: 15px 0px 0px 10px;
		background-color: #F79242;
		float: right;
}
.header-top .mini-cartpro .block-content .bottom-action .button {width: 38px;height: 38px;border-radius: 100%;-moz-border-radius: 100%;khtml-border-radius: 100%;-webkit-border-radius: 100%;background-color: #fff;background-repeat: no-repeat;float:left;margin-right:15px;}
.header-top .mini-cartpro .block-content .bottom-action .button.btn-gotocart:after {content: "\f014";font-family: 'FontAwesome';font-size: 28px;color: #E1464D;margin-left: -11px;top: 4px;position: relative;}
.header-top .mini-cartpro .block-content .bottom-action .button.btn-gotocart:hover {background-color: #f79242;box-shadow: 0 0 0 2px #fff;-webkit-box-shadow: 0 0 0 2px #fff;-moz-box-shadow: 0 0 0 2px #fff;}
.header-top .mini-cartpro .block-content .bottom-action .button.btn-gotocart:hover:after  {color: #fff;}
.header-top .mini-cartpro .block-content .bottom-action .button.btn-checkout {background-image: url('{ASSETS_IMAGES_PATH}minicart-action.png?design=orange');background-position: 4px -41px;}
.header-top .mini-cartpro .block-content .bottom-action .button.btn-checkout:hover {background-position: 4px 4px;background-color: #f79242;box-shadow: 0 0 0 2px #fff;-webkit-box-shadow: 0 0 0 2px #fff;-moz-box-shadow: 0 0 0 2px #fff;}
.header-top .mini-cartpro .block-content .summary {float: right;line-height: 38px;margin-right: 10px;}
.header-top .mini-cartpro .block-content .summary .subtotal {color: #fff;font-size: 150%;}

замените на:

/* Корзина */
.header-top .mini-cartpro {position: relative;}
.header-top .mini-cartpro .block-title {background-image: url('{ASSETS_IMAGES_PATH}ico-cart.png?design=orange');background-repeat: no-repeat;background-position: 15px 12px;background-color: #f79242;padding: 18px 18px 12px 50px;color: #fff;height: 50px;margin-left: 1px;}
.header-top .mini-cartpro .block-title:hover {background-color: rgba(247,146,66,.7);}
.header-top .mini-cartpro .block-title .btn-cart-emty, .header-top .mini-cartpro .block-title a.btn-toggle {font-size: 0;z-index: 1;top: 0;right: 0;position: absolute;width: 100%;height: 50px;}
.header-top .mini-cartpro .block-title a {color: #fff;font-size:120%;}
.header-top .mini-cartpro .block-content .block-inner {position: absolute;top: 50px;right: 0;z-index: 999;overflow: hidden !important;background: #FFF;width: 560px;border-top: 6px solid transparent;border-color: #f79242;transition-property: margin-top, opacity, visibility;transition-duration: 0.5s, 0.5s, 0.5s;-webkit-transition-property: margin-top, opacity, visibility;-webkit-transition-duration: 0.5s, 0.5s, 0.5s;opacity: 0;visibility: hidden;}
.header-top .sm-cartpro:hover .block-content .block-inner {display:block;height:auto;opacity: 1;visibility: visible;}
.header-top .mini-cartpro .block-content .mini-products-list {padding: 20px 10px;max-height: 370px;overflow-y: auto;list-style: none;overflow-x:hidden;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item {
		margin-bottom: 30px;
		display: inline-block;
		width: 170px;
		padding: 10px;
		position:relative;
}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item {
	border: 1px solid rgb(250, 125, 62);
}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item:last-child {margin-bottom: 10px;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item .product-image {
	float: none;
	padding: 5px;
	width: 85px;
	min-height: 95px;
	display: block;
	margin: 0px auto;
}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item .product-image img {display:block;margin:0 auto;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item .product-details {float: left;width: 67%;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item a.product-name {color:#fff;font-size: 116.6%;line-height: 12px;display:block;height:25px;overflow:hidden;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item a.product-name :hover {color: #f79242;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item .price {color: #fff;font-size: 150%;display: block;padding: 7px 0;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item .title-qty {float:left;font-size:110%;color:#fff;}
.header-top .mini-cartpro .block-content .mini-products-list .cart-item .qty-val {border-radius: 100%;-moz-border-radius: 100%;khtml-border-radius: 100%;-webkit-border-radius: 100%;width: 38px;height: 38px;border: 1px solid #e4e4e4;display: inline-block;text-align: center;line-height: 38px;font-size: 116.6%;}
.header-top .mini-cartpro .block-content .mini-products-list li.cart-item a.product-remove {position: absolute; top: 5px; right: 5px;background-image: url('{ASSETS_IMAGES_PATH}ico-edit-remove.png?design=orange');background-repeat: no-repeat;background-position: 0 -92px;display: block;width: 17px;height: 17px;float: right;}
.header-top .mini-cartpro .block-content .mini-products-list li.cart-item a.product-remove:hover {background-position: 0 -61px;}
.header-top .mini-cartpro .block-content .bottom-action {
	height: 67px;
	padding: 15px 0px 0px 10px !important;
	background-color: #F79242;
	float: none;
	width: 100% !important;
	clear: both;
	display: block !important;
	margin: -20px 0 0 0 !important;
}
.header-top .mini-cartpro .block-content .bottom-action .button {width: 38px;height: 38px;border-radius: 100%;-moz-border-radius: 100%;khtml-border-radius: 100%;-webkit-border-radius: 100%;background-color: #fff;background-repeat: no-repeat;float:left;margin-right:15px;}
.header-top .mini-cartpro .block-content .bottom-action .button.btn-gotocart:after {content: "\f014";font-family: 'FontAwesome';font-size: 28px;color: #E1464D;margin-left: -11px;top: 4px;position: relative;}
.header-top .mini-cartpro .block-content .bottom-action .button.btn-gotocart:hover {background-color: #f79242;box-shadow: 0 0 0 2px #fff;-webkit-box-shadow: 0 0 0 2px #fff;-moz-box-shadow: 0 0 0 2px #fff;}
.header-top .mini-cartpro .block-content .bottom-action .button.btn-gotocart:hover:after  {color: #fff;}
.header-top .mini-cartpro .block-content .bottom-action .button.btn-checkout {background-image: url('{ASSETS_IMAGES_PATH}minicart-action.png?design=orange');background-position: 4px -41px;}
.header-top .mini-cartpro .block-content .bottom-action .button.btn-checkout:hover {background-position: 4px 4px;background-color: #f79242;box-shadow: 0 0 0 2px #fff;-webkit-box-shadow: 0 0 0 2px #fff;-moz-box-shadow: 0 0 0 2px #fff;}
.header-top .mini-cartpro .block-content .summary {float: right;line-height: 38px;margin-right: 10px;}
.header-top .mini-cartpro .block-content .summary .subtotal {color: #fff;font-size: 150%;}

То что нужно) но закрылись обозначения количества

Stas_Y (01 Сентябрь 2015 - 07:20) писал:

Здравствуйте, добавьте в конец main.css

.block.mini-cartpro.sm-cartpro.cart-header .cart-item span, .block.mini-cartpro.sm-cartpro.cart-header .cart-item a {
	color: #D55758 !important;
}

Так лучше) но шрифт теперь там стал красный

Stas_Y (01 Сентябрь 2015 - 11:15) писал:

Если вы хотите изменить цвет, то найдите в main.css

.block.mini-cartpro.sm-cartpro.cart-header .cart-item span, .block.mini-cartpro.sm-cartpro.cart-header .cart-item a {
		color: #D55758 !important;
}

что бы изменить цвет текста изменяете значение #D55758

Увидел проблемку( когда 1 товар в корзине анимация не работает

Попробуйте почистить кэш, анимация должна не работать на странице корзины.

Есть проблемка: 4 и более товаров корзине отображаются не корректно

Причиной тому стала панель с кнопками, она прибита к блоку и скроллится вместе с товарами в корзине, можно задать ей прозрачность и чтобы фото ее не перекрывали, в main.css найдите:

.header-top .mini-cartpro .block-content .bottom-action {
	height: 67px;
	padding: 15px 0px 0px 10px !important;
	background-color: #F79242;
	float: none;
	width: 100% !important;
	clear: both;
	display: block !important;
	margin: -20px 0px 0px !important;
}

замените на:

.header-top .mini-cartpro .block-content .bottom-action {
	height: 67px;
	padding: 15px 0px 0px 10px !important;
	background-color: #F79242;
	float: none;
	width: 100% !important;
	clear: both;
	display: block !important;
	margin: -20px 0px 0px !important;
	opacity: 0.7;
	z-index: 99;
}

Сделал)) но приходится тогда скроллить, а нельзя сделать так чтобы товары в анимации выстраивались в одну строку?

У выпадающего блока фиксированная ширина(width: 560px;), если указать в  процентах, например 100% или auto, то она примет ширину кнопки чуть выше "Корзина".

Попробуйте следующий вариант, но только обязательно проверьте не отразится ли изменение ниже на других элементах сайта, в main.css найдите(строка 861):

.col-xs-1,.col-sm-1,.col-md-1,.col-lg-1,.col-xs-2,.col-sm-2,.col-md-2,.col-lg-2,.col-xs-3,.col-sm-3,.col-md-3,.col-lg-3,.col-xs-4,.col-sm-4,.col-md-4,.col-lg-4,.col-xs-5,.col-sm-5,.col-md-5,.col-lg-5,.col-xs-6,.col-sm-6,.col-md-6,.col-lg-6,.col-xs-7,.col-sm-7,.col-md-7,.col-lg-7,.col-xs-8,.col-sm-8,.col-md-8,.col-lg-8,.col-xs-9,.col-sm-9,.col-md-9,.col-lg-9,.col-xs-10,.col-sm-10,.col-md-10,.col-lg-10,.col-xs-11,.col-sm-11,.col-md-11,.col-lg-11,.col-xs-12,.col-sm-12,.col-md-12,.col-lg-12{position:relative;min-height:1px;padding-right:15px;padding-left:15px}

замените на:

.col-xs-1,.col-sm-1,.col-md-1,.col-lg-1,.col-xs-2,.col-sm-2,.col-md-2,.col-lg-2,.col-xs-3,.col-sm-3,.col-md-3,.col-lg-3,.col-xs-4,.col-sm-4,.col-md-4,.col-lg-4,.col-xs-5,.col-sm-5,.col-md-5,.col-lg-5,.col-xs-6,.col-sm-6,.col-md-6,.col-lg-6,.col-xs-7,.col-sm-7,.col-md-7,.col-lg-7,.col-xs-8,.col-sm-8,.col-md-8,.col-lg-8,.col-xs-9,.col-sm-9,.col-md-9,.col-lg-9,.col-xs-10,.col-sm-10,.col-md-10,.col-lg-10,.col-xs-11,.col-sm-11,.col-md-11,.col-lg-11,.col-xs-12,.col-sm-12,.col-md-12,.col-lg-12{min-height:1px;padding-right:15px;padding-left:15px}

далее найдите(строка 250) и удалите:

.header-top .mini-cartpro {position: relative;}

далее найдите(255):

.header-top .mini-cartpro .block-content .block-inner {position: absolute;top: 50px;right: 0;z-index: 999;overflow: hidden !important;background: #FFF;width: 560px;border-top: 6px solid transparent;border-color: #f79242;transition-property: margin-top, opacity, visibility;transition-duration: 0.5s, 0.5s, 0.5s;-webkit-transition-property: margin-top, opacity, visibility;-webkit-transition-duration: 0.5s, 0.5s, 0.5s;opacity: 0;visibility: hidden;}

замените на:

.header-top .mini-cartpro .block-content .block-inner {position: absolute;top: 50px;right: 0;z-index: 999;overflow: hidden !important;background: #FFF;width: 100%;border-top: 6px solid transparent;border-color: #f79242;transition-property: margin-top, opacity, visibility;transition-duration: 0.5s, 0.5s, 0.5s;-webkit-transition-property: margin-top, opacity, visibility;-webkit-transition-duration: 0.5s, 0.5s, 0.5s;opacity: 0;visibility: hidden;}

Что то пошло не так) все слетело

Попробуйте повторить изменения и после почистить кэш, если повторится ситуация, сделайте и прикрепите скриншот, или речь идет не о корзине в целом, а о других элементах?

Вот почему то так)) страницы грузтся

Так у вас даже изображения перестают отображаться(фото товаров), странно, просмотрела инструкцию выше, синтаксических ошибок не нашла. У меня на данный момент сайт отображается следующим образом при наведении на корзину:

Вот!) После произведенных изменений, изменилось выпадение меню, стало во всю ширину страницы(
При наведении на корзину выпадающее окно тоже во всю ширину, а хотелось бы чтобы оно растягивалось по мере добавления товаров