[Facile] Catégories #2 - Clyde Ale

Je vous propose une mise en forme de catégories :3
Vous pouvez changer les couleurs. Le titre de forum devient blanc lorsque l'on passe le curseur dessus.
Amusez vous bien!

Coucou @Clyde Ale :)
J'ajoute tes exercices à l'index mais je préfère mettre le niveau "Difficile" comme on s'attaque aux templates. En fait le niveau Intermédiaire chez nous se trouve quand on commence à s'occuper des pages d'accueil ! :D

Merci Cheshire :3

Exercice bien sympa
j'ai juste manqué de place pour les sous forums *ahem*



Le rendue : https://i.servimg.com/u/f57/19/46/10/54/exo_ca10.png ~

*craque ses doigts pour la correction*

Coucou @Alek ! Alors déjà, excellent travail sur ses catégories, je vois que tu maîtrises à merveille les valeurs templates et ça, ça fait chaud dans le kokoro ! Néanmoins, tu te doutes que j'ai quelques remarques à faire, sinon c'est carrément pas drôle /PAN

Par exemple, ici :

Code:

<div class="bande">
  <div class="titre">
    Gros titre bouyah
  </div>
</div>

Il te manque une valeur template /PAN
Rappelle toi de notre cours, je t'avais expliqué qu'à cet endroit, c'est un titre que l'on doit rajouter dans le panneau d'administration pour chaque catégorie. Et pour qu'il soit différent et s'adapte à ce que tu y écriras dans le panneau d'admin, il faut alors que ce soit une valeur template. Là le souci, c'est que toutes les caté auront ce même titre !
Du coup, ça se présenterait plutôt comme ça :

Code:

<!-- BEGIN catrow --><!-- BEGIN tablehead -->
<div class="titre">{catrow.tablehead.L_FORUM}</div>

<!-- END tablehead -->
<!-- BEGIN cathead -->
<!-- END cathead -->

Surtout ne pas oublier les boucles sinon ça ne fonctionne pas et le titre n'apparaît pas !

Ensuite, quelques petites remarques sur le CSS même si dans l'ensemble, c'est superbement geré et bravo pour l'intégration du display-flex, t'as géré !
Du coup, voilà ce qui me chagrine :

Code:

::-webkit-scrollbar {
      width: 3px; /*largeur de la scrollbar verticale*/
      height: 2px; /*hauteur de la scrollbar horizontale*/
      background-color: #5e1b1b;}

      ::-webkit-scrollbar-track {
      background-color: #762323; /*couleur du fond de la scrollbar*/}

    ::-webkit-scrollbar-thumb { /*la petite bande qui monte/descend*/
      background-color: #5e1b1b; /*couleur de l'ascenseur*/;
      }


Ca, tu n'as pas besoin de le mettre dans tes catégories. En gros, comme le sélecteur à "::", il agira sur la totalité du forum. Si tu veux qu'il n'agisse que sur les catégories, tu dois rajouter le nom du bloc de la catégories devant, par exemple :

Code:

.categorie::-webkit-scrollbar

et etc pour toutes tes autres valeurs dans le genre.

Ensuite, le display flex justement ! Déjà, très bonne utilisation de ça comme je te disais plus haut, seulement j'ai une petite remarque toute bête, plus de l'ordre de la pratique que d'autre chose.

Code:

.display {
 display: flex;
}

N'oublies jamais de rajouter, après le display-flex, ceci :

Code:

flex-wrap:wrap; /*aligne les blocs dans une largeur définie en empêchant de dépasser et de casser le code*/

Sinon pour le reste, pour moi, tout est bon ! Les couleurs sont superbes, très bien agencées et ça envoie du bois ! Il ne te reste plus qu'à fair ces petites corrections et tout sera good pour toi ~
Un très bon exercice pour apprendre les catégories d'ailleurs, GG à @Clyde Ale pour l'avoir proposé !