Problème pour personnaliser les sous-forums (AWESOMEBB)

[Hoyt]

Détails techniques

Version du forum : AwesomeBB
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Google Chrome
Capture d'écran du problème :

Voir l'image:

Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : (lien masqué, vous devez poster pour le voir)

Description du problème

Bonjour,

Je viens de me créer un nouveau forum pour faire des tests pour mon forum principal et je rencontre un problème pour personaliser un élément sur celui-ci.

En effet, je ne parviens pas à personnaliser l'apparence des sous-forums (TEST1 et TEST2 sur le screen). J'aimerais ajouter un cadre autour et peut-être même un background.

Également, retirer la séparation entre les deux, j'ai essayé différentes astuces mais rien ne fonctionne.

Merci !

[*Splash*]

Hi,

Pour le classement et l'affichage des sous-forums sur l'index tu as cette astuce

Dans le template index_box
Remplacer cette ligne {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS} par celle-ci :

Code:

<div class="s_forum">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</div>

Mettre ce code javascript Sur l'index :

Code:

$(function() {
   var sep = '-', max_by_line = 4;
   $('.s_forum').each(function() {
      var nth = 0;
      $('a.gensmall', this).each(function(){
         var next = this.nextSibling;
         if (next && next.nodeType == 3 && next.nodeValue == ", ") {
            if (++nth % max_by_line) $(next).replaceWith(sep);
            else $(next).replaceWith('<br>');
         }
      });
   });
});

La variable sep va déterminer le séparateur entre chaque sous-forum. Ne rien inscrire correspondra à un espace
La variable max_by_line déterminera le retour à la ligne une fois le chiffre inscrit atteint. Une valeur égale à 0 sera identique à une valeur égale à 1, le retour à la ligne se fera après chaque sous-forum

[*Splash*]

Re,

Si tu veux mettre un cadre autour des sous-forums tu peux mettre ceci à la CSS :

Code:

.s_forum {
    background-color: #COLOR!important;
}

[Hoyt]

Merci, cela fonctionne.

Cependant, voici le résultat : https://gyazo.com/903abcb291741132f442af2219b4e8da

J'ai donc transformé cela en « span », ce qui permet d'adapter automatiquement mais il reste un petit problème. Le bloc reste entier alors que j'aimerais séparer chaque sous forum avec un petit espace entre les deux.

Comme ceci : https://gyazo.com/dd3ad7a20bd048aa8dd626eca3553b6d

Tu aurais une solution, s'il te plait ?

[*Splash*]

Re,

Tu peux tester, modifier à ta guise ce code CSS :

Code:

/* affichage des sous-forums */     
.forum-section .gensmall {
font-family: Georgia;
font-style: italic; 
background-color: #D3D3D3;
border-radius: 10px; 
border: 1px solid rgb(102, 153, 204);
box-shadow: 3px 3px 3px #69c;
padding-right:10px;
padding-left:10px;
padding-bottom: 3px;
padding-top:3px;
text-indent: 15px;
overflow: hidden;
}
/* fin affichage des sous-forums */

[Hoyt]

Nice, merci !