[Commande Codage][Terminé - Mäven] Template catégorie pour Strange Town

Coucou :3 comme la tambouille travaille super bien, j'ai décidée de me tourner vers vous pour une commande de codage Là ce sera pour les catégories (maquette by me) mais le reste arrivera aussi xD faut juste me laisser le temps de le faire


Type de commande (modification de templates, en-tête, qeel, mise en page de messages, pub, autres) : Template catégorie
Pour quel forum : comme il est en construction, je met le lien sous hide :3
Maquette graphique/schéma/croquis : https://nsa40.casimages.com/img/2020/04/05/200405051902536382.png
Informations utiles (couleurs, images, etc, …) :
Polices utilisés : Phosphorus Bromide (sur dafont) mais j'ai un code pour l'utiliser en tant que police de forum Donc vous pouvez mettre Arial en attendant :3
Tailles polices :
Titre catégorie 80px
Pseudo, dernier message... etc : 15px

Tailles images :
Avatar ; 90x200. Ici j'aimerais si c'est possible un effet noir et blanc et qu'au survol la couleur de l'avatar apparaisse
Image description (le paysage à gauche) : 280x234. Ici il me faudrait un effet d'estompage comme représenté sur l'image.
L'image pour cacher les sous-forums 200x200. Ici il me faudrait également une image pour le "fond" des sous-forums
Forum : les forums font 700x234 (normalement 900, mais minus les sous-forums ça donne 700 :p) et ils sont en opacité 90%
Il y a une ligne de séparation entre les sous-forums et l'image de description. Elle fait 7x234

Le titre de catégorie est une image

La décoration à gauche de l'avatar, il faudrait, si vous pouvez le faire, que ça chevauche l'avatar, un peu comme le schéma quoi xD

Taille forum : 900px

La couleur du fond des forums est : #756c64
La couleur de la police pour pseudo, dernier message... etc c'est : #ffffff
La couleur pour forum c'est #919191 et elle a plusieurs effets. une ombre portée #000000 de taille 3 et distance 3, un dégradé de plusieurs couleurs mais je sais pas si ce sera faisable en css   , elle a une lueur interne en #e0dedc de 76% en mode superposition (si c'est trop compliqué, au pire je peux fournir directement l'image xD) y'a aussi un biseautage mais ça je sais pas du tout si ça se fait en css  

L'image du fond (qui va changer à chacune des catégories) fait 900x700

Les images :
https://nsa40.casimages.com/img/2020/04/05/200405054055483344.png - avatar
https://nsa40.casimages.com/img/2020/04/05/200405054055420689.png - cache sous-forum et fond sous-forum
https://nsa40.casimages.com/img/2020/04/05/200405053923255868.png - décoration à côté de l'avatar
https://nsa40.casimages.com/img/2020/04/05/200405053923196976.png - dernier message
https://nsa40.casimages.com/img/2020/04/05/200405054336383437.png - image de fond
https://nsa40.casimages.com/img/2020/04/05/200405062451890523.png - image description
https://nsa40.casimages.com/img/2020/04/05/200405062824635893.png - titre catégorie
https://nsa40.casimages.com/img/2020/04/05/200405062925697665.png - titre forum

[Pour les modifications de templates] Version du forum (PhpBB2, PhpBB3, PunBB, Invision, ModernBB ou AwesomeBB) : ModernBB
Le code pourra-t-il être mis en libre service ensuite ? Pas pour le moment. Dès que la V2 sera en ligne, je vous le dirai et le code pourra alors être mit en LS
La commande peut-elle être prise en charge par un membre ou uniquement par les râleuses ? Hum, tout ce que je demande, c'est que la personne qui code mon template sache ce qu'elle fait ^^

Si vous avez besoin d'autre chose, n'hésitez pas Merci d'avance

Coucou !

Je prends en charge la commande

Je te dis s'il manque quelque chose rapidement

Bisous

Yay merci Mäven Surtout n'hésite pas si tu as des remarques ou si tu remarque que quelque chose manque

J'ai surtout des questions déjà

Les 900px c'est bien pour la largeur totale de ton index ?

Ensuite je n'ai pas comprit ceci :

Image description (le paysage à gauche) : 280x234. Ici il me faudrait un effet d'estompage comme représenté sur l'image.

De quoi parles-tu quand tu dis effet d'estompage ?

Oui c'est bien pour la largeur totale désolé je me suis mal exprimée ._.

De quoi parles-tu quand tu dis effet d'estompage ? Ah oui désolé, hum, comment dire ça... l'image a un effet d'opacité 0 vers la fin ? elle est légèrement effacé ? je sais pas trop comment dire ça

Coucou !

alors, voilà ce que je te propose :
http://commandes-maven-tamb.forumactif.com/

Qu'en penses-tu ?

Pour l'image de fond de description le plus simple serait que tu fasse l'opacité changeante directement en image. C'est possible ?

Ce qui n'est pas encore fait :
> Le changement de fond selon la catégorie.
> La gestion de l'image de fond selon le nombre de forum (il faut que tu me dise comment tu vois les choses ici)
> et le fait de retirer les images dans le fil d'ariane quand on est dans un forum

Coucou toi Alors alors, c'est très bien mais j'aimerais si possible une toute petite modification. Est-ce que ce serait possible de légèrement descendre le titre des forums ? Je trouve en fait qu'il est un peu trop haut. Et sinon il manque l'effet de noir et blanc et le hover couleur, mais si tu n'es pas capable de faire ça c'est pas grave ne t'en fais pas

La gestion de l'image de fond selon le nombre de forum (il faut que tu me dise comment tu vois les choses ici) Je ne comprends pas trop ta question, en fait (sorry, moi pas bien réveillée)

Pour l'image de fond de description le plus simple serait que tu fasse l'opacité changeante directement en image. C'est possible ? oui c'est possible pas de soucis

Pour l'effet au survol : oubli de ma part ! Désolée

La gestion de l'image de fond selon le nombre de forum (il faut que tu me dise comment tu vois les choses ici) Je ne comprends pas trop ta question, en fait Surprised (sorry, moi pas bien réveillée)

En fait là comme tu le voit l'image va se répéter en hauteur selon le nombre de forum. du coup est-ce que je fais pour que ça s'étire quitte à déformer l'image, ou ... je sais pas :oops ?

Pour les titres, je l'ai un peu descendu c'est mieux ?

Coucou :3 désolé du temps de réponse :c

Alors alors

Pour l'effet au survol : oubli de ma part ! Désolée haha pas de soucis ne t'en fais pas

En fait là comme tu le voit l'image va se répéter en hauteur selon le nombre de forum. du coup est-ce que je fais pour que ça s'étire quitte à déformer l'image, ou ... je sais pas ? Aaaaah oki je vois. Hum... en repeat c'est très bien, ça ne me dérange pas trop en fait XD Et au pire je chercherai une image plus grande

Pour les titres, je l'ai un peu descendu c'est mieux ? Oui c'est parfait comme ça merci

ça marche !
Je continue dans les heures / jours à venir alors

Pas de soucis prends ton temps

Re-coucou c'est re-moi =)

Alors, voilà les fond se mettent selon la catégorie (je t'expliquerai tout bien hein ^^)
https://commandes-maven-tamb.forumactif.com/

Pour le fond des descriptions, il faudra que tu mettes l'image avec l'opacité qui se réduit en fond (je te dirai où )

Tous les titres de catégories et de forum sont en image par contre, tu reste comme ça ou tu veux que ça soit en code ? Ca doit être faisable hein mais il me faudrait la police et les couleurs exactes

Ensuite, je crois que c'est bon, tu vois d'autres choses ?

Coucou :3 hum, non, à ma connaissance tout est bon je te fais confiance pour les explications

Pour ce qui est des titres je garde en image, car ce serait trop compliqué tout refaire en code les effets XD

Allez, j'te donne tout ça du coup

Alors, d'abord le templates : Affichages > Templates > général > index_box, je te le met en entier :



Tu peux enregistrer et publier ton template.

Ensuite, de la CSS : j'ai commenté un petit peu mais surtout là où il y a les couleurs et images à mettre à jour
A installer dans Affichage > couleurs > feuille de style CSS



Et un peu de javascript pour les images de fonds qui changent
Alors, dans Modules > Gestion des codes javascript (tout en bas) > vérifie bien que "Activer la gestion des codes Javascript :" est ) "oui" > Créer un javascript : mets un titre dont tu te rappelleras au cas où tu doives y retoucher, et tu coches "sur l'index" et "sur les sous forums" et tu colles ceci (il est commenté pour que tu le comprennes ) :


Ensuite pour tes titres de catégories et forum, il faut que tu mettes ceci :

Code:

<img src="https://nsa40.casimages.com/img/2020/04/05/200405062824635893.png" alt="Nom de la catégorie" />Nom de la catégorie

Et voilà ! Normalement c'est tout bon

Coucou C'est tout bon, aucun bug visuel rien '-' Merci Mäven

Coucou !

Je vois que le nom de ton forum "législation" dépasse par contre :/
Tu veux qu'on essaie de le faire en codage pour qu'il passe sur 2 lignes ?

Coucou Oui, c'est ce que je viens de voir aussi Pardon des problèmes ._.

Sinon oui, en effet, ce serait peut-être mieux sur 2 lignes. Ou alors réduire la taille de la police. Je vais tester si ça change quelque chose

EDIT : En changeant la taille c'est bon J'vais juste devoir trouver comment légèrement pousser à droite l'image, car elle est collé sur l'avatar là en ce moment

Coucou !

Il y a uns souci parce que je n'ai pas fixé la taille de l'avatar et que celui que tu as mis est plus grand

Tu peux régler ça en forçant la taille de l'avatar en remplaçant ceci :

Code:

.st-avatarLastPost > img {
    filter: grayscale(1);
    height: 200px;
    left: 50px;
    position: absolute;
    z-index: 15;
}

Par ceci :

Code:

.st-avatarLastPost > img {
    filter: grayscale(1);
    height: 200px;
    left: 50px;
    position: absolute;
    z-index: 15;
    width: 90px;
}

Tu essaies ?

Coucou Désolé du retard ._. c'est tout bon pour le vava

Aaah nickel !

Cette fois tout est bon @Kaerin ? On peut archiver ?

Oui c'est bon, vous pouvez archiver