Так, в чем-то разобралась сама. Все изменения в /catalog/view/theme/название темы/stylesheet - stylesheet.css - 166 строка, в контейнере в конце добавила text-align: center; , чтобы была центровка всего на странице -
#container {
width: 980px;
margin-left: auto;
margin-right: auto;
text-align: center;
}
1. Смещение поиска Строка 263, смещение вправо со значением 170px в итоге:
#header #search {
position: absolute;
top: 23px;
right: 170px;
width: 298px;
z-index: 15;
padding: 10px 14px 10px 10px;
}
Из-за центровки надпись "Поиск" сместилась чуть правее, в итоге частично закрывала изображение с лупой. Решилось так: пропись позиции (absolutely не работает) с relative + вправо на 10px строка 290, #header .bst
#header .bst {
color: #626262;
font-size: 10px;
font-weight: bold;
line-height: 27px;
padding-left: -6px;
-webkit-text-shadow: 0px -1px 0 #e9e6e6;
-moz-text-shadow: 0px -1px 0 #e9e6e6;
text-shadow: 0px -1px 0 #e9e6e6;
position: relative;
right: 10px;
}
2. Правка модулей "Последние" (они же Новые поступления) и "Рекомендуемые" начнем со второго. Рекомендуемые = Featured (Module) 1004 строка и далее. Конкретно нужен был кусок со значением ширины: width: **px; (1029 строка и далее). Ставим нужное кол-во px. В конце выглядит так:
.featured-box > div {
width: 220px;
display: inline-block;
vertical-align: top;
margin-left: auto;
margin-right: auto;
margin-top: 8px;
margin-bottom: 10px;
border-bottom: 1px solid #f1f5f6;
}
Правка "Последние" Нужно Latest, Special and Bestsellers Module, это 1247 строка Правим то же самое, что и выше:
.box-cl > div {
width: 220px;
display: inline-block;
vertical-align: top;
margin-left: 5px;
margin-bottom: 5px;
padding: 0px;}
Также можно добавить и там, и там:
.box-cl > div:hover {
cursor:pointer;
border: 1px solid #ddd;
box-shadow: 0px 0px 30px 0px #ddd;
width: 220px;
padding: -3px;
}
Дает обводку вокруг товара: Ну и заодно изменила вид отображения товаров: 1630 строка и далее
.product-grid > div {
width: 120px;
display: inline-block;
vertical-align: top;
margin-left: auto;
margin-right: auto;
margin-bottom: 15px;
text-align: center;
}
.product-grid > div:hover {
cursor:pointer;
border: 1px solid #ddd;
box-shadow: 0px 0px 30px 0px #ddd ;
width: 120px;
padding: -3px;
}
P.S. Далее нужно изменить размер изображений (для Последних и Рекомендуемых в модялях), размер изображений в просмотре товара в настройках админки (Система-Настройки-*магазин*-Изображения). Для нормального отображения лучше проставить -20px от того размера, что проставляли в stylesheet.css.