Les principaux identifiants CSS (Invision)

Forum gratuit : Le forum des forums actifs :: Vous et Forumactif... :: ressources pour utilisateurs forumactif :: Trucs et astuces

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

  • 0

Astuce Les principaux identifiants CSS (Invision)

Message par Hagel Mer 29 Avr 2009 - 8:09

Les principaux identifiants CSS (Invision)

Forumactif met à votre disposition de nombreuses versions de forums, notamment Invision.

Voir illustration :

Afin de vous lancer dans la personnalisation de cette version, nous vous proposons des éléments de travail à partir de la feuille de style CSS.

Les principaux identifiants CSS (Invision) Copy-c10 Sommaire :

  1. La Chatbox ;
  2. Les messages ;
  3. Le profil ;
  4. La messagerie privée ;
  5. La FAQ ;
  6. La liste des membres ;
  7. Fonction "Rechercher" ;
  8. Les sondages ;
  9. Les smileys ;
  10. Rédaction d'un message ;
  11. Barre de navigation ;
  12. Bannière, module et portail ;
  13. Divers.



Cette astuce a été proposée par Hagel.

Aucune reproduction possible sans notre accord, conformément à l’article L122-1 du CPI.
Hagel

Hagel
Membre actif

Féminin
Messages : 12047
Inscrit(e) le : 07/03/2008

https://equinox.superforum.fr/
Hagel a été remercié(e) par l'auteur de ce sujet.

Astuce Re: Les principaux identifiants CSS (Invision)

Message par Hagel Mer 29 Avr 2009 - 9:01

Différents codes CSS pour Invision - Chatbox


Permet de modifier les couleurs de fond des messages


Couleur de fond des lignes impaires (lignes 1, 3, 5, 7...)


Code:
.chatbox_row_1 {
background-color: #ecf3f7;
}

Couleur de fond des lignes paires (lignes 2, 4, 6, 8...)


Code:
.chatbox_row_2 {
background-color: #e1ebf2;
}

Permet de modifier la couleur de la liste des membres connectés à la Chatbox


Code:
.memberlist_row_1 {
background-color: #ecf3f7;
}

Permet de modifier la couleur du titre de la Chatbox


Code:
.chatbox-title,.chatbox-title a.chat-title {
color: #ffffff !important;
}

Permet de modifier l'alignement du titre de la Chatbox


Code:
.chatbox-title {
float: left;
margin: 0;
padding: 6px 5px 0 5px;
width: 15em;
}

Permet de modifier la taille d'écriture des messages dans la ChatBox


Code:
.chatbox {
font-size: 15px;
}


Cette astuce a été proposée par Hagel.

Aucune reproduction possible sans notre accord, conformément à l’article L122-1 du CPI.


Dernière édition par Hagel le Mer 29 Avr 2009 - 10:25, édité 1 fois
Hagel

Hagel
Membre actif

Féminin
Messages : 12047
Inscrit(e) le : 07/03/2008

https://equinox.superforum.fr/
Hagel a été remercié(e) par l'auteur de ce sujet.
  • 0

Astuce Re: Les principaux identifiants CSS (Invision)

Message par Hagel Mer 29 Avr 2009 - 9:30

Différents codes CSS pour Invision - Les messages


Permet de modifier la couleur de fond des messages


Code:
.post-container {
background-color: #EE0030;
}

Permet de modifier la couleur d'écriture des messages ainsi que celle des profils de message


Code:
.post-container {
color: #EE0030;
}

Permet de modifier la couleur de fond d'un message


Code:
.postbody {
background-color: #EE0030;
}

Permet de modifier la couleur de fond des profils dans les messages


Code:
.post {
background-color: #EE0030;
}

Change l'apparence de la séparation entre deux messages dans un sujet


Code:
.post {
border-bottom: 10px solid #EE0030;
}

Change la couleur du menu déroulant contenant le pseudo du posteur


Code:
.popmenubutton-new-out a {
background-color: #EE0030;
}

Change la couleur du fond du menu déroulant (une fois ouvert)


Code:
.popupmenu li {
background-color: #F73100;
}

Change le contour du menu déroulant (une fois ouvert)


Code:
.popupmenu {
background-color: #FFFFFF;
}

Permet de modifier la couleur de fond de la barre contenant les liens « Voir le sujet précédent · Voir le sujet suivant »


Code:
.topic-footer {
background-color: #EE0030;
}

Permet de modifier la couleur de fond de la barre contenant les boutons de modérations, et les permissions


Code:
.bar {
background-color: #EE0030;
}

Permet de modifier la couleur du texte dans la barre contenant les boutons de modération et les permissions


Code:
.bar {
color: #EE0030;
}

Cette astuce a été proposée par Hagel.

Aucune reproduction possible sans notre accord, conformément à l’article L122-1 du CPI.


Dernière édition par Hagel le Lun 4 Mai 2009 - 16:17, édité 3 fois
Hagel

Hagel
Membre actif

Féminin
Messages : 12047
Inscrit(e) le : 07/03/2008

https://equinox.superforum.fr/
Hagel a été remercié(e) par l'auteur de ce sujet.
  • 0

Astuce Re: Les principaux identifiants CSS (Invision)

Message par Hagel Mer 29 Avr 2009 - 9:52

Différents codes CSS pour Invision - Le profil


Permet de modifier la couleur de fond du profil


Code:
.box-content.profile {
background-color: #EE0030;
}

Permet de modifier la couleur de la barre contenant le pseudo de l'auteur d'un message de visiteur


Code:
#profile-advanced-details .message-header {
background: #EE0030;}

Permet de déterminer la position du pseudo de l'auteur, date et heure, dans cette même barre


Code:
#profile-advanced-details .message-date {
float: left;
}

Permet de déterminer la position des liens "Cacher" et "Supprimer" dans un message de visiteur.


Code:
#profile-advanced-details .message-footer {
text-align: left;
}

Détermine la taille de la deuxième colonne du profil avancé (colonne contenant avatar, rang, amis...)


Code:
#profile-advanced-right {
width: 120px;
}

Permet de modifier l'apparence des titres de l'onglet Statistiques, du profil avancé (Sujets, messages, informations...)


Code:
#profile-advanced-details .stats-field legend {
font-weight: bold; color: #EE0030;
}

Permet de modifier l'apparence du texte, surtout dans l'onglet Statistique


Code:
#profile-advanced-details .stats-field ul {
text-indent: 10px;
padding: 0;
color: #EE0030;
}

Code:
#profile-advanced-details .stats-field li {
color: #EE0030;
}

Cette astuce a été proposée par Hagel.

Aucune reproduction possible sans notre accord, conformément à l’article L122-1 du CPI.


Dernière édition par Hagel le Mer 29 Avr 2009 - 10:25, édité 1 fois
Hagel

Hagel
Membre actif

Féminin
Messages : 12047
Inscrit(e) le : 07/03/2008

https://equinox.superforum.fr/
Hagel a été remercié(e) par l'auteur de ce sujet.
  • 0

Astuce Re: Les principaux identifiants CSS (Invision)

Message par Hagel Mer 29 Avr 2009 - 10:24

Différents codes CSS pour Invision - La messagerie privée


Permet de modifier la couleur de l'onglet ouvert (Boite de réception, Messages envoyés, etc..)


Code:
ul.privmsg li {
background-color: #EE0030;
color: #fff;
}

A contrario ce code modifie la couleur des autres onglets, non-ouvert


Code:
ul.privmsg li a {
background-color: #EE0030;
}

Cette astuce a été proposée par Hagel.

Aucune reproduction possible sans notre accord, conformément à l’article L122-1 du CPI.
Hagel

Hagel
Membre actif

Féminin
Messages : 12047
Inscrit(e) le : 07/03/2008

https://equinox.superforum.fr/
Hagel a été remercié(e) par l'auteur de ce sujet.

Astuce Re: Les principaux identifiants CSS (Invision)

Message par Hagel Mer 29 Avr 2009 - 10:28

Différents codes CSS pour Invision - La FAQ


Permet de modifier le cadre contenant la réponse à une question


Code:
dl.faq dd p {
border: 1px solid #EE0030;
}

Permet de modifier la barre entre deux questions


Code:
dl.faq .question {
border-bottom: 1px solid #EE0030;
}

Cette astuce a été proposée par Hagel.

Aucune reproduction possible sans notre accord, conformément à l’article L122-1 du CPI.
Hagel

Hagel
Membre actif

Féminin
Messages : 12047
Inscrit(e) le : 07/03/2008

https://equinox.superforum.fr/
Hagel a été remercié(e) par l'auteur de ce sujet.

Astuce Re: Les principaux identifiants CSS (Invision)

Message par Hagel Mer 29 Avr 2009 - 10:33

Différents codes CSS pour Invision - La liste des membres


Modifie le cadre autour de la présentation d'un profil


Code:
.member {
background-color: #fff;
border: 1px solid #EE0030;
}

Modifie le fond et la bordure de l'avatar dans la liste membre


Code:
.member-list .popmenubutton .mini-avatar {
border: 1px solid #EE0030;
background-color: #EE0030;
}

Modifie la couleur du texte dans l'encart profil (dernières visites, messages, divers options du profil)


Code:
.member p {
color: #EE0030;
}

Modifie le fond de la catégorie membre (attention pas le fond d'un cadre profil, mais celui derrière)


Code:
div.borderwrap .member-list {
background-color: #EE0030;
}

Cette astuce a été proposée par Hagel.

Aucune reproduction possible sans notre accord, conformément à l’article L122-1 du CPI.
Hagel

Hagel
Membre actif

Féminin
Messages : 12047
Inscrit(e) le : 07/03/2008

https://equinox.superforum.fr/
Hagel a été remercié(e) par l'auteur de ce sujet.
  • 0

Astuce Re: Les principaux identifiants CSS (Invision)

Message par Hagel Mer 29 Avr 2009 - 10:38

Différents codes CSS pour Invision - Recherche


Permet de modifier la couleur de fond


Code:
#search_menu {
background-color: #EE0030;
border: 1px solid #ffffff;
}

Permet de modifier a couleur de la bordure de recherche


Code:
#search_menu input.post {
border: 1px solid #EE0030;
}

Modifie le widget "Rechercher" et la page "Recherche avancée"


Code:
.advanced-search .search-footer {
background-color: #EE0030;
border-top: 1px solid #ffffff;
}

Cette astuce a été proposée par Hagel.

Aucune reproduction possible sans notre accord, conformément à l’article L122-1 du CPI.
Hagel

Hagel
Membre actif

Féminin
Messages : 12047
Inscrit(e) le : 07/03/2008

https://equinox.superforum.fr/
Hagel a été remercié(e) par l'auteur de ce sujet.

Astuce Re: Les principaux identifiants CSS (Invision)

Message par Hagel Mer 29 Avr 2009 - 10:43

Différents codes CSS pour Invision - Les sondages


Change le fond du sondage, une fois voté


Code:
.polls {
background-color: #EE0030;
}

Change la couleur des options du sondage


Code:
.polls dl {
color: #EE0030;
}

Cette astuce a été proposée par Hagel.

Aucune reproduction possible sans notre accord, conformément à l’article L122-1 du CPI.
Hagel

Hagel
Membre actif

Féminin
Messages : 12047
Inscrit(e) le : 07/03/2008

https://equinox.superforum.fr/
Hagel a été remercié(e) par l'auteur de ce sujet.

Astuce Re: Les principaux identifiants CSS (Invision)

Message par Hagel Mer 29 Avr 2009 - 10:45

Différents codes CSS pour Invision - Les smileys


Modifie la bordure du cadre contenant les smileys lors de la rédaction d'un message


Code:
.smiley-container {
border: 1px solid;
color: #EE0030;
}

Change la couleur de fond du menu déroulant "Voir plus de Smileys"


Code:
.smiley-selector {
background-color: #EE0030;
}

Change la couleur du contour de la box (où est écrit HTML activé, BBcode activé, etc.)


Code:
#smiley-box {
background-color: #EE0030;
border: 1px solid #D70000;
}

Cette astuce a été proposée par Hagel.

Aucune reproduction possible sans notre accord, conformément à l’article L122-1 du CPI.


Dernière édition par Hagel le Mer 29 Avr 2009 - 10:53, édité 1 fois
Hagel

Hagel
Membre actif

Féminin
Messages : 12047
Inscrit(e) le : 07/03/2008

https://equinox.superforum.fr/
Hagel a été remercié(e) par l'auteur de ce sujet.
  • 0

Astuce Re: Les principaux identifiants CSS (Invision)

Message par Hagel Mer 29 Avr 2009 - 10:52

Différents codes CSS pour Invision - Rédaction d'un message


Permet de modifier la couleur du contour de la zone de texte (cadre contenant les boutons de mise en forme)


Code:
.messaging-box {
background-color: #EE0030;
border: 1px solid #;
}

Change la bordure de la zone de texte, donc par extension le fond de la zone de texte, voire la mise en forme du texte lors de l'écriture d'une réponse


Code:
.messaging-box textarea {
border: 2px inset #105289;
}

Cette astuce a été proposée par Hagel.

Aucune reproduction possible sans notre accord, conformément à l’article L122-1 du CPI.
Hagel

Hagel
Membre actif

Féminin
Messages : 12047
Inscrit(e) le : 07/03/2008

https://equinox.superforum.fr/
Hagel a été remercié(e) par l'auteur de ce sujet.
  • 0

Astuce Re: Les principaux identifiants CSS (Invision)

Message par Hagel Mer 29 Avr 2009 - 11:05

Différents codes CSS pour Invision - Barre de navigation


Couleur du texte, par extension mise en forme de celui-ci:


Code:
#submenu ul li a {
color: #EE0030;
}

Modifie le fond au survol du curseur sur un élément de la barre de navigation


Code:
#submenu ul li a:hover {
background-color: #EE0030;
}

Modifie la barre sous la barre de navigation (contenant "Connecté sous { USERNAME }, etc..)


Code:
#userlinks {
background-color: #EE0030;
border-bottom: 1px solid #cadceb;
}

Même chose pour les invités


Code:
#userlinks.not-connected {
background-color: #EE0030;
border-bottom: 1px solid #cadceb;
}

Modifie la couleur de l'intitulé dans le récapitulatif de page


Code:
#navstrip {
color: #EE0030;
}

Modifie la couleur de fond de la barre de navigation


Code:
#submenu {
background-color: #EE0030;
}

Cette astuce a été proposée par Hagel.

Aucune reproduction possible sans notre accord, conformément à l’article L122-1 du CPI.
Hagel

Hagel
Membre actif

Féminin
Messages : 12047
Inscrit(e) le : 07/03/2008

https://equinox.superforum.fr/
Hagel a été remercié(e) par l'auteur de ce sujet.

Astuce Re: Les principaux identifiants CSS (Invision)

Message par Hagel Mer 29 Avr 2009 - 14:15

Différents codes CSS pour Invision - Bannière, modules et Portail


Permet de modifier la couleur de fond derrière la bannière


Code:
div#logostrip {
background-color: #EE0030;
}

Changer l'encart contenant le titre d'un widget


Code:
.module .maintitle {
padding: 100px;
}

Modifie l'écriture du titre des widgets (donc mise en forme)


Code:
.module .maintitle h3 {
float: none;
font-size: 1em;
color: #EE0030;
}

Modifie le texte des widgets (mais pas les liens)


Code:
.module .box-content {
color: #EE0030;
}

Change la nature de la police des modules centraux du portail


Code:
.module .postbody {
padding: 0;
color: #EE0030;
}

Change la mise en forme du pied de page des widgets (Par exemple, "Commentaires : 0")


Code:
.module .postbody .post-footer {
color: #EE0030;
}

Cette astuce a été proposée par Hagel.

Aucune reproduction possible sans notre accord, conformément à l’article L122-1 du CPI.
Hagel

Hagel
Membre actif

Féminin
Messages : 12047
Inscrit(e) le : 07/03/2008

https://equinox.superforum.fr/
Hagel a été remercié(e) par l'auteur de ce sujet.
  • 0

Astuce Re: Les principaux identifiants CSS (Invision)

Message par Hagel Mer 29 Avr 2009 - 14:51

Différents codes CSS pour Invision - Divers


Changer la mise en forme de "anniversaire" "Chatbox" "statistiques"...


Code:
.formsubtitle {
padding: 5px;
color: #EE0030;
}

Changer la mise en forme du titre description du forum (en-dessous ou à coté de la bannière)


Code:
div#logostrip {
min-height: 70px;
color: #EE0030;
}

Change la mise en forme de la description sous la bannière


Code:
#site-desc {
margin: 8px;
color: #EE0030;
}

Change la mise en forme du titre du forum (à coté ou dessous bannière)


Code:
div#logostrip #main-title h1 {
padding-top: 0;
color: #EE0030;
}

Agrandissement de la zone de saisie email pour le formulaire


Code:
textarea {
width:650px;
}

Cette astuce a été proposée par Hagel.

Aucune reproduction possible sans notre accord, conformément à l’article L122-1 du CPI.
Hagel

Hagel
Membre actif

Féminin
Messages : 12047
Inscrit(e) le : 07/03/2008

https://equinox.superforum.fr/
Hagel a été remercié(e) par l'auteur de ce sujet.

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

Forum gratuit : Le forum des forums actifs :: Vous et Forumactif... :: ressources pour utilisateurs forumactif :: Trucs et astuces

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