Questionnement

Bonjour. Je viens souvent fouinée sur votre forum qui est vraiment magnifique et vos partages de codes sont vraiment tous très beaux. je suis tomber dans la catégorie exposition des thèmes forums hier et j'en ai vue un sur lequel j'ai craqué et je me suis donc mise a chercher dans les bonnes catégories les codes nécessaire pour pouvoir faire quelque chose de semblable avec ma touche personnelle cela vas de soit mais curieusement je n'ai rien trouver. Pouvez-vous éclairer ma lanterne?

Voila le th;eme sur lequel j'ai craqué : https://crushcrushcrush.actifforum.com/t113-wonderland-fansub

Bonjour,

Les éléments de ce design sont pourtant tous disponibles en libre-service depuis des années et furent d'ailleurs mis à jour au cours des deux dernières. Une personnalisation est envisageable mais ne sera réalisable qu'à partir du 3 Décembre.

Page d'accueil 6 :

Staff

PseudonymeFonctionProfil

Lien Lien Lien Lien Lien

▬ 00/00/00 : ...
▬ 00/00/00 : ...
▬ 00/00/00 : ...

Contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte

Partenaires

Code:: <link href="https://www.aht.li/3203417/DOR_PA.css" rel="stylesheet" type="text/css"><div class="DOR"><div class="boxDOR"><div class="tleDOR">Staff</div><div class="staffDOR"><div><p>Pseudonyme<span class="onDOR">Fonction</span><a href="..." target="_blank">Profil</a></p><img src="http://www.aht.li/2776945/9090.png" /></div><div><p>Pseudonyme<span class="offDOR">Fonction</span><a href="..." target="_blank">Profil</a></p><img src="http://www.aht.li/2776945/9090.png" /></div></div><div class="lksDOR"><a href="..." target="_blank">Lien</a><a href="..." target="_blank">Lien</a><a href="..." target="_blank">Lien</a><a href="..." target="_blank">Lien</a><a href="..." target="_blank">Lien</a></div></div><div class="newsDOR"><div>▬ 00/00/00 : ...<br/>▬ 00/00/00 : ...<br/>▬ 00/00/00 : ...</div><img src="http://www.aht.li/2776411/200300.png" /></div><div class="boxDOR"><div class="ctxtDOR">Contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte contexte</div><div class="tleIIDOR">Partenaires</div><div class="partDOR"><a href="..." target="_blank"><img src="http://www.aht.li/2859284/5050C.png" /></a><a href="..." target="_blank"><img src="http://www.aht.li/2859284/5050C.png" /></a><a href="..." target="_blank"><img src="http://www.aht.li/2859284/5050C.png" /></a><a href="..." target="_blank"><img src="http://www.aht.li/2859284/5050C.png" /></a><a href="..." target="_blank"><img src="http://www.aht.li/2859284/5050C.png" /></a></div></div></div>

Partie CSS :
Panneau d'administration > Affichage > Images et Couleurs > Couleurs > Feuille de style CSS

Code:: /* PA */
.DOR {
background:grey; /* MODIFIABLE */
}
/* TITRE STAFF PA */
.tleDOR {
background:rgba(250,250,250,0.3); color:white; /* MODIFIABLE */
}
/* BORDURES BLOCS STAFF PA */
.staffDOR div {
border-color:rgba(250,250,250,0.3) !important; /* MODIFIABLE */
}
/* CONTENUS STAFF PA */
.staffDOR div p {
background:rgba(250,250,250,0.9); color:black; /* MODIFIABLE */
}
/* DISPONIBLE PA */
.onDOR {
background:lightgreen; color:black; /* MODIFIABLE */
}
/* INDISPONIBLE PA */
.offDOR {
background:crimson; color:white; /* MODIFIABLE */
}
/* LIENS PROFILS STAFF PA */
.staffDOR div p a {
color:black; /* MODIFIABLE */
}
/* LIENS PA */
.lksDOR a {
background:rgba(0,0,0,0.5); color:white; /* MODIFIABLE */
}
/* BORDURE ACTUALITES PA */
.newsDOR {
border-color:rgba(250,250,250,0.3) !important; /* MODIFIABLE */
}
/* CONTENU ACTUALITES PA */
.newsDOR div {
background:rgba(250,250,250,0.1); color:black; /* MODIFIABLE */
}
/* CONTEXTE PA */
.ctxtDOR {
border-color:rgba(250,250,250,0.3) !important; background:rgba(250,250,250,0.5); color:black; /* MODIFIABLE */
}
/* TITRE PARTENAIRES PA */
.tleIIDOR {
background:rgba(250,250,250,0.3); color:white; /* MODIFIABLE */
}
/* PARTENAIRES PA */
.partDOR {
background:rgba(0,0,0,0.7); /* MODIFIABLE */
}

Catégorie 12 :

Remplacer l'intégralité du template index_box par :

Code:: <table width="800px" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td valign="bottom">

<span class="gensmall">{LAST_VISIT_DATE}<br />
{CURRENT_TIME}<br />
</span>

<div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div>
</td>
<td class="gensmall" align="right" valign="bottom">

<a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a><br />
<a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a><br />

<a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a>
</td>
</tr>
</table>


<div class="tleCAT">{catrow.tablehead.L_FORUM}</div>
<div class="mdlCAT"><span style="display:block; height:0; clear:both;"></span>





<div class="FRM"><div class="tleFRM"><a href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a></div><div class="boxFRM"><div class="descFRM">{catrow.forumrow.FORUM_DESC}</div><div class="boxIIFRM"><div class="lmsgFRM">{catrow.forumrow.LAST_POST}</div><div class="avaFRM">{catrow.forumrow.avatar.LAST_POST_AVATAR}</div></div></div><img class="imgFRM" src="{catrow.forumrow.FORUM_FOLDER_IMG}" /><div class="sfFRM"><b>+</b><div>{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</div></div><div class="nbFRM">{catrow.forumrow.TOPICS}</div><div class="nbFRM nbIIFRM">{catrow.forumrow.POSTS}</div></div>






<span style="display:block; height:0; clear:both;"></span></div><div class="btmCAT"></div>

Partie CSS :

Code:: /* BLOC TITRE CATEGORIE */
.tleCAT {
margin:5px auto 0;
width:800px; padding:15px 0; text-align:center;
background:#191919; /* MODIFIABLE */
}
/* TITRE CATEGORIE */
.tleCAT h2 {
margin:0;
font-size:42px; text-transform:uppercase; letter-spacing:3px; font-family:Arial;
color:white; text-shadow:1px 1px 0px rgba(0,0,0,0.3); /* MODIFIABLE */
}
/* CONTENU CATEGORIE */
.mdlCAT {
margin:auto; width:800px; padding:16px 0 6px;
background:#F2F2F2; /* MODIFIABLE */
}
/* BAS CATEGORIE */
.btmCAT {
margin:0 auto 10px; width:800px;
height:25px; background:#191919; /* MODIFIABLE */
}
/* BLOC FORUM */
.FRM {
float:left; margin:0 0 10px 16px;
width:245px; font-family:Arial;
}
/* BLOC TITRE FORUM */
.tleFRM {
margin:auto; height:20px; width:245px; padding:5px 0; overflow:hidden;
text-align:center; font-size:14px; font-weight:bold; text-transform:uppercase; line-height:19px;
background:black; /* MODIFIABLE */
}
/* TITRE FORUM */
.tleFRM a {
color:white !important; /* MODIFIABLE */
}
/* BLOC DESCRIPTION / DERNIER MESSAGE FORUM */
.boxFRM {
margin:5px auto;
width:243px; height:110px; padding-top:5px; overflow:hidden; border:1px solid;
border-color:black; background:rgba(250,250,250,0.3); /* MODIFIABLE */
}
/* DESCRIPTION FORUM */
.descFRM {
height:48px; padding:0 5px; overflow:hidden;
text-align:justify; font-size:10px; line-height:12px;
color:black; /* MODIFIABLE */
}
.descFRM:hover {
overflow-y:auto;
}
/* BLOC DERNIER MESSAGE & AVATAR DERNIER POSTEUR FORUM */
.boxIIFRM {
margin:5px auto 0;
width:231px; height:45px; padding-top:5px; border-top:1px solid;
border-top-color:grey; /* MODIFIABLE */
}
/* DERNIER MESSAGE FORUM */
.lmsgFRM {
display:inline-block; vertical-align:middle; margin-right:5px;
width:176px; height:43px; padding-top:2px; overflow:hidden;
text-align:center; font-size:10px; text-transform:uppercase; line-height:14px;
color:black; /* MODIFIABLE */
}
/* COULEUR TITRE SUJET DERNIER MESSAGE FORUM */
.lmsgFRM a {
color:black; /* MODIFIABLE */
}
/* AVATAR DERNIER POSTEUR FORUM */
.avaFRM {
display:inline-block; vertical-align:top;
width:50px; height:45px; overflow:hidden;
}
.avaFRM img {
width:50px;
filter:grayscale(1); -webkit-filter:grayscale(1);
transition:all 0.35s linear; -webkit-transition:all 0.35s linear;
}
.FRM:hover .avaFRM img {
filter:grayscale(0); -webkit-filter:grayscale(0);
}
/* ICÔNES FORUM */
.imgFRM {
display:inline-block; vertical-align:top;
width:75px; height:35px;
}
/* BLOC SOUS-FORUMS */
.sfFRM {
display:inline-block; vertical-align:top; margin-left:5px;
width:55px; height:35px;
}
/* + SOUS-FORUMS */
.sfFRM b {
display:block;
width:55px; height:25px; padding:10px 0px 0px 0px;
text-align:center; font-size:12px;
background:#C7C7C7; color:rgba(0,0,0,0.6); /* MODIFIABLE */
}
/* CONTENU SOUS-FORUMS */
.sfFRM div {
position:absolute; z-index:3; margin-top:-156px; margin-left:-79px;
width:233px; height:0; padding:0 5px; overflow:hidden;
text-align:justify; font-size:10px; text-transform:uppercase; color:rgba(0,0,0,0); line-height:0;
background:grey; /* MODIFIABLE */
transition:all .65s linear; -webkit-transition:all .65s linear;
}
.sfFRM:hover div {
height:105px; padding:5px;
}
/* LIENS SOUS-FORUMS */
.sfFRM a {
display:block; line-height:16px;
color:white !important; /* MODIFIABLE */
}
/* NOMBRE SUJETS FORUM */
.nbFRM {
display:inline-block; vertical-align:top; margin-left:5px;
width:50px; height:25px; padding:10px 0px 0px 0px;
text-align:center; font-size:11px; line-height:16px;
background:lightgrey; color:rgba(0,0,0,0.5); /* MODIFIABLE */
}
/* NOMBRE MESSAGES FORUM */
.nbIIFRM {
background:lightgrey; color:rgba(0,0,0,0.5); /* MODIFIABLE */
}

QEEL 10 :

Remplacer le code du QEEL [lignes 173 à 221] par celui-ci :

Code:: 
<table class="forumline" width="100%" border="0" cellspacing="0" cellpadding="0">
<tr><td><div class="QEEL"><div id="ondayQEEL"><div class="onlineQEEL"><table>{LOGGED_IN_USER_LIST}</table></div><div class="dayQEEL"><table>{L_CONNECTED_MEMBERS}</table></div></div><div id="stsQEEL"><div class="anvQEEL"><table>{L_WHOSBIRTHDAY_TODAY} {L_WHOSBIRTHDAY_WEEK}</table></div><div class="stsQEEL"><div>Dernier inscrit</div><span class="statsHOV" id="nUSER">{NEWEST_USER}</span><script type="text/javascript">document.getElementById('nUSER').innerHTML=document.getElementById('nUSER').innerHTML.replace(/L'utilisateur enregistré le plus récent est /," ")</script><div>Membres</div><span class="statsHOV" id="tUSERS">{TOTAL_USERS}</span><script type="text/javascript">document.getElementById('tUSERS').innerHTML=document.getElementById('tUSERS').innerHTML.replace(/Nous avons /," ") .replace(/membres enregistrés/," ") .replace(/membre enregistré/," ");</script><div>Messages</div><span class="statsHOV" id="tPOSTS">{TOTAL_POSTS}</span><script type="text/javascript">document.getElementById('tPOSTS').innerHTML=document.getElementById('tPOSTS').innerHTML.replace(/Nos membres ont posté un total de /," ") .replace(/messages/," ");</script></div></div><div class="GQEEL">{GROUP_LEGEND}</div><div class="tleQEEL"><a class="cattitle" href="{U_VIEWONLINE}" rel="nofollow">{L_WHO_IS_ONLINE}</a><span id="TLUS">{TOTAL_USERS_ONLINE}</span><script type="text/javascript">document.getElementById('TLUS').innerHTML=document.getElementById('TLUS').innerHTML.replace(/Il y a en tout/,"");</script></div></div></td></tr></table>

Partie CSS pour largeur du forum = 800px :

Code:: /* QEEL */
.QEEL {
margin:auto; width:800px; height:340px; padding-top:20px; text-align:center;
background:black; box-shadow:0 0 3px rgba(0,0,0,0.1); /* MODIFIABLE */
}
/* BLOC MEMBRES EN LIGNE / 24H */
#ondayQEEL {
display:inline-block; vertical-align:top;
width:300px;
}
/* MEMBRES CONNECTES */
.onlineQEEL {
display:inline-block; margin-bottom:10px; margin-right:5px;
width:270px; height:100px; padding:10px; overflow:hidden;
background:rgba(250,250,250,0.8); color:black; /* MODIFIABLE */
font-size:10px; text-align:justify; font-family:Arial;
opacity:0.5; transition:all .45s linear; -webkit-transition:all .45s linear;
}
.onlineQEEL:hover {
overflow:auto; opacity:1;
}
/* 24H QEEL */
.dayQEEL {
display:inline-block; margin-right:5px;
width:280px; height:110px; padding:5px; overflow:hidden;
background:rgba(250,250,250,0.8); /* MODIFIABLE */
font-size:10px; text-align:justify;
opacity:0.5; transition:all .45s linear; -webkit-transition:all .45s linear;
}
.dayQEEL:hover {
overflow:auto; opacity:1;
}
.dayQEEL .row1 {
padding:0; background:none;
}
/* COULEUR TEXTE 24H QEEL */
.dayQEEL .row1 .gensmall {
font-family:Arial; color:black; /* MODIFIABLE */
}
/* BLOC ANNIVERSAIRES / STATISTIQUES QEEL */
#stsQEEL {
display:inline-block; vertical-align:top; margin:0 10px; font-family:Arial;
}
/* ANNIVERSAIRES QEEL */
.anvQEEL {
margin-bottom:10px;
width:225px; height:100px; padding:10px; overflow:hidden;
background:rgba(250,250,250,0.5); /* MODIFIABLE */
font-size:10px; text-align:justify !important;
opacity:0.5; transition:all .45s linear; -webkit-transition:all .45s linear;
}
.anvQEEL:hover {
overflow:auto; opacity:1;
}
.anvQEEL .row1 {
padding:0; background:none;
}
/* COULEUR TEXTE ANNIVERSAIRES QEEL */
.anvQEEL .row1 .gensmall {
font-family:Arial; color:black; /* MODIFIABLE */
}
/* STATISTIQUES QEEL */
.stsQEEL {
margin:auto;
width:245px; height:120px;
font-family:Arial; /* MODIFIABLE */
font-size:11px; text-align:center;
}
/* TITRES STATISTIQUES QEEL */
.stsQEEL div {
margin:5px auto;
width:245px; height:24px; padding:12px 0 0;
text-transform:uppercase; text-align:center; font-weight:bold;
background:rgba(250,250,250,0.4); color:black; /* MODIFIABLE */
transition:all .45s ease; -webkit-transition:all .45s ease;
}
.stsQEEL:hover div {
color:rgba(0,0,0,0);
}
/* CONTENU STATISTIQUES */
.statsHOV {
position:absolute; z-index:5; margin-left:-122px; margin-top:-41px;
width:245px; height:24px; padding:12px 0 0;
background:rgba(250,250,250,0.3); color:black !important; /* MODIFIABLE */
opacity:0; transition:all .45s ease; -webkit-transition:all .45s ease;
}
.stsQEEL:hover .statsHOV {
opacity:1;
}
/* BLOC GROUPES QEEL */
.GQEEL {
display:inline-block; vertical-align:top; margin-left:5px;
width:200px; height:230px; padding:10px 0; overflow:hidden;
text-align:center; color:rgba(0,0,0,0); line-height:14px;
background:rgba(250,250,250,0.5); /* MODIFIABLE */
opacity:0.5; transition:all .45s linear; -webkit-transition:all .45s linear;
}
.GQEEL:hover {
opacity:1; overflow:auto;
}
/* GROUPES QEEL */
.GQEEL a {
display:block;
text-transform:uppercase; font-family:Birch Std; font-size:24px;
text-shadow:1px 1px 0px rgba(0,0,0,0.3); letter-spacing:3px; /* MODIFIABLE */
transition:all .45s ease; -webkit-transition:all .45s ease;
}
/* SURVOL GROUPE QEEL */
.GQEEL a:hover {
letter-spacing:1px; /* MODIFIABLE */
}
/* BLOC NOMBRE UTILISATEURS EN LIGNE & TITRE QEEL */
.tleQEEL {
width:770px; height:50px; padding:15px;
text-transform:uppercase; text-align:center;
}
/* TITRE QEEL */
.tleQEEL a {
font-size:48px; font-family:Birch Std;
color:white; text-shadow:1px 1px 0px rgba(0,0,0,0.3); /* MODIFIABLE */
}
/* NOMBRE UTILISATEURS EN LIGNE */
#TLUS {
display:block; margin-top:-10px;
letter-spacing:0; font-size:9px; font-family:Arial;
color:white; /* MODIFIABLE */
}