Type de mise à jour : Code
Descriptif de la mise à jour : Amélioration du message d'accueil, modification de la structure du forum (catégories séparées), adaptation du contour-titre, costumisation de l'apparence des balises spoiler, quote et code.
Justification (si besoin) : J'avais envie de coder, et un CSS personnalisé au poil de cul près, c'est cool.
Copie des éléments de code changés :- - Balise Spoiler :
- Spoiler:
- - Avant :
/* Spoiler */
.spoiler_closed {
display:block;
font-family: Tahoma;
font-size: 11px;
color: #354056;
line-height: 125%;
background-color: #ccc6ae;
border: #ccc6ae;
border-style: solid;
border-left-width: 1px;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
}
.spoiler_closed.hidden {
display:none;
}
.spoiler_content {
display:block;
font-family: Tahoma;
font-size: 11px;
color: #354056;
line-height: 125%;
background-color: #ccc6ae;
border: #ccc6ae;
border-style: solid;
border-left-width: 1px;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
}
.spoiler_content.hidden {
display:none;
}
- - Après :
/* Spoiler */
.spoiler_closed {
display:block;
font-family: Tahoma;
font-size: 12px;
color: #21304d;
line-height: 125%;
background-color: #d66682;
border: #801a33;
border-style: double;
border-left-width: 3px;
border-top-width: 3px;
border-right-width: 3px;
border-bottom-width: 3px;
border-radius: 15px:
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
}
.spoiler_closed.hidden {
display:none;
}
.spoiler_content {
display:block;
font-family: Tahoma;
font-size: 12px;
color: #21304d;
line-height: 125%;
background-color: #d66682;
border: #801a33;
border-style: double;
border-left-width: 3px;
border-top-width: 3px;
border-right-width: 3px;
border-bottom-width: 3px;
border-radius: 15px:
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
padding: 5px;
}
.spoiler_content.hidden {
display:none;
}
- - Balises quote et code:
- Spoiler:
- - Avant :
.code{
font-family: Comic Sans Ms;
font-size: 11px;
color: #007575;
background-color: #ccc6ae;
border: #ccc6ae;
border-style: solid;
border-left-width: 1pxborder-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
}
.code div.cont_code {
max-height:200px;
overflow:auto;
}
.quote{
font-family: Tahoma;
font-size: 11px;
color: #354056;
line-height: 125%;
background-color: #ccc6ae;
border: #ccc6ae;
border-style: solid;
border-left-width: 1px;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px}
- - Après :
/*Code et Quote*/
.code{
font-family: Arial;
font-size: 12px;
color: #21304d;
background-color: #d66682;
border: #801a33;
border-style: double;
border-left-width: 3px;
border-top-width: 3px;
border-right-width: 3px;
border-bottom-width: 3px;
border-radius: 15px:
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
padding: 5px;
}
.code div.cont_code {
max-height:200px;
overflow:auto;
}
.quote{
font-family: Tahoma;
font-size: 12px;
color: #21304d;
line-height: 125%;
background-color: #d66682;
border: #801a33;
border-style: double;
border-left-width: 3px;
border-top-width: 3px;
border-right-width: 3px;
border-bottom-width: 3px;
border-radius: 15px:
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
padding: 5px;
}
- - Contours catégories:
- Spoiler:
- - Avant :
Rien de changé dans le code CSS, la couleur a été changée grâce à une balise dans la partie Modification de catégorie. Bref : contournement du pb. Il vient, à mon avis, du fait que l'identifiant java ait été sorti du table. Résultat, les titres de catégories et Sous-Forum prenaient la couleur du texte lambda tandis que les titre de forum, déjà hors du table, étaient bien en orange. Template à étudier pour voir comment faire.
- - Marche à suivre:
Aller dans : Panneau d'administration -> Général -> Forum -> Catégories et forums
Modifier les noms de catégories et forums, et dans la partie Titre, ajouter une balise html contenant la référence CSS du titre en question. Attention, il change en fonction du type de titre.
Catégorie : - Code:
-
<span class="cattitre">Titre</span>
Forum : - Code:
-
<span class="forumlink">Titre</span>