Cette fiche de lien a été faite par @linus d'Epicode !
Nous vous demandons de ne pas retirer son copyright et, nous remercions l'auteur.rice de nous avoir donné autant de possibilité de personnalisation à cette fiche ! Amusez vous bien.




**

Petite précision pour la personnalisation de vos fiches de relations, il est possible de changer les couleurs en modifiant la première ligne de code de la fiche :

Code:

<div class="template-linus-11 lighter">

Par :

Code:

<div class="template-linus-11 lighter" style="--tl11-couleur:#VOTRECOULEUR;--tl11-couleur-degrade:#AUTRECOULEUR;--tl11-couleur-pastilles:#ETCOULEUR;">

Voici un petit site pour vous aider à trouver les couleurs que vous souhaitez en code HTML

**

Pour ce qui est de l'icone de la fiche :

Code:

--><i class="fas fa-paper-plane"></i><!--

Il est possible d'en changer en vous rendant sur Font Awesome. A partir de là, il vous suffira de choisir une icône gratuite et de remplacer la ligne HTML ci-dessus "fas fa-paper-plane", par votre choix.


Et voilà le code de la fiche. Faites vous pleins d'amis ou d'ennemis !

Code:

<div class="template-linus-11 lighter"><!-- remplacer lighter par darker pour une luminosité alternative
--><div class="tli-margin"><!--

/*** début du bloc liens ***/
--><div class="tli-header tli-gradient"><!-- remplacer tli-gradient par tli-flat pour enlever le dégradé
--><a href="#" title="Voir ma fiche" target="_blank" class="tli-avatar"><!--
--><img src="https://via.placeholder.com/150.png" alt="mon avatar"/><!--
--><span>jean peuplux davincourt</span><!--
--></a><!--
--><h2>jean peuplux davincourt</h2><!--
--><div class="tli-separator"><!--
--><i class="fas fa-paper-plane"></i><!-- remplacer ici l'icône si vous le souhaitez
--></div><!--
--><h3>l'ombre de ton iench</h3><!--
--></div><!--
/*** fin du bloc liens ***/

/*** début du bloc corps de texte ***/
--><div class="tli-body"><!--

--><div class="tli-intro"><!--
--><h3><!--
-->ce que je recherche<!--
--></h3><!--
-->Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam varius metus eget euismod scelerisque. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Praesent id lectus in orci lacinia vulputate. Integer tempor commodo risus, sit amet condimentum turpis faucibus eu. Mauris a tellus placerat, elementum massa sit amet, molestie ex. Vivamus tincidunt augue quis nibh iaculis, a aliquet leo ullamcorper. Quisque ullamcorper ullamcorper leo a feugiat. Proin sed felis luctus, imperdiet lectus id, imperdiet ex. Maecenas pharetra, arcu pharetra iaculis laoreet. Maecenas pharetra, arcu pharetra iaculis laoreet, nunc mi blandit enim, nec faucibus erat ipsum ac tortor...<!--
--></div><!--

/*** début du bloc personnage 0 ***/
--><div class="tli-character"><!--

/*** début avatar pseudo ***/
--><div class="tli-line"><!--
--><a href="#character0" class="tli-avatar"><!--
--><img src="https://via.placeholder.com/150.png" alt="mon avatar"/><!--
--></a><!--
--><a href="#character0" class="tli-inner-line"><!--
--><h2>nomprénom</h2><!--
--><h3>Type de lien</h3><!--
--></a><!--
--><div class="tli-inner-line tli-pastilles"><!--
--><div class="tli-pastille"><!--
-->1 rp<!--
--><div class="tli-liens"><!--
--><a href="#" target="_blank">titre de mon rp 1</a><br/><!--
--></div><!--
--></div><!--
--></div><!--
--></div><!--
/*** fin avatar pseudo ***/

--><span class="tli-target" id="character0"></span><!--
--><div class="tli-details"><!--
-->Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam varius metus eget euismod scelerisque. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Praesent id lectus in orci lacinia vulputate. Integer tempor commodo risus, sit amet condimentum turpis faucibus eu. Mauris a tellus placerat, elementum massa sit amet, molestie ex. Vivamus tincidunt augue quis nibh iaculis, a aliquet leo ullamcorper. Quisque ullamcorper ullamcorper leo a feugiat. Proin sed felis luctus, imperdiet lectus id, imperdiet ex. Maecenas pharetra, arcu pharetra iaculis laoreet, nunc mi blandit enim, nec faucibus erat ipsum ac tortor. Pellentesque et felis sit amet est laoreet lacinia. Pellentesque et felis sit amet est laoreet lacinia.<!--
--></div><!--
--></div><!--
/*** fin du bloc personnage 0 ***/
/*** début du bloc personnage 1 ***/
--><div class="tli-character"><!--

/*** début avatar pseudo ***/
--><div class="tli-line"><!--
--><a href="#character1" class="tli-avatar"><!--
--><img src="https://via.placeholder.com/150.png" alt="mon avatar"/><!--
--></a><!--
--><a href="#character1" class="tli-inner-line"><!--
--><h2>nomprénom</h2><!--
--><h3>type de lien</h3><!--
--></a><!--
--><div class="tli-inner-line tli-pastilles"><!--
--><div class="tli-pastille"><!--
-->3 rp<!--
--><div class="tli-liens"><!--
--><a href="#" target="_blank">titre de mon rp 1</a><br/><!--
--><a href="#" target="_blank">titre de mon rp 2</a><br/><!--
--><a href="#" target="_blank">titre de mon rp 3</a><br/><!--
--></div><!--
--></div><!--
--></div><!--
--></div><!--
/*** fin avatar pseudo ***/

--><span class="tli-target" id="character1"></span><!--
--><div class="tli-details"><!--
-->Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam varius metus eget euismod scelerisque. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Praesent id lectus in orci lacinia vulputate. Integer tempor commodo risus, sit amet condimentum turpis faucibus eu. Mauris a tellus placerat, elementum massa sit amet, molestie ex. Vivamus tincidunt augue quis nibh iaculis, a aliquet leo ullamcorper. Quisque ullamcorper ullamcorper leo a feugiat. Proin sed felis luctus, imperdiet lectus id, imperdiet ex. Maecenas pharetra, arcu pharetra iaculis laoreet, nunc mi blandit enim, nec faucibus erat ipsum ac tortor. Pellentesque et felis sit amet est laoreet lacinia. Pellentesque et felis sit amet est laoreet lacinia.<!--
--></div><!--
--></div><!--
/*** fin du bloc personnage 1 ***/
/*** début du bloc personnage 2 ***/
--><div class="tli-character"><!--

/*** début avatar pseudo ***/
--><div class="tli-line"><!--
--><a href="#character2" class="tli-avatar"><!--
--><img src="https://via.placeholder.com/150.png" alt="mon avatar"/><!--
--></a><!--
--><a href="#character2" class="tli-inner-line"><!--
--><h2>nomprénom</h2><!--
--><h3>type de lien</h3><!--
--></a><!--
--><div class="tli-inner-line tli-pastilles"><!--
--><div class="tli-pastille"><!--
-->1 rp<!--
--><div class="tli-liens"><!--
--><a href="#" target="_blank">titre de mon rp 1</a><br/><!--
--></div><!--
--></div><!--
--></div><!--
--></div><!--
/*** fin avatar pseudo ***/

--><span class="tli-target" id="character2"></span><!--
--><div class="tli-details"><!--
-->Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam varius metus eget euismod scelerisque. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Praesent id lectus in orci lacinia vulputate. Integer tempor commodo risus, sit amet condimentum turpis faucibus eu. Mauris a tellus placerat, elementum massa sit amet, molestie ex. Vivamus tincidunt augue quis nibh iaculis, a aliquet leo ullamcorper. Quisque ullamcorper ullamcorper leo a feugiat. Proin sed felis luctus, imperdiet lectus id, imperdiet ex. Maecenas pharetra, arcu pharetra iaculis laoreet, nunc mi blandit enim, nec faucibus erat ipsum ac tortor. Pellentesque et felis sit amet est laoreet lacinia. Pellentesque et felis sit amet est laoreet lacinia.<!--
--></div><!--
--></div><!--
/*** fin du bloc personnage 2 ***/
/*** début du bloc personnage 3 ***/
--><div class="tli-character"><!--

/*** début avatar pseudo ***/
--><div class="tli-line"><!--
--><a href="#character3" class="tli-avatar"><!--
--><img src="https://via.placeholder.com/150.png" alt="mon avatar"/><!--
--></a><!--
--><a href="#character3" class="tli-inner-line"><!--
--><h2>nomprénom</h2><!--
--><h3>type de lien</h3><!--
--></a><!--
--><div class="tli-inner-line tli-pastilles"><!--
--><div class="tli-pastille"><!--
-->0 rp<!--
--><div class="tli-liens"><!--
--></div><!--
--></div><!--
--></div><!--
--></div><!--
/*** fin avatar pseudo ***/

--><span class="tli-target" id="character3"></span><!--
--><div class="tli-details"><!--
-->Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam varius metus eget euismod scelerisque. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Praesent id lectus in orci lacinia vulputate. Integer tempor commodo risus, sit amet condimentum turpis faucibus eu. Mauris a tellus placerat, elementum massa sit amet, molestie ex. Vivamus tincidunt augue quis nibh iaculis, a aliquet leo ullamcorper. Quisque ullamcorper ullamcorper leo a feugiat. Proin sed felis luctus, imperdiet lectus id, imperdiet ex. Maecenas pharetra, arcu pharetra iaculis laoreet, nunc mi blandit enim, nec faucibus erat ipsum ac tortor. Pellentesque et felis sit amet est laoreet lacinia. Pellentesque et felis sit amet est laoreet lacinia.<!--
--></div><!--
--></div><!--
/*** fin du bloc personnage 3 ***/
/*** début du bloc personnage 4 ***/
--><div class="tli-character"><!--

/*** début avatar pseudo ***/
--><div class="tli-line"><!--
--><a href="#character4" class="tli-avatar"><!--
--><img src="https://via.placeholder.com/150.png" alt="mon avatar"/><!--
--></a><!--
--><a href="#character4" class="tli-inner-line"><!--
--><h2>nomprénom</h2><!--
--><h3>type de lien</h3><!--
--></a><!--
--><div class="tli-inner-line tli-pastilles"><!--
--><div class="tli-pastille"><!--
-->2 rp<!--
--><div class="tli-liens"><!--
--><a href="#" target="_blank">titre de mon rp 1</a><br/><!--
--><a href="#" target="_blank">titre de mon rp 2</a><br/><!--
--></div><!--
--></div><!--
--></div><!--
--></div><!--
/*** fin avatar pseudo ***/

--><span class="tli-target" id="character4"></span><!--
--><div class="tli-details"><!--
-->Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam varius metus eget euismod scelerisque. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Praesent id lectus in orci lacinia vulputate. Integer tempor commodo risus, sit amet condimentum turpis faucibus eu. Mauris a tellus placerat, elementum massa sit amet, molestie ex. Vivamus tincidunt augue quis nibh iaculis, a aliquet leo ullamcorper. Quisque ullamcorper ullamcorper leo a feugiat. Proin sed felis luctus, imperdiet lectus id, imperdiet ex. Maecenas pharetra, arcu pharetra iaculis laoreet, nunc mi blandit enim, nec faucibus erat ipsum ac tortor. Pellentesque et felis sit amet est laoreet lacinia. Pellentesque et felis sit amet est laoreet lacinia.<!--
--></div><!--
--></div><!--
/*** fin du bloc personnage 4 ***/
/*** début du bloc personnage 5 ***/
--><div class="tli-character"><!--

/*** début avatar pseudo ***/
--><div class="tli-line"><!--
--><a href="#character5" class="tli-avatar"><!--
--><img src="https://via.placeholder.com/150.png" alt="mon avatar"/><!--
--></a><!--
--><a href="#character5" class="tli-inner-line"><!--
--><h2>nomprénom</h2><!--
--><h3>type de lien</h3><!--
--></a><!--
--><div class="tli-inner-line tli-pastilles"><!--
--><div class="tli-pastille"><!--
-->1 rp<!--
--><div class="tli-liens"><!--
--><a href="#" target="_blank">titre de mon rp 1</a><br/><!--
--></div><!--
--></div><!--
--></div><!--
--></div><!--
/*** fin avatar pseudo ***/

--><span class="tli-target" id="character5"></span><!--
--><div class="tli-details"><!--
-->Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam varius metus eget euismod scelerisque. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Praesent id lectus in orci lacinia vulputate. Integer tempor commodo risus, sit amet condimentum turpis faucibus eu. Mauris a tellus placerat, elementum massa sit amet, molestie ex. Vivamus tincidunt augue quis nibh iaculis, a aliquet leo ullamcorper. Quisque ullamcorper ullamcorper leo a feugiat. Proin sed felis luctus, imperdiet lectus id, imperdiet ex. Maecenas pharetra, arcu pharetra iaculis laoreet, nunc mi blandit enim, nec faucibus erat ipsum ac tortor. Pellentesque et felis sit amet est laoreet lacinia. Pellentesque et felis sit amet est laoreet lacinia.<!--
--></div><!--
--></div><!--
/*** fin du bloc personnage 5 ***/

--></div><!--
/*** fin du bloc corps de texte ***/

--><div class="tli-credits">©linus pour <a href="http://epicode.variousforum.com/" target="_blank">Epicode</a></div><!--
--></div><!--
--></div>