WooFrance Dépannage et support WordPress WooCommerce › Forums › Forum de Support WooCommerce › Couleur de texte sur bouton et bidouillage de CSS
- Ce sujet contient 1 réponse, 2 participants et a été mis à jour pour la dernière fois par Guy, le il y a 7 années et 1 mois.
-
AuteurMessages
-
3 octobre 2017 à 16 h 34 min #39903
Salut à tous,
Alors voilà, j’avais bidouillé (je n’y connais rien) un bouton en CSS pour l’ajouter sur une page de mon WooCommerce et en me baladant sur mon site aujourd’hui je me rends compte que le bouton « poursuivre les achats » (qui est déjà là par défaut)et en vert sur fond vert…
J’ai essayé de retrouver dans le CSS additionnel si y avait du vert quelque part mais je trouve pas.
Comment je peux faire pour mettre le vert du bouton « poursuivre les achats » en blanc.
Code bidouillé, récupéré sur le net :
/*
Vous pouvez ajouter du CSS personnalisé ici.Cliquez sur l’icône d’aide ci-dessus pour en savoir plus.
*/.woocommerce-billing-fields input {
text-transform: initial!important;
}.btn.btn-border-w {
font-weight: bold;
text-decoration: none;
color: rgba(255, 255, 255, 1);
background: rgb(110,113,33,1.0);
padding: 20px 40px;
border-radius: 8px;
font-weight: normal;
transition: all 0.3s ease-in-out;
box-shadow: 0 0px 30px rgba(255, 255, 255, 1);
}.button {
display: inline-block;
text-align: center;
vertical-align: middle;
padding: 14px 80px;
border: 0px solid #a12727;
border-radius: 23px;
background: #647021;
background: -webkit-gradient(linear, left top, left bottom, from(#647021), to(#788c3c));
background: -moz-linear-gradient(top, #647021, #788c3c);
background: linear-gradient(to bottom, #647021, #788c3c);
text-shadow: #175919 5px 3px 4px;
font: normal normal bold 24px arial;
color: #ffffff;
text-decoration: none;
}
.button:hover,
.button:focus {
background: #788628;
background: -webkit-gradient(linear, left top, left bottom, from(#788628), to(#90a848));
background: -moz-linear-gradient(top, #788628, #90a848);
background: linear-gradient(to bottom, #788628, #90a848);
color: #ffffff;
text-decoration: none;
}
.button:active {
background: #3c4314;
background: -webkit-gradient(linear, left top, left bottom, from(#3c4314), to(#788c3c));
background: -moz-linear-gradient(top, #3c4314, #788c3c);
background: linear-gradient(to bottom, #3c4314, #788c3c);
}
.button:before{
content: « \0000a0 »;
display: inline-block;
height: 24px;
width: 24px;
line-height: 24px;
margin: 0 4px -6px -4px;
position: relative;
top: 0px;
left: 0px;
background: url(« data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAABWUlEQVRIie2SMUoDURRFz5UsQYJVGMIsQKxtZLD/AwbBxrW4BJdgL+SnlsFCa3EBIQypxC2M+CySH74hzp8hlrkwxfzHu/e9+y4ckIDaipPJhKZpboB7YAlce+/nfQSO2opN05wDD8AxcAY8OefG/yYAnEoaSKtFJWVA1UekVcDMHs1sbmZIwswAgki+t8BsNvsACmABICl8GR3tSlmE934JFGa2CG/rjTI62NWaohjOuRFQAXlkF0ANXP6Vrs4CkcizpF9Tm1kNXHjv6+2epEUxEnbd7erpJQCrQ2+Rh9/vvQXKshyZWSVpHN0gWLTfBmVZjoANeYismdWSil3+Q8cjO+cySRUwjm1ZT1547xd/9SYFQnKATXLC5CnypIBz7gR4kZRvHbQGiul02koO6RtcScrD1H3JAQaJ+ruZfUkarFNT08GWGK0bDIfDV+DWzD6Bt77kB3TCD1cuo2reO+LVAAAAAElFTkSuQmCC ») no-repeat left center transparent;
background-size: 100% 100%;
}Merci à tous !
1 user thanked author for this post.
3 octobre 2017 à 20 h 20 min #39912Salut Ibrahim,
Pour avoir le plaisir et la satisfaction de l’avoir fait toi-même, tu vas sur http://www.code-couleur.com
Dans la case prévue tu colles chaque code couleur de ton css et tu vois le résultat. Tu découvriras facilement ceux à modifier. Et tu pourras choisir celui de remplacement.
Content(e) de mon aide ? Vous pouvez m'offrir un café ! 🙂
Avant d'appeler à l'aide: Dépannage Woocommerce
Vous manquez de trafic ? Payez le prix d'un seul backlink et obtenez-en beaucoup plus !
-
AuteurMessages
- Vous devez être connecté pour répondre à ce sujet.