Code avatar + template topics_list_box

3 participants

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Code avatar + template topics_list_box

Message par illyria Dim 23 Avr 2017 - 10:17

Bonjour,
Je sollicite à nouveau votre aide sur 3 points. I love you

Capture d'écran :
000000 - Code avatar + template topics_list_box Captur11

Point 1.
Il faut zoomer l'image pour le voir mais le contour de l'avatar ne colle pas réellement à ce dernier : en haut et à gauche il semble y avoir 1 pixel d'écart entre l'avatar et le contour noir. Un décalage que l'on retrouve également quand on passe la souris dessus et qu'on active le hover.
Point 2.
J'aimerais que les informations du profil (quand on est en hover) soient en opacité 1. Il faudrait que l'avatar reste sur cette opacité, mais que les éléments du profil soient, eux, bien visibles par-dessus.

Je pense que ces 2 points peuvent être résolus dans le CSS mais je ne trouve pas où, je vous le mets ci-dessous.
Spoiler:

Point 3.
Il concerne le template topics_list_box. Sur la capture d'écran en bas, je me retrouve avec une colonne non voulue (flèche rouge). J'ai essayé de l'enlever mais à chaque fois les résultats ne sont pas satisfaisants... Je vous laisse mon template ci-dessous.
Spoiler:

Je vous remercie par avance de votre aide ! I love you
illyria

illyria
***

Féminin
Messages : 121
Inscrit(e) le : 19/04/2006

http://bluebubble.forumactif.com/
illyria a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code avatar + template topics_list_box

Message par Walt Dim 23 Avr 2017 - 12:04

Bonjour,

Avant toute chose, je vous rappelle qu'il est interdit de poster plusieurs questions dans un même sujet. A éviter à l'avenir...

Pour le point n°1 il va nous falloir l'URL du forum, et un forum accessible aux invités pour que l'on puisse voir le problème sur un sujet.

Pour le point n°2, retirez l'instruction du CSS relative à l'opacité, et mettez un fond blanc transparent à la div :
Code:
background-color: rgba(255,255,255,0.5);

Vous pouvez augmenter ou diminuer la transparence en modifiant 0.5 : plus vous augmenter vers le 1, plus c'est opaque, plus vous allez vers 0, plus c'est transparent.

Et pour le point n°3, il s'agit de la colonne qui contient l'icône de sujet. Vous souhaitez la supprimer totalement ?...

Cordialement,
Walt
Walt

Walt
Modéractif
Modéractif

Masculin
Messages : 6081
Inscrit(e) le : 08/09/2015

Walt a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code avatar + template topics_list_box

Message par lmc38510 Dim 23 Avr 2017 - 12:07

Bonjour "illyria" Hi

Pour le point 1 corrige cette partie de ton CSS Very Happy

Code:
.avatar_mess
{
  /*display: block;*/                /* Ligne supprimée*/
  border: 0px solid #000;          /* bordure modifiée ... passée à 0px */
  width: 200px;
  height: 320px;
  overflow: hidden;
  background: #ffffff;
  border: 1px solid #000000;
  opacity:1;
  -moz-transition: opacity 0.8s ease-in-out;
  -webkit-transition: opacity 0.8s ease-in-out;
  -o-transition: opacity 0.8s ease-in-out;
  transition: opacity 0.8s ease-in-out;
}

Si tu souhaites conserver le cadre bordure noir sur le profil
Corrige cette partie du CSS comme ceci:
Code:
.profil_mess
{
position: absolute;
display: block;
width: 190px;
height: 310px;
margin: auto;
padding: 5px;
overflow: auto;
background: #ffffff;
border: 1px solid #000;                  /* ajout d'une bordure*/
color: #c5bea0;
font-size: 11px;
opacity:0;
-moz-transition: opacity 0.8s ease-in-out;
-webkit-transition: opacity 0.8s ease-in-out;
-o-transition: opacity 0.8s ease-in-out;
transition: opacity 0.8s ease-in-out;
}
lmc38510

lmc38510
*****

Masculin
Messages : 912
Inscrit(e) le : 22/02/2012

https://newparadigme.forumactif.com/
lmc38510 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code avatar + template topics_list_box

Message par illyria Dim 23 Avr 2017 - 14:12

Bonjour à vous deux. Smile

lmc38510, merci (à nouveau !) pour ton aide, je viens de résoudre mon point 1 grâce à ta modification. I love you

Walt, toutes mes excuses pour ce manquement au règlement, je ne me souvenais pas de ce point, cela ne se reproduira pas. Embarassed

Concernant le point 2, je ne comprends pas à quel endroit du CSS je dois retirer la mention de l'opacité et mettre ce nouveau code ? J'ai tenté de le faire sur le profil_mess:hover mais ça ne fonctionne pas donc j'ai certainement raté quelque chose. Smile

Pour le point 3, non je ne souhaite pas tout enlever, juste la petite case qui se situe entre l'icone du sujet et le titre du sujet. Je n'arrive pas à comprendre où elle se situe dans mon template...
illyria

illyria
***

Féminin
Messages : 121
Inscrit(e) le : 19/04/2006

http://bluebubble.forumactif.com/
illyria a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code avatar + template topics_list_box

Message par lmc38510 Dim 23 Avr 2017 - 16:00

illyria a écrit:Concernant le point 2, je ne comprends pas à quel endroit du CSS je dois retirer la mention de l'opacité et mettre ce nouveau code ? J'ai tenté de le faire sur le profil_mess:hover mais ça ne fonctionne pas donc j'ai certainement raté quelque chose. Smile
Je suppose que tu parles de la visibilité de ton texte
000000 - Code avatar + template topics_list_box Illyri11

il faut retoucher ton CSS:
Code:
.profil_mess:hover
{
opacity: 1.0;  /* modifier de 0.5 ...à 1.0 */
-moz-transition: opacity 0.8s ease-in-out;
-webkit-transition: opacity 0.8s ease-in-out;
-o-transition: opacity 0.8s ease-in-out;
transition: opacity 0.8s ease-in-out;
}
lmc38510

lmc38510
*****

Masculin
Messages : 912
Inscrit(e) le : 22/02/2012

https://newparadigme.forumactif.com/
lmc38510 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code avatar + template topics_list_box

Message par illyria Mar 25 Avr 2017 - 11:37

Bonjour lmc38510 Very Happy

Merci pour ton retour !
Oui c'est bien ça, il s'agit de l'opacité du texte. Mais si je change comme indiqué, alors l'avatar s'efface complètement et un fond blanc apparaît. J'aurais voulu que l'opacité de l'avatar reste à 0.8, mais que les informations du profil soient, elles, en opacité 1. Je ne sais pas si c'est faisable en réalité ! What a Face
illyria

illyria
***

Féminin
Messages : 121
Inscrit(e) le : 19/04/2006

http://bluebubble.forumactif.com/
illyria a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code avatar + template topics_list_box

Message par lmc38510 Mar 25 Avr 2017 - 13:10

Hi "illy"

Dans ton CSS change cette partie:
Code:
.profil_mess
{
position: absolute;
display: block;
/* font-family: indie flower;    Ligne supprimée */
width: 190px;
height: 310px;
margin: auto;
padding: 5px;
overflow: auto;
background: #ffffff;
color:#000;  /*    anciennement  #c5bea0;*/
font-size: 11px;
opacity:0;
-moz-transition: opacity 0.8s ease-in-out;
-webkit-transition: opacity 0.8s ease-in-out;
-o-transition: opacity 0.8s ease-in-out;
transition: opacity 0.8s ease-in-out;
}

Color (du texte) passe de -> #c5bea0 à -> #000
font supprimée -> font-family: indie flower;
lmc38510

lmc38510
*****

Masculin
Messages : 912
Inscrit(e) le : 22/02/2012

https://newparadigme.forumactif.com/
lmc38510 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code avatar + template topics_list_box

Message par Walt Mar 25 Avr 2017 - 13:22

Bonjour,

@lmc38510 en réalité @illyria ne veut pas modifier la couleur du texte, elle veut simplement que le fond de la div ait une opacité de 80% mais que cela n'affecte pas l'opacité du texte.

La solution je l'ai donnée mais j'attends toujours l'URL du forum pour pouvoir la préciser. Wink

Cordialement,
Walt
Walt

Walt
Modéractif
Modéractif

Masculin
Messages : 6081
Inscrit(e) le : 08/09/2015

Walt a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code avatar + template topics_list_box

Message par lmc38510 Mar 25 Avr 2017 - 13:34

Bonjour "Walt"

Un lien pour consulter -> http://yettobenamed.forumactif.com/t1-votre-1er-sujet

Edit
illyria a écrit:Oui c'est bien ça, il s'agit de l'opacité du texte. Mais si je change comme indiqué, alors l'avatar s'efface complètement et un fond blanc apparaît. J'aurais voulu que l'opacité de l'avatar reste à 0.8, mais que les informations du profil soient, elles, en opacité 1. Je ne sais pas si c'est faisable en réalité !
lmc38510

lmc38510
*****

Masculin
Messages : 912
Inscrit(e) le : 22/02/2012

https://newparadigme.forumactif.com/
lmc38510 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code avatar + template topics_list_box

Message par Walt Mar 25 Avr 2017 - 13:55

Merci bien, il suffit donc de remplacer pour .profil_mess le background :

Code:
background: #ffffff;

par

Code:
background: rgba(255,255,255, 0.3);

Cordialement,
Walt
Walt

Walt
Modéractif
Modéractif

Masculin
Messages : 6081
Inscrit(e) le : 08/09/2015

Walt a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code avatar + template topics_list_box

Message par illyria Mar 25 Avr 2017 - 15:19

Merci beaucoup à tous les deux ! J'ai effectivement remplacé comme indiqué et ça fonctionne parfaitement. ::fleur::

Souhaitez-vous que j'édite mon titre/premier message, que je mette en résolu et que je poste un nouveau sujet pour le point 3 ?
illyria

illyria
***

Féminin
Messages : 121
Inscrit(e) le : 19/04/2006

http://bluebubble.forumactif.com/
illyria a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Code avatar + template topics_list_box

Message par Walt Mar 25 Avr 2017 - 17:27

Oui, faisons comme cela Wink

Cordialement,
Walt
Walt

Walt
Modéractif
Modéractif

Masculin
Messages : 6081
Inscrit(e) le : 08/09/2015

Walt a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut

- Sujets similaires

Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum