• Вопрос без рабочей ссылки на проблему считается риторическим. Без ссылки и скриншота - провокацией!

Artificer товары

Image CMS

denisl

Новичок
#1
Добрый день уважаемые форумчане!
Возник вопрос по стилизации своего магазина с темой Artificer
Сайт www.giftwow.ru

А вопрос мой в следующем:
1. Как убрать прозрачность всех товаров при наведении на конкретный товар
2. Как убрать рамочку вокруг товаров
3. Как убрать пластырь (типа стикер) чуть выше картинки товара (в файлах называется tape.png)

Пишу потому-что не смог самостоятельно, но и понимаю, что надежд на помощь особых ждать тоже смысла нет, может хотябы подскажите где рыть конкретнее.

файл style.css на яндекс.диске https://yadi.sk/d/iAVLS6Dzk4hTd
 

dave14

Опытный
Местный
#2
А вопрос мой в следующем:
1. Как убрать прозрачность всех товаров при наведении на конкретный товар
2. Как убрать рамочку вокруг товаров
3. Как убрать пластырь (типа стикер) чуть выше картинки товара (в файлах называется tape.png)
1. Полагаю в файле http://giftwow.ru/wp-content/themes/artificer/styles/violet.css
нужно opacity убрать:

HTML:
  .post-type-archive-product ul.products:hover li.product .img-wrap {
    opacity: 0.5;
    filter: alpha(opacity=@opacity * 100);
  }
  .post-type-archive-product ul.products:hover li.product .img-wrap:hover {
    opacity: 1;
    filter: alpha(opacity=@opacity * 100);
2. В том же файле box-shadow убрать:
Код:
ul.products li.product .img-wrap {
  padding: .618em .618em 2.244em;
  background: #fff;
  -webkit-box-sizing: border-box;
  /* Safari/Chrome, other WebKit */
  -moz-box-sizing: border-box;
  /* Firefox, other Gecko */
  box-sizing: border-box;
  /* Opera/IE 8+ */
  -webkit-transform: rotate(1deg);
  /* Saf3.1+, Chrome */
  -moz-transform: rotate(1deg);
  /* FF3.5+ */
  -ms-transform: rotate(1deg);
  /* IE9 */
  -o-transform: rotate(1deg);
  /* Opera 10.5 */
  transform: rotate(1deg);
  zoom: 1;
  position: relative;
  -webkit-box-shadow: 0 0.077em 0.236em rgba(0, 0, 0, 0.2), inset 0 0.202em 1.618em rgba(0, 0, 0, 0.05);
  -moz-box-shadow: 0 0.077em 0.236em rgba(0, 0, 0, 0.2), inset 0 0.202em 1.618em rgba(0, 0, 0, 0.05);
  box-shadow: 0 0.077em 0.236em rgba(0, 0, 0, 0.2), inset 0 0.202em 1.618em rgba(0, 0, 0, 0.05);
  margin-bottom: 1em;
}
3. В том же файле background убрать
Код:
ul.products li.product .img-wrap:before {
  content: "";
  display: block;
  z-index: 99999;
  height: 32px;
  width: 87px;
  position: absolute;
  left: 25%;
  top: -0.618em;
  background: url("../images/tape.png");
  -webkit-transform: rotate(-2deg);
  /* Saf3.1+, Chrome */
  -moz-transform: rotate(-2deg);
  /* FF3.5+ */
  -ms-transform: rotate(-2deg);
  /* IE9 */
  -o-transform: rotate(-2deg);
  /* Opera 10.5 */
  transform: rotate(-2deg);
  zoom: 1;
}
 

denisl

Новичок
#3
Спасибо за быстроту! 1 и 3 пункт исправил всё получилось
А вот рамки не убираются после значения none
 

dave14

Опытный
Местный
#4
Спасибо за быстроту! 1 и 3 пункт исправил всё получилось
А вот рамки не убираются после значения none
Вот здесь вроде бы еще остались -webkit-box-shadow, -moz-box-shadow, box-shadow

Код:
ul.products li.product .img-wrap {
  padding: .618em .618em 2.244em;
  background: #fff;
  -webkit-box-sizing: border-box;
  /* Safari/Chrome, other WebKit */
  -moz-box-sizing: border-box;
  /* Firefox, other Gecko */
  box-sizing: border-box;
  /* Opera/IE 8+ */
  -webkit-transform: rotate(1deg);
  /* Saf3.1+, Chrome */
  -moz-transform: rotate(1deg);
  /* FF3.5+ */
  -ms-transform: rotate(1deg);
  /* IE9 */
  -o-transform: rotate(1deg);
  /* Opera 10.5 */
  transform: rotate(1deg);
  zoom: 1;
  position: relative;
  -webkit-box-shadow: 0 0.077em 0.236em rgba(0, 0, 0, 0.2), inset 0 0.202em 1.618em rgba(0, 0, 0, 0.05);
  -moz-box-shadow: 0 0.077em 0.236em rgba(0, 0, 0, 0.2), inset 0 0.202em 1.618em rgba(0, 0, 0, 0.05);
  box-shadow: 0 0.077em 0.236em rgba(0, 0, 0, 0.2), inset 0 0.202em 1.618em rgba(0, 0, 0, 0.05);
  margin-bottom: 1em;
}
 

denisl

Новичок
#9
Для тех кому интересно:

изменил значения:

ul.products li.product .img-wrap {
padding: 0em 0em 0em;
background: none;
-webkit-box-sizing: border-box;
/* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;
/* Firefox, other Gecko */
box-sizing: border-box;
/* Opera/IE 8+ */
-webkit-transform: rotate(1deg);
/* Saf3.1+, Chrome */
-moz-transform: rotate(1deg);
/* FF3.5+ */
-ms-transform: rotate(1deg);
/* IE9 */
-o-transform: rotate(1deg);
/* Opera 10.5 */
transform: rotate(1deg);
zoom: 1;
position: relative;
-webkit-box-shadow: 0 0em 0em rgba(0, 0, 0, 0), inset 0 0em 0em rgba(0, 0, 0, 0);
-moz-box-shadow: 0 0em 0em rgba(0, 0, 0, 0), inset 0 0em 0em rgba(0, 0, 0, 0);
box-shadow: 0 0em 0em rgba(0, 0, 0, 0), inset 0 0em 0em rgba(0, 0, 0, 0);
margin-bottom: 1em;
}