Перейти к содержимому


Доработка Шаблона


  • Авторизуйтесь для ответа в теме
Сообщений в теме: 43

#1 fullkos

fullkos

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 56 сообщений

Отправлено 03 Октябрь 2015 - 00:23

1.Верхнее меню сместить правее до середины,а личный кабинет поставить на место где сейчас корзина-поиск?

#2 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 23 788 сообщений

Отправлено 03 Октябрь 2015 - 00:55

В main.css найдите:
.header-top .header-top-left .top-navbar-links {
	float: left;
	list-style: outside none none;
	overflow: hidden;
	height: 50px;
}
замените на:
.header-top .header-top-left .top-navbar-links {
	float: right;
	list-style: outside none none;
	overflow: hidden;
	height: 50px;
}

Уточните пожалуйста, как должен выглядеть ЛК справа, должен ли он заменить старые блоки или стоять рядом, инструкция по установке кнопки лк для вашего шаблона:
http://forum.storela...ки/#entry210466

#3 fullkos

fullkos

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 56 сообщений

Отправлено 03 Октябрь 2015 - 01:16

Не получается...

#4 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 23 788 сообщений

Отправлено 03 Октябрь 2015 - 01:19

Уточните, что именно не получается, так как вопрос был по 2м пунктам?

#5 fullkos

fullkos

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 56 сообщений

Отправлено 03 Октябрь 2015 - 01:27

1.Перенести ( Доставка, Оплата и т.п. ) к центру
2.ЛК перенести в правый угол
3.Поиск растянуть и опустить ниже....правее логотипа
4.После поиска написать номер телефона
5.А после номера вставить корзину

Прикрепленные изображения

  • Screenshot_55.png


#6 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 23 788 сообщений

Отправлено 03 Октябрь 2015 - 01:58

1. В main.css найдите:
.header-top .header-top-left .top-navbar {
min-height: 50px;
padding-bottom: 0px;
overflow: visible;
float: left;
}
замените на:
.header-top .header-top-left .top-navbar {
min-height: 50px;
padding-bottom: 0px;
overflow: visible;
float: right;
}

далее найдите:
.navbar-collapse.collapse {
display: block;
height: auto;
padding-bottom: 0px;
overflow: visible;
}
замените на:
.navbar-collapse.collapse {
display: block;
height: auto;
padding-bottom: 0px;
overflow: visible;
position: relative;
}

2. Выполните инструкцию, чтобы я смогла посмотреть, что не так получилось.

#7 fullkos

fullkos

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 56 сообщений

Отправлено 03 Октябрь 2015 - 02:10

Сделал...перенеслось правее
SL-359428

А как теперь с другими пунктами ?

#8 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 23 788 сообщений

Отправлено 03 Октябрь 2015 - 02:30

2. Выполните второй пункт, ссылку на инструкцию я вам указывала.
3. Блок в шаблоне html
 <form id="search_mini_form" action="http://{NET_DOMAIN}/search" method="get">
				  <div class="form-search">
					<input id="search" type="text" name="q" value="" class="search-string" placeholder="Поиск по магазину...">
					<button type="submit" title="Искать" class="button search-submit"></button>
				  </div>
				</form>

переместите, поставив после:
<!-- Логотип -->
			  <div class="logo col-lg-3 col-md-2 col-xs-12">
				<a title="{SETTINGS_STORE_NAME}" href="http://{NET_DOMAIN}/">			   
				  <img alt="{SETTINGS_STORE_NAME}" src="{ASSETS_IMAGES_PATH}logo.png?design=orange">								  
				</a>
			  </div>

4. После перенесенного блока поиска вставьте:
<div class="contacts">
					{% IF SETTINGS_STORE_PHONE_NUMBER1 %}<p>Телефон : {SETTINGS_STORE_PHONE_COUNTRY_CODE1}({SETTINGS_STORE_PHONE_CITY_CODE1}){SETTINGS_STORE_PHONE_NUMBER1}</p>{% ENDIF %}
					{% IF SETTINGS_STORE_PHONE_NUMBER2 %}<p>Телефон : {SETTINGS_STORE_PHONE_COUNTRY_CODE2}({SETTINGS_STORE_PHONE_CITY_CODE2}){SETTINGS_STORE_PHONE_NUMBER2}</p>{% ENDIF %}
					{% IF SETTINGS_STORE_PHONE_NUMBER3 %}<p>Телефон : {SETTINGS_STORE_PHONE_COUNTRY_CODE3}({SETTINGS_STORE_PHONE_CITY_CODE3}){SETTINGS_STORE_PHONE_NUMBER3}</p>{% ENDIF %}
					{% IF SETTINGS_STORE_WORK_TIME %}<p>Время работы : {SETTINGS_STORE_WORK_TIME}</p>{% ENDIF %}
					{% IF SETTINGS_STORE_EMAIL_MAIN %}<p>Email : <a href="{SETTINGS_STORE_EMAIL_MAIN}">{SETTINGS_STORE_EMAIL_MAIN}</a></p>{% ENDIF %}
					{% IF SETTINGS_STORE_SKYPE %}<p>Skype : {SETTINGS_STORE_SKYPE}</p>{% ENDIF %}
					{% IF SETTINGS_STORE_ICQ %}<p>ICQ : {SETTINGS_STORE_ICQ}</p>{% ENDIF %}
				  </div>
5. В шаблоне HTML найдите:
<!-- Корзина -->
				<div class="block mini-cartpro sm-cartpro cart-header">
				  <div class="block-title cart-count-block">
					{% IF cart_count_empty %}
					  <span class="empty">Корзина пуста</span>
					{% ELSE %}
					  <span class="not-empty"><a href="{CART_URL}"><span class="cart-count">{CART_COUNT_TOTAL}</span> товар{CART_COUNT_TOTAL| gen_word_end("","а","ов")}</a></span>
					  <span class="empty" style="display:none;">Корзина пуста</span>
					{% ENDIF %}
				  </div>
				  <!-- Выпадающая корзина-->
				  <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>
				<!-- /END Корзина -->

перенесите его, поставив после:
<ul class="connect-us">
								  <li><a href="#" class="fa fa-facebook"></a></li>
								  <li><a href="#" class="fa fa-twitter"></a></li>
								  <li><a href="#" class="fa fa-youtube"></a></li>
								  <li><a href="#" class="fa fa-vk"></a></li>
								</ul>

На основе результатов укажу вам какие стили необходимо прописать для выравнивания

#9 fullkos

fullkos

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 56 сообщений

Отправлено 03 Октябрь 2015 - 02:33

я второй пункт делал...потом откатил обратно!!!
У меня появилось два логотипа лк залез между корзиной и поиском

#10 fullkos

fullkos

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 56 сообщений

Отправлено 03 Октябрь 2015 - 02:41

Сделал все ... кроме второго пункта...

#11 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 23 788 сообщений

Отправлено 03 Октябрь 2015 - 03:34

Значит немного не точно сделали, 2 логотипа не должно было появиться, так как идет простое добавление блока с ссылкой:
<!-- ЛК -->
								<div class="block lk">
								  <div class="block-title">
										  <a href="{USER_LOGIN_URL}">Вход</a>
								  </div></div>


#12 fullkos

fullkos

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 56 сообщений

Отправлено 03 Октябрь 2015 - 10:39

У меня получилось вот так SL-359428

#13 fullkos

fullkos

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 56 сообщений

Отправлено 04 Октябрь 2015 - 16:25

А как это все поставить на те места,где мне нужно?

#14 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 23 788 сообщений

Отправлено 06 Октябрь 2015 - 02:47

1. Блок ЛК, в шаблоне HTML найдите:
<!-- ЛК -->
															 <div class="block lk">
																 <div class="block-title">
																				 <a href="{USER_LOGIN_URL}">Вход</a>
																 </div></div>

замените его на:
<!-- ЛК -->
															 <div class="block lk">
																 <div class="block-title">
																				 <a href="{USER_LOGIN_URL}"><i class="fa icon-user"></i>Вход в ЛК</a>
																 </div></div>

перенесите его, поставив после:
<li><a href="{menu.header.links.URL}" {% IF menu.header.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %}>{menu.header.links.NAME}</a></li>
						 {% ENDFOR %}
					 {% ENDFOR %}
					 {% ENDFOR %}
				 </ul>
				 </div>
			 </div>
			 </div>
			 <!-- Корзина и Поиск -->
			 <div class="header-top-right col-lg-3 col-md-3 col-sm-6 col-xs-12">

Далее зайдите в раздел Сайт - Меню и удалите пункт меню "Войти в ЛК"

Должен получиться следующий результат:
123.jpg

2. Поиск, в main.css найдите:
/* Поиск */
.header-top .header-top-right #search_mini_form {background-image: url('{ASSETS_IMAGES_PATH}ico-search.png?design=orange');background-repeat: no-repeat;background-position: 10px 12px;width: 52px;height: 50px;border-left: 1px solid #71cb45;position: relative;background-color: #71cb45;}
.header-top .header-top-right #search_mini_form .form-search {opacity: 0;filter: alpha(opacity = 0);visibility: hidden;position: absolute;top: 0;right: 0;height: 50px;z-index: 1;}
.header-top .header-top-right #search_mini_form .form-search .button {float: right;background-image: url('{ASSETS_IMAGES_PATH}ico-search.png?design=orange');background-repeat: no-repeat;background-position: 11px 12px;width: 52px;height: 50px;cursor:pointer;}
.header-top .header-top-right #search_mini_form:hover {background-color: rgba(247,146,66,.5);}
.header-top .header-top-right #search_mini_form .form-search #search {position: absolute;top: 0;right: 52px;float: right;height: 50px;border: 7px solid transparent;border-color: #71cb45;width: 50px;font-size: 100%;}
.header-top .header-top-right #search_mini_form:hover .form-search {opacity: 1; filter:alpha(opacity = 100);visibility:visible;z-index:1;}
.header-top .header-top-right #search_mini_form:hover .form-search #search {width: 200px;}

замените на:
/* Поиск */
#search_mini_form {float: left;background-image: url('{ASSETS_IMAGES_PATH}ico-search.png?design=orange');background-repeat: no-repeat;background-position: 10px 12px;width: 253px;height: 50px;border-left: 1px solid #71cb45;position: relative;background-color: #71cb45;margin: 3% 1% 0 1%;}
#search_mini_form .form-search .button {float: right;background-image: url('{ASSETS_IMAGES_PATH}ico-search.png?design=orange');background-repeat: no-repeat;background-position: 11px 12px;width: 52px;height: 50px;cursor:pointer;}
#search_mini_form:hover {background-color: rgba(247,146,66,.5);}
#search_mini_form .form-search #search {float: left;height: 50px;border: 7px solid transparent;border-color: #71cb45;width: 200px;font-size: 100%;}

Должен получиться следующий результат:
312.jpg

3. Телефоны, в main.css после:
/* Телефон */
.header-top .header-top-right .header-phone {position: absolute;top: 0;right: 0;height: 50px;z-index: 1;display:none;}
.header-top .header-top-right .header-phone a {margin: 0px;line-height: 50px;text-align: left;font-family: 'Open Sans', sans-serif;font-size: 20px;opacity: 0;filter: alpha(opacity = 0);visibility: hidden;}
.header-top .header-top-right .header-phone:hover a {opacity: 1; filter:alpha(opacity = 100);visibility:visible;z-index:1;margin-right: 60px;}
.header-top .header-top-right .header-phone button {width: 50px;height: 50px;background: #e1464d;position: absolute;right: 0;top: 0;}

добавьте:
.header-content .contacts {
	float: left;
	margin: 3.4% 1%;
}
4. Корзина, в шаблоне HTML найдите:
<div class="yt-main-menu col-lg-9 col-md-10 col-xs-12">
<ul class="connect-us">
								  <li><a href="#" class="fa fa-facebook"></a></li>
								  <li><a href="#" class="fa fa-twitter"></a></li>
								  <li><a href="#" class="fa fa-youtube"></a></li>
								  <li><a href="#" class="fa fa-vk"></a></li>
								</ul>
								<!-- Корзина -->

замените на:
<div class="yt-main-menu col-lg-2 col-md-10 col-xs-12">
								<!-- Корзина -->

в 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: #71cb45;padding: 18px 18px 12px 50px;color: #fff;height: 50px;margin-left: 1px;}
.header-top .mini-cartpro .block-title:hover {background-color: rgba(113,203,69,67);}
.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:#71cb45;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: #71cb45;}
.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: #71cb45;}
.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: #71cb45;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: #71cb45;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-content .mini-cartpro {position: relative;}
.header-content .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: #71cb45;padding: 18px 18px 12px 50px;color: #fff;height: 50px;margin-left: 1px;}
.header-content .mini-cartpro .block-title:hover {background-color: rgba(113,203,69,67);}
.header-content .mini-cartpro .block-title .btn-cart-emty, .header-content .mini-cartpro .block-title a.btn-toggle {font-size: 0;z-index: 1;top: 0;right: 0;position: absolute;width: 100%;height: 50px;}
.header-content .mini-cartpro .block-title a {color: #fff;font-size:120%;}
.header-content .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:#71cb45;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-content .sm-cartpro:hover .block-content .block-inner {display:block;height:auto;opacity: 1;visibility: visible;}
.header-content .mini-cartpro .block-content .mini-products-list {padding: 20px 10px;max-height: 370px;overflow-y: auto;list-style: none;overflow-x:hidden;}
.header-content .mini-cartpro .block-content .mini-products-list .cart-item {margin-bottom: 30px;}
.header-content .mini-cartpro .block-content .mini-products-list .cart-item:last-child {margin-bottom: 10px;}
.header-content .mini-cartpro .block-content .mini-products-list .cart-item .product-image {float: left;margin-right: 10px;padding: 5px;height:85px;width:85px;}
.header-content .mini-cartpro .block-content .mini-products-list .cart-item .product-image img {display:block;margin:0 auto;}
.header-content .mini-cartpro .block-content .mini-products-list .cart-item .product-details {float: left;width: 67%;}
.header-content .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-content .mini-cartpro .block-content .mini-products-list .cart-item a.product-name :hover {color: #71cb45;}
.header-content .mini-cartpro .block-content .mini-products-list .cart-item .price {font-size: 150%;display: block;padding: 7px 0;}
.header-content .mini-cartpro .block-content .mini-products-list .cart-item .title-qty {float:left;font-size:110%;}
.header-content .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-content .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-content .mini-cartpro .block-content .mini-products-list li.cart-item a.product-remove:hover {background-position: 0 -61px;}
.header-content .mini-cartpro .block-content .bottom-action {height: 67px;padding: 15px 0 0 10px;background-color: #71cb45;}
.header-content .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-content .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-content .mini-cartpro .block-content .bottom-action .button.btn-gotocart:hover {background-color: #71cb45;box-shadow: 0 0 0 2px #fff;-webkit-box-shadow: 0 0 0 2px #fff;-moz-box-shadow: 0 0 0 2px #fff;}
.header-content .mini-cartpro .block-content .bottom-action .button.btn-gotocart:hover:after  {color: #fff;}
.header-content .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-content .mini-cartpro .block-content .bottom-action .button.btn-checkout:hover {background-position: 4px 4px;background-color: #71cb45;box-shadow: 0 0 0 2px #fff;-webkit-box-shadow: 0 0 0 2px #fff;-moz-box-shadow: 0 0 0 2px #fff;}
.header-content .mini-cartpro .block-content .summary {float: right;line-height: 38px;margin-right: 10px;}
.header-content .mini-cartpro .block-content .summary .subtotal {color: #fff;font-size: 150%;}

Результат:
12312.jpg

#15 fullkos

fullkos

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 56 сообщений

Отправлено 06 Октябрь 2015 - 03:10

Круто, очень классно!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
1.Подскажите, а как можно поиск растянуть ?
2.Телефоны немного правее претянуть ?
3. Корзину немного опустить, чтобы она стояла на одном уровне с поиском ? ( а то она немного приподнята )

#16 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 23 788 сообщений

Отправлено 06 Октябрь 2015 - 03:32

1. В main.css найдите:
/* Поиск */
#search_mini_form {float: left;background-image: url('{ASSETS_IMAGES_PATH}ico-search.png?design=orange');background-repeat: no-repeat;background-position: 10px 12px;width: 253px;height: 50px;border-left: 1px solid #71cb45;position: relative;background-color: #71cb45;margin: 3% 1% 0 1%;}
#search_mini_form .form-search .button {float: right;background-image: url('{ASSETS_IMAGES_PATH}ico-search.png?design=orange');background-repeat: no-repeat;background-position: 11px 12px;width: 52px;height: 50px;cursor:pointer;}
#search_mini_form:hover {background-color: rgba(247,146,66,.5);}
#search_mini_form .form-search #search {float: left;height: 50px;border: 7px solid transparent;border-color: #71cb45;width: 200px;font-size: 100%;}

замените на:
/* Поиск */
#search_mini_form {float: left;background-image: url('{ASSETS_IMAGES_PATH}ico-search.png?design=orange');background-repeat: no-repeat;background-position: 10px 12px;width: 303px;height: 50px;border-left: 1px solid #71cb45;position: relative;background-color: #71cb45;margin: 3% 1% 0 1%;}
#search_mini_form .form-search .button {float: right;background-image: url('{ASSETS_IMAGES_PATH}ico-search.png?design=orange');background-repeat: no-repeat;background-position: 11px 12px;width: 52px;height: 50px;cursor:pointer;}
#search_mini_form:hover {background-color: rgba(247,146,66,.5);}
#search_mini_form .form-search #search {float: left;height: 50px;border: 7px solid transparent;border-color: #71cb45;width: 250px;font-size: 100%;}
2. В main.css найдите:
.header-content .contacts {
	float: left;
	margin: 3.4% 1%;
}

замените на:
.header-content .contacts {
	float: left;
	margin: 3.4% 1%;
	padding-left: 7%;
}
3. В main.css найдите:
.header-content .mini-cartpro {
	position: relative;
}

замените на:
.header-content .mini-cartpro {
	position: relative;
	margin: 6% 1% 0 1%;
}


#17 fullkos

fullkos

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 56 сообщений

Отправлено 06 Октябрь 2015 - 03:40

Спасибо все получилось!!!!!!!
А возможно в самом верху, там где доставка, оплата, ЛК под ними провести линию отделяющею их от лого,поиска ( или хотя бы подчеркнуть Доставка, оплата,ЛК ) ?

#18 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 23 788 сообщений

Отправлено 06 Октябрь 2015 - 03:43

В main.css найдите:
.header-top {
	background-color: #FFF;
	height: 50px;
}

замените на:
.header-top {
	background-color: #FFF;
	height: 50px;
	border-bottom: 1px solid #ccc;
}


#19 fullkos

fullkos

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 56 сообщений

Отправлено 06 Октябрь 2015 - 03:52

1.А как можно убрать...чтобы при наведении на верхнее меню оно отображалось не зеленым прямоугольником, а просто зеленой подсветкой названия? и убрать разделительную полосу между ними ?
2.Как разделяющею полосу приподнять вверх ?
3.И каталог с товарами и слайдер поднять вверх ближе к верхнему меню ?

#20 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 23 788 сообщений

Отправлено 06 Октябрь 2015 - 04:26

1. В main.css найдите:
.header-top .header-top-left .top-navbar-links li:hover {background-color: #71cb45;}
.header-top .header-top-left .top-navbar-links li:hover a {color: #fff;text-decoration: none;}

замените на:
.header-top .header-top-left .top-navbar-links li:hover a {color: #71cb45;text-decoration: none;}

2.В main.css найдите:
.header-top .header-top-left .top-navbar-links li a {
	padding: 18px 18px 12px;
	display: block;
	font-size: 115%;
}
замените на:
.header-top .header-top-left .top-navbar-links li a {
	padding: 10px 18px;
	display: block;
	font-size: 115%;
}

далее найдите:
.header-top .header-top-right .lk {
	padding: 18px 18px 12px 50px;
	color: #FFF;
	height: 50px;
	margin-left: 1px;
}
замените на:
.header-top .header-top-right .lk {
	padding: 10px 18px;
	color: #FFF;
	height: 50px;
	margin-left: 1px;
}

далее найдите:
.header-top {
	background-color: #FFF;
	height: 50px;
	border-bottom: 1px solid #CCC;
}

замените на:
.header-top {
	background-color: #FFF;
	height: 34px;
	border-bottom: 1px solid #CCC;
}

3. Так у вас млайдер и прочие элементы и так стоят впритык с меню, немного не понятно, что вы хотите реализовать




Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных