Bouton panier impossible à modifier

[carnet85]

Bonjour, je poste ici car je bloque depuis plusieurs jours sur ce problème.

Je n'arrive pas à modifier le bouton panier de la fiche produit ( j'ai réussi plus ou moins deux trois petites modifs mais rien de plus).

J'aimerais supprimer l'effet relief du bouton mais je ne trouve rien qui permette de faire ça dans le fichier product.css

 

Est-ce que je me trompe de fichier, et si non quelle ligne il faut modifier ?

 

J'espère que quelqu'un pourra m'aider, merci d'avance !

[Szed]

Sur le thème par défaut, product.css ligne 487 (selon la démo de PS) :

.box-info-product .exclusive span {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
font-weight: 700;
font-size: 20px;
line-height: 22px;
border-top: 1px solid #06b2e6;
border-right: 1px solid #06b2e6;
border-left: 1px solid #06b2e6;
border-bottom: 1px solid #06b2e6;
text-shadow: 0 1px #015883;
padding: 12px 36px 14px 60px;
color: white;
display: block !important;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}

Et ligne 485 

.box-info-product .exclusive {
padding: 0;
border-top: 1px solid #0079b6;
border-right: 1px solid #006fa8;
border-left: 1px solid #006fa8;
border-bottom: 1px solid #012740;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
position: relative;
display: block;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #009ad0), color-stop(100%, #007ab7));
background-image: -webkit-linear-gradient(#009ad0, #007ab7);
background-image: -moz-linear-gradient(#009ad0, #007ab7);
background-image: -o-linear-gradient(#009ad0, #007ab7);
background-image: linear-gradient(#009ad0, #007ab7);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#009ad0', endColorstr='#007ab7',GradientType=0 );
}

Ce qui vous gêne ca doit être le jeu des bordures exterieure et interieure.

[carnet85]

Bonjour, je te remercie pour ta réponse, je n'ai pas exactement les mêmes code mais j'en ai trouvé qui sont quasi identiques, j'ai essayer de les supprimer notamment les border mais rien ne change, c'est assez désespérant de bloquer sur un truc aussi banal !

[carnet85]

J'ai aussi oublié de préciser que j'ai également recherché les codes couleur de ce contour mais je ne trouve rien dans product.css ni dans les images.

[Szed]

Alors, le plus simple serait de vous familiariser avec les outils de dev (F12 sous chrome, firefox, IE) qui vous permettront d'"inspecter" un élément de votre site, et vous affichera le CSS adéquat (ligne + fichier). Vous pourrez également faire des test directement sur votre site, pour savoir quel ligne supprimer ou quoi rajouter.

 

Plus d'infos ici : http://www.gregoirenoyelle.com/css3-les-outils-pour-inspecter/

[carnet85]

Je connais déjà ce genre d'outils mais ça ne m'a pas vraiment aidé, j'ai vu que cela correspond bien à l'élément .box-info-product .exclusive mais ensuite aucune indication de ce border ou relief, j'ai essayé de modifier énormément d'élément mais rien ne bouge ...

[carnet85]

Si jamais ça peut aider voici mon code Css :
 
.box-info-product .exclusive span {
      -webkit-border-radius: 5px;
      -moz-border-radius: 5px;
      -ms-border-radius: 5px;
      -o-border-radius: 5px;
      border-radius: 5px;
      font-weight: normal;
      font-size: 17px;
      padding: 10px 10px 10px 10px;
      color: white;
      display: block !important;
      -webkit-transition: all 0.3s ease;
      -moz-transition: all 0.3s ease;
      -o-transition: all 0.3s ease;
      transition: all 0.3s ease; }
      @media (max-width: 1199px) {
        .box-info-product .exclusive span {
          padding: 12px 22px 14px 55px;
          font-size: 14px; } }
      @media (max-width: 991px) {
        .box-info-product .exclusive span {
          padding: 8px 12px 10px;
          text-align: left; } }

[Szed]

Si rien ne semble indiquer la bordure 2 possibilité :

• Plus bas dans le CSS (des fois, on a du code CSS à plusieurs endroit pour un même élément, donc via les outils, faut scroller un peu).

• La bordure est sur un élément enfant ou parents de votre span.

[carnet85]

Merci pour ton aide je vais continuer de regarder ça (j'y suis depuis des heures et des jours), j'ai regardé beaucoup de fichier avec énormément de modifs mais rien ne semble fonctionner, je vais continuer à voir ça, j'espère que je finirai par trouver.

[carnet85]

Je relance le sujet parce que je n'arrive toujours pas à supprimer cet effet de relief au bouton panier de la fiche produit, si quelqu'un pouvait me donner la solution parce que après avoir modifié tous les fichiers possibles et imaginables je ne sais plus du tout quoi faire et je bloque complètement ...