Journaux

En avant toute !

Explications

Afin de faciliter le travail du staff quant au système de quêtes personnalisées, il vous sera demandé de tenir un journal de vos aventures. Rien de bien extraordinaire, rassurez vous ! Juste de quoi repérer en un regard ce qui pourrait nous être utile ~

Et voilà ENFIN notre modèle, j'ai passé du temps à le créer alors j'espère qu'il vous plaira !! Les couleurs sont personnalisables facilement, pour le reste ... Well vous pouvez toujours fouiner dans la balise "style" mais je vous préviens, c'est un gros caffouilli ^-^ Il n'est bien entendu pas obligatoire d'utiliser ce code là.

Du coup, voici la balise style dans son intégralité. Ce n'est pas trié, et des codes se répètent, mais elle marche ^-^ Il faut que vous posiez ça tout en haut de votre premier message, et ensuite vous n'avez plus besoin d'y toucher ! Si vous voulez la personnaliser, pas de soucis pour moi Smile

Et si vous avez envie de réutiliser ces codes sur d'autres forums, je n'y vois pas d'inconvénient non plus, tant que vous mettez un crédit pour Ezylone.

Code:: <style>.cadre_global_journaux {width: 620px; margin: auto; font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;} .cadre_titre_journaux_1 {width: 600px; padding: 10px; margin: auto;} .cadre_titre_journaux_2 {border: 1px solid #ffffff; padding: 10px; text-align: center; color: #ffffff; text-transform: uppercase; font-size: 30px;} .cadre_relation_journaux {width: 190px; height: 390px; margin-top: 10px; padding: 5px; font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;} .droite {margin-left: 10px;} .gauche {margin-right: 10px;} .titre_lien_journaux {width: 180px; background-color: #feffff; padding: 5px; text-align: center;} .nom_lien_journaux {display: inline-block; width: 90%; font-weight:bold; border-bottom: 1px solid #000000;} .description_lien_journaux {font-size: 12px; font-variant: small-caps; font-style: italic;} .contenu_lien_journaux {width: 180px; margin-top: 5px; padding: 5px; height: 329px; background-color: #feffff; font-size: 13px; overflow: auto; opacity:0; transform:scale(0) rotate(-25deg); -webkit-transform:scale(0) rotate(-25deg);
transition:all .25s; -webkit-transition:all .25s;} .cadre_relation_journaux:hover .contenu_lien_journaux {opacity:1; transform:scale(1) rotate(0); -webkit-transform:scale(1) rotate(0);} .block_aventures p {width: 570px; height: 8px; margin: auto; overflow: hidden; background-color: #f1f3f6; transition:all 0.35s linear; -webkit-transition:all 0.35s linear; opacity: 0; padding: 5px; font-size: 13px;} .block_aventures:hover p{opacity: 1; height: 170px; overflow: auto; transition:all 0.35s linear; -webkit-transition:all 0.35s linear;} .titre_RP_journaux {width: 570px; padding: 5px; font-family: 'Alegreya Sans SC', sans-serif; font-size: 20px; margin: auto;} .block_inventaire {margin: auto;} .titre_RP_journaux a {color:#000000 !important;} .titre_RP_journaux a:hover {color: #ffffff !important;} .block_inventaire p {width: 290px; height: 8px; overflow: hidden; background-color: #f1f3f6; transition:all 0.35s linear; -webkit-transition:all 0.35s linear; opacity: 0; padding: 5px; font-size: 13px; margin-top: 0px; margin-bottom: 0px;} .block_inventaire:hover p{opacity: 1; height: 170px; overflow: auto; transition:all 0.35s linear; -webkit-transition:all 0.35s linear;} .titre_inventaire {width: 290px; padding: 5px; font-family: 'Alegreya Sans SC', sans-serif; font-size: 20px;} .compagnon {height: 250px;} .compagnonbis {height: 185px;} .contenu_prez_perso{margin: auto; width: 180px; height: 385px; overflow: auto; opacity:0; transform:scale(0) rotate(-25deg); -webkit-transform:scale(0) rotate(-25deg); transition:all .25s; -webkit-transition:all .25s;} .cadre_relation_journaux:hover .contenu_prez_perso {opacity:1; transform:scale(1) rotate(0); -webkit-transform:scale(1) rotate(0);} .contenu_prez_perso p {background-color: #fff; font-family: 'Alegreya Sans SC', sans-serif; font-size: 20px; padding: 5px; margin: auto; margin-top: 15px; text-align: center;} .titre_prez_journal {width: 380px; padding: 5px; font-family: 'Alegreya Sans SC', sans-serif; font-size: 20px; margin-top: 10px;} .block_prez_journal {width: 370px; margin-top: 20px; height: 330px; overflow: auto; background-color: #f1f3f6; padding: 10px;}</style>

Hop, en premier, la feuille de personnage.

PRENOM NOM - TITRE ?

Belle moustache

Sens l'alcool

Boite un peu

Truc

WANTED, je recherche ...

→ Un super coup pour baiser le soir
→ Une kiloute rétractable
→ Un coupain de croisière pour aller taper les vilains pirates
→ Un domestique pour cirer mes chaussures quand elles sont sales
→ De l'amour

Voici le code qui permet de la mettre en forme.

Code:: <div class="cadre_global_journaux"><div class="cadre_titre_journaux_1" style="background-color: #16768e;"><div class="cadre_titre_journaux_2">PRENOM NOM - TITRE ?</div></div><table cellspacing="0px" cellpadding="0px"><tr><td><div class="cadre_relation_journaux gauche" style="background-image: url('https://imgur.com/TiA57EK.jpg');"><div class="contenu_prez_perso"><p style="margin-top: 10px;">Belle moustache</p><p>Sens l'alcool</p><p>Boite un peu</p><p>Truc</p><p>Truc</p><p>Truc</p><p>Truc</p><p>Truc</p><p>Truc</p></div></div></div></td><td><div class="titre_prez_journal" style="background-color: #cba857;">WANTED, je recherche ...</div><div class="block_prez_journal">→ Un super coup pour baiser le soir
→ Une kiloute rétractable
→ Un coupain de croisière pour aller taper les vilains pirates
→ Un domestique pour cirer mes chaussures quand elles sont sales
→ De l'amour :hearts::hearts:
</div></td></tr></table></div>

L'image est en 200x400, comme les vava sur Ezylone, comme ça c'est pratique ! Libre à vous de personnaliser le tout, les couleurs sont faciles à changer, pour le reste, il va falloir s'atteler au code sous la balise "style".

Petit tips précieux : vous verrez partout dans mon code une balise comme ceci :

Code::

Elle permet d'aérer le code sans que ça impacte la disposition des éléments. Si vous en pétez une, tout va se décaler, j'vous préviens.

En second, l'inventaire, qui sert surtout à recenser armes et objets récupérés à droite à gauche. Les descriptions des objets s'affichent au passage de la souris. Pour enlever l'effet il faut toucher au code dans la balise style.

Inventaire

Nom d'objet - type

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla lorem leo, maximus at maximus eget, tempor sit amet felis. Morbi nec ligula at quam sollicitudin aliquam eu quis mauris. Duis mattis facilisis odio, at molestie felis convallis ac. Nulla gravida, leo nec fermentum congue, ipsum ligula malesuada elit, sed vehicula est dolor pulvinar nunc. Nullam ac convallis libero, eget facilisis nisl. Donec id justo elit. Ut non felis laoreet, dictum est non, malesuada felis. Sed lobortis, ipsum ut posuere vestibulum, dui ipsum luctus eros, sed efficitur nisi tortor a nisi. Nullam quis nisi id mauris vulputate vehicula. Aliquam facilisis tortor bibendum dolor sodales tempor sed vitae sapien. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam aliquet tristique est, vel iaculis metus dictum eu. Morbi nec interdum quam. Donec a metus leo. Phasellus et eros quis leo porta pretium.

Nom d'objet - type

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla lorem leo, maximus at maximus eget, tempor sit amet felis. Morbi nec ligula at quam sollicitudin aliquam eu quis mauris. Duis mattis facilisis odio, at molestie felis convallis ac. Nulla gravida, leo nec fermentum congue, ipsum ligula malesuada elit, sed vehicula est dolor pulvinar nunc. Nullam ac convallis libero, eget facilisis nisl. Donec id justo elit. Ut non felis laoreet, dictum est non, malesuada felis. Sed lobortis, ipsum ut posuere vestibulum, dui ipsum luctus eros, sed efficitur nisi tortor a nisi. Nullam quis nisi id mauris vulputate vehicula. Aliquam facilisis tortor bibendum dolor sodales tempor sed vitae sapien. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam aliquet tristique est, vel iaculis metus dictum eu. Morbi nec interdum quam. Donec a metus leo. Phasellus et eros quis leo porta pretium.

Nom d'objet - type

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla lorem leo, maximus at maximus eget, tempor sit amet felis. Morbi nec ligula at quam sollicitudin aliquam eu quis mauris. Duis mattis facilisis odio, at molestie felis convallis ac. Nulla gravida, leo nec fermentum congue, ipsum ligula malesuada elit, sed vehicula est dolor pulvinar nunc. Nullam ac convallis libero, eget facilisis nisl. Donec id justo elit. Ut non felis laoreet, dictum est non, malesuada felis. Sed lobortis, ipsum ut posuere vestibulum, dui ipsum luctus eros, sed efficitur nisi tortor a nisi. Nullam quis nisi id mauris vulputate vehicula. Aliquam facilisis tortor bibendum dolor sodales tempor sed vitae sapien. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam aliquet tristique est, vel iaculis metus dictum eu. Morbi nec interdum quam. Donec a metus leo. Phasellus et eros quis leo porta pretium.

Nom d'objet - type

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla lorem leo, maximus at maximus eget, tempor sit amet felis. Morbi nec ligula at quam sollicitudin aliquam eu quis mauris. Duis mattis facilisis odio, at molestie felis convallis ac. Nulla gravida, leo nec fermentum congue, ipsum ligula malesuada elit, sed vehicula est dolor pulvinar nunc. Nullam ac convallis libero, eget facilisis nisl. Donec id justo elit. Ut non felis laoreet, dictum est non, malesuada felis. Sed lobortis, ipsum ut posuere vestibulum, dui ipsum luctus eros, sed efficitur nisi tortor a nisi. Nullam quis nisi id mauris vulputate vehicula. Aliquam facilisis tortor bibendum dolor sodales tempor sed vitae sapien. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam aliquet tristique est, vel iaculis metus dictum eu. Morbi nec interdum quam. Donec a metus leo. Phasellus et eros quis leo porta pretium.

Code:: <div class="cadre_global_journaux"><div class="cadre_titre_journaux_1" style="background-color: #16768e;"><div class="cadre_titre_journaux_2">Inventaire</div></div>
<table><tr><td style="vertical-align: top;"><div class="block_inventaire gauche"><div class="titre_inventaire" style="background-color: #cba857;">Nom d'objet - type</div><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla lorem leo, maximus at maximus eget, tempor sit amet felis. Morbi nec ligula at quam sollicitudin aliquam eu quis mauris. Duis mattis facilisis odio, at molestie felis convallis ac. Nulla gravida, leo nec fermentum congue, ipsum ligula malesuada elit, sed vehicula est dolor pulvinar nunc. Nullam ac convallis libero, eget facilisis nisl. Donec id justo elit. Ut non felis laoreet, dictum est non, malesuada felis. Sed lobortis, ipsum ut posuere vestibulum, dui ipsum luctus eros, sed efficitur nisi tortor a nisi. Nullam quis nisi id mauris vulputate vehicula. Aliquam facilisis tortor bibendum dolor sodales tempor sed vitae sapien. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam aliquet tristique est, vel iaculis metus dictum eu. Morbi nec interdum quam. Donec a metus leo. Phasellus et eros quis leo porta pretium.</p></div></td><td style="vertical-align: top;"><div class="block_inventaire"><div class="titre_inventaire" style="background-color: #cba857;">Nom d'objet - type</div><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla lorem leo, maximus at maximus eget, tempor sit amet felis. Morbi nec ligula at quam sollicitudin aliquam eu quis mauris. Duis mattis facilisis odio, at molestie felis convallis ac. Nulla gravida, leo nec fermentum congue, ipsum ligula malesuada elit, sed vehicula est dolor pulvinar nunc. Nullam ac convallis libero, eget facilisis nisl. Donec id justo elit. Ut non felis laoreet, dictum est non, malesuada felis. Sed lobortis, ipsum ut posuere vestibulum, dui ipsum luctus eros, sed efficitur nisi tortor a nisi. Nullam quis nisi id mauris vulputate vehicula. Aliquam facilisis tortor bibendum dolor sodales tempor sed vitae sapien. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam aliquet tristique est, vel iaculis metus dictum eu. Morbi nec interdum quam. Donec a metus leo. Phasellus et eros quis leo porta pretium.</p></div></td></tr><tr><td style="vertical-align: top;"><div class="block_inventaire gauche"><div class="titre_inventaire" style="background-color: #cba857;">Nom d'objet - type</div><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla lorem leo, maximus at maximus eget, tempor sit amet felis. Morbi nec ligula at quam sollicitudin aliquam eu quis mauris. Duis mattis facilisis odio, at molestie felis convallis ac. Nulla gravida, leo nec fermentum congue, ipsum ligula malesuada elit, sed vehicula est dolor pulvinar nunc. Nullam ac convallis libero, eget facilisis nisl. Donec id justo elit. Ut non felis laoreet, dictum est non, malesuada felis. Sed lobortis, ipsum ut posuere vestibulum, dui ipsum luctus eros, sed efficitur nisi tortor a nisi. Nullam quis nisi id mauris vulputate vehicula. Aliquam facilisis tortor bibendum dolor sodales tempor sed vitae sapien. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam aliquet tristique est, vel iaculis metus dictum eu. Morbi nec interdum quam. Donec a metus leo. Phasellus et eros quis leo porta pretium.</p></div></td><td style="vertical-align: top;"><div class="block_inventaire"><div class="titre_inventaire" style="background-color: #cba857;">Nom d'objet - type</div><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla lorem leo, maximus at maximus eget, tempor sit amet felis. Morbi nec ligula at quam sollicitudin aliquam eu quis mauris. Duis mattis facilisis odio, at molestie felis convallis ac. Nulla gravida, leo nec fermentum congue, ipsum ligula malesuada elit, sed vehicula est dolor pulvinar nunc. Nullam ac convallis libero, eget facilisis nisl. Donec id justo elit. Ut non felis laoreet, dictum est non, malesuada felis. Sed lobortis, ipsum ut posuere vestibulum, dui ipsum luctus eros, sed efficitur nisi tortor a nisi. Nullam quis nisi id mauris vulputate vehicula. Aliquam facilisis tortor bibendum dolor sodales tempor sed vitae sapien. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam aliquet tristique est, vel iaculis metus dictum eu. Morbi nec interdum quam. Donec a metus leo. Phasellus et eros quis leo porta pretium.</p></div></td></tr></table></div>

On retrouve encore une fois la petite balise d'aération bien pratique, et les couleurs sont faciles d'accès ici aussi. Si vous voulez rajouter une ligne, il vous suffit d'ajouter ce code avant la balise <'/table> (sans l'apostrophe, mais si je met pas l'apostrophe et bien on ne verra pas la balise).

Code:: <tr><td style="vertical-align: top;"><div class="block_inventaire gauche"><div class="titre_inventaire" style="background-color: #cba857;">Nom d'objet - type</div><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla lorem leo, maximus at maximus eget, tempor sit amet felis. Morbi nec ligula at quam sollicitudin aliquam eu quis mauris. Duis mattis facilisis odio, at molestie felis convallis ac. Nulla gravida, leo nec fermentum congue, ipsum ligula malesuada elit, sed vehicula est dolor pulvinar nunc. Nullam ac convallis libero, eget facilisis nisl. Donec id justo elit. Ut non felis laoreet, dictum est non, malesuada felis. Sed lobortis, ipsum ut posuere vestibulum, dui ipsum luctus eros, sed efficitur nisi tortor a nisi. Nullam quis nisi id mauris vulputate vehicula. Aliquam facilisis tortor bibendum dolor sodales tempor sed vitae sapien. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam aliquet tristique est, vel iaculis metus dictum eu. Morbi nec interdum quam. Donec a metus leo. Phasellus et eros quis leo porta pretium.</p></div></td><td style="vertical-align: top;"><div class="block_inventaire"><div class="titre_inventaire" style="background-color: #cba857;">Nom d'objet - type</div><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla lorem leo, maximus at maximus eget, tempor sit amet felis. Morbi nec ligula at quam sollicitudin aliquam eu quis mauris. Duis mattis facilisis odio, at molestie felis convallis ac. Nulla gravida, leo nec fermentum congue, ipsum ligula malesuada elit, sed vehicula est dolor pulvinar nunc. Nullam ac convallis libero, eget facilisis nisl. Donec id justo elit. Ut non felis laoreet, dictum est non, malesuada felis. Sed lobortis, ipsum ut posuere vestibulum, dui ipsum luctus eros, sed efficitur nisi tortor a nisi. Nullam quis nisi id mauris vulputate vehicula. Aliquam facilisis tortor bibendum dolor sodales tempor sed vitae sapien. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam aliquet tristique est, vel iaculis metus dictum eu. Morbi nec interdum quam. Donec a metus leo. Phasellus et eros quis leo porta pretium.</p></div></td></tr>

Dans le même registre, on retrouve les compagnons. Par là j'entend les PNJ et les familiers/montures que vous pourrez traîner avec vous dans vos aventures.

Compagnons

NOMType (PNJ sirène)

Description

NOMType (Kokette [Monture])

Description

NOMType (Kokette [Familier])

Description

Code:: <div class="cadre_global_journaux"><div class="cadre_titre_journaux_1" style="background-color: #16768e;"><div class="cadre_titre_journaux_2">Compagnons</div></div><table cellspacing="0px" cellpadding="0px"><tr><td><div class="cadre_relation_journaux gauche compagnon" style="background-image: url('https://imgur.com/TiA57EK.jpg');"><div class="titre_lien_journaux"><span class="nom_lien_journaux">NOM</span><span class="description_lien_journaux">Type (PNJ sirène)</span></div><div class="contenu_lien_journaux compagnonbis">Description

</div></div></td><td><div class="cadre_relation_journaux compagnon" style="background-image: url('https://imgur.com/TiA57EK.jpg');"><div class="titre_lien_journaux"><span class="nom_lien_journaux">NOM</span><span class="description_lien_journaux">Type (Kokette [Monture])</span>
</div><div class="contenu_lien_journaux compagnonbis">Description

</div></div></td><td><div class="cadre_relation_journaux droite compagnon" style="background-image: url('https://imgur.com/TiA57EK.jpg');"><div class="titre_lien_journaux"><span class="nom_lien_journaux">NOM</span><span class="description_lien_journaux">Type (Kokette [Familier])</span></div><div class="contenu_lien_journaux compagnonbis">Description

</div></div></td></tr></table></div>

Pour ajouter une ligne, il faut que vous copiez ce code entre la balise <'/tr> et la balise <'/table> (ici encore sans les guillemets) :

Code:: <tr><td><div class="cadre_relation_journaux gauche compagnon" style="background-image: url('https://imgur.com/TiA57EK.jpg');"><div class="titre_lien_journaux"><span class="nom_lien_journaux">NOM</span><span class="description_lien_journaux">Type (PNJ sirène)</span></div><div class="contenu_lien_journaux compagnonbis">Description

</div></div></td><td><div class="cadre_relation_journaux compagnon" style="background-image: url('https://imgur.com/TiA57EK.jpg');"><div class="titre_lien_journaux"><span class="nom_lien_journaux">NOM</span><span class="description_lien_journaux">Type (Kokette [Monture])</span>
</div><div class="contenu_lien_journaux compagnonbis">Description

</div></div></td><td><div class="cadre_relation_journaux droite compagnon" style="background-image: url('https://imgur.com/TiA57EK.jpg');"><div class="titre_lien_journaux"><span class="nom_lien_journaux">NOM</span><span class="description_lien_journaux">Type (Kokette [Familier])</span></div><div class="contenu_lien_journaux compagnonbis">Description

</div></div></td></tr>

Bien sûr vous pouvez utiliser le code des objets pour les familiers et inversement, si vous voulez mettre des images pour vos armes. Enfin voilà, vous les utilisez comme vous voulez ^-^

Ce code est probablement le plus "important" : il s'agit de la timeline de vos RP, avec les actions que vous avez effectuées et les gens que vous avez rencontré dedans, notamment les PNJ. Si vous faites une demande de quête, c'est ici que l'on viendra chercher les informations dont on a besoin. C'est donc mieux pour vous s'il est mis à jour.

Les descriptions s'affichent au survol, vous les organisez comme vous le souhaitez. Si vous voulez agencer vos RP autrement que par ordre chronologique, merci d'indiquer la date/période à laquelle le RP a lieu dans le titre.

Aventures

Titre de RP - en cours (couleur : #cba857)

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla lorem leo, maximus at maximus eget, tempor sit amet felis. Morbi nec ligula at quam sollicitudin aliquam eu quis mauris. Duis mattis facilisis odio, at molestie felis convallis ac. Nulla gravida, leo nec fermentum congue, ipsum ligula malesuada elit, sed vehicula est dolor pulvinar nunc. Nullam ac convallis libero, eget facilisis nisl. Donec id justo elit. Ut non felis laoreet, dictum est non, malesuada felis. Sed lobortis, ipsum ut posuere vestibulum, dui ipsum luctus eros, sed efficitur nisi tortor a nisi. Nullam quis nisi id mauris vulputate vehicula. Aliquam facilisis tortor bibendum dolor sodales tempor sed vitae sapien. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam aliquet tristique est, vel iaculis metus dictum eu. Morbi nec interdum quam. Donec a metus leo. Phasellus et eros quis leo porta pretium.

Mauris elementum nibh mi. Integer et velit quis felis commodo lobortis eget vitae lacus. Vestibulum hendrerit ante quis est porttitor porta. Etiam ullamcorper urna non turpis fringilla tincidunt ac et leo. Nam sollicitudin mi et gravida dignissim. Pellentesque luctus pretium venenatis. In ultrices placerat metus ut dictum.

Aliquam fermentum pretium elit, in porta nunc ullamcorper in. Nam eget congue enim. Mauris eget posuere metus, eu tempor felis. Nulla suscipit augue purus, quis tempus turpis hendrerit a. Maecenas quis pretium nisi. Nullam in massa eget lorem tincidunt ultrices in vel tortor. Vestibulum vehicula consequat est, vitae bibendum mi tincidunt eu. Mauris pulvinar, risus vitae malesuada euismod, purus nisl tempor enim, in lacinia ex lectus et purus. Phasellus sit amet ante ullamcorper, accumsan massa at, congue ipsum.

Titre de RP - Terminé (couleur : #b7b9bb)

Blablabla

Code:: <div class="cadre_global_journaux"><div class="cadre_titre_journaux_1" style="background-color: #16768e;"><div class="cadre_titre_journaux_2">Aventures</div></div>
<div class="block_aventures"><div class="titre_RP_journaux" style="background-color: #cba857;"><a href="INSERER LIEN ICI">Titre de RP </a>- en cours</div><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla lorem leo, maximus at maximus eget, tempor sit amet felis. Morbi nec ligula at quam sollicitudin aliquam eu quis mauris. Duis mattis facilisis odio, at molestie felis convallis ac. Nulla gravida, leo nec fermentum congue, ipsum ligula malesuada elit, sed vehicula est dolor pulvinar nunc. Nullam ac convallis libero, eget facilisis nisl. Donec id justo elit. Ut non felis laoreet, dictum est non, malesuada felis. Sed lobortis, ipsum ut posuere vestibulum, dui ipsum luctus eros, sed efficitur nisi tortor a nisi. Nullam quis nisi id mauris vulputate vehicula. Aliquam facilisis tortor bibendum dolor sodales tempor sed vitae sapien. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam aliquet tristique est, vel iaculis metus dictum eu. Morbi nec interdum quam. Donec a metus leo. Phasellus et eros quis leo porta pretium.

Mauris elementum nibh mi. Integer et velit quis felis commodo lobortis eget vitae lacus. Vestibulum hendrerit ante quis est porttitor porta. Etiam ullamcorper urna non turpis fringilla tincidunt ac et leo. Nam sollicitudin mi et gravida dignissim. Pellentesque luctus pretium venenatis. In ultrices placerat metus ut dictum.

Aliquam fermentum pretium elit, in porta nunc ullamcorper in. Nam eget congue enim. Mauris eget posuere metus, eu tempor felis. Nulla suscipit augue purus, quis tempus turpis hendrerit a. Maecenas quis pretium nisi. Nullam in massa eget lorem tincidunt ultrices in vel tortor. Vestibulum vehicula consequat est, vitae bibendum mi tincidunt eu. Mauris pulvinar, risus vitae malesuada euismod, purus nisl tempor enim, in lacinia ex lectus et purus. Phasellus sit amet ante ullamcorper, accumsan massa at, congue ipsum.</p></div><div class="block_aventures"><div class="titre_RP_journaux" style="background-color: #b7b9bb;"><a href="INSERER LIEN ICI">Titre de RP </a>- Terminé</div><p>Blablabla</p></div>
</div>

Ajouter un nouveau RP à la liste ? Rien de plus simple, il faut ajouter ce code avant le dernier <'/div> du code :

Code:: <div class="block_aventures"><div class="titre_RP_journaux" style="background-color: #b7b9bb;"><a href="INSERER LIEN ICI">Titre de RP </a>- Terminé</div><p>Blablabla</p></div>

Pour terminer, les relations. Vous pouvez indiquer les personnages joueurs, mais également les personnages non joueurs que vous avez rencontré si vous en avez envie !

Relations

NOMtitre lien

Description

NOM
titre lien

Description

NOMtitre lien

Description

Code:: <div class="cadre_global_journaux"><div class="cadre_titre_journaux_1" style="background-color: #16768e;"><div class="cadre_titre_journaux_2">Relations</div></div><table cellspacing="0px" cellpadding="0px"><tr><td><div class="cadre_relation_journaux gauche" style="background-image: url('https://imgur.com/TiA57EK.jpg');"><div class="titre_lien_journaux"><span class="nom_lien_journaux">NOM</span><span class="description_lien_journaux">titre lien</span></div><div class="contenu_lien_journaux">Description

</div></div></td><td><div class="cadre_relation_journaux" style="background-image: url('https://imgur.com/TiA57EK.jpg');"><div class="titre_lien_journaux"><span class="nom_lien_journaux">NOM</span>
<span class="description_lien_journaux">titre lien</span></div><div class="contenu_lien_journaux">Description

</div></div></td><td><div class="cadre_relation_journaux droite" style="background-image: url('https://imgur.com/TiA57EK.jpg');"><div class="titre_lien_journaux"><span class="nom_lien_journaux">NOM</span><span class="description_lien_journaux">titre lien</span></div><div class="contenu_lien_journaux">Description

</div></div></td></tr></table></div>

Pour ajouter une ligne il faut ajouter ce code entre la balise <'/tr> et la balise <'/table> à la fin du code précédent :

Code:: <tr><td><div class="cadre_relation_journaux gauche" style="background-image: url('https://imgur.com/TiA57EK.jpg');"><div class="titre_lien_journaux"><span class="nom_lien_journaux">NOM</span><span class="description_lien_journaux">titre lien</span></div><div class="contenu_lien_journaux">Description

</div></div></td><td><div class="cadre_relation_journaux" style="background-image: url('https://imgur.com/TiA57EK.jpg');"><div class="titre_lien_journaux"><span class="nom_lien_journaux">NOM</span>
<span class="description_lien_journaux">titre lien</span></div><div class="contenu_lien_journaux">Description

</div></div></td><td><div class="cadre_relation_journaux droite" style="background-image: url('https://imgur.com/TiA57EK.jpg');"><div class="titre_lien_journaux"><span class="nom_lien_journaux">NOM</span><span class="description_lien_journaux">titre lien</span></div><div class="contenu_lien_journaux">Description

</div></div></td></tr>