-40%
Le deal à ne pas rater :
-40% sur Nike Air Presto – Chaussure pour homme
74.97 € 124.99 €
Voir le deal

KoalaVolant
KoalaVolant

Liste de sujets n°2 Empty Liste de sujets n°2

Sam 5 Déc 2020 - 23:52
Type de forum : phpbb2

Pourquoi ne pas opter pour une liste de sujet des plus simples ?
En voici une qui pourrait vous plaire !
Les couleurs ne correspondent pas à l'exemple attention. Et sont bien sûr modifiables Smile



Du coup !

Template



Pour modifier le template c'est simple, il faut aller dans topics_list_box et le remplacer par :

Code:
<!-- BEGIN topics_list_box --><!-- BEGIN row --><!-- BEGIN header_table --><!-- BEGIN multi_selection -->
<script type="text/javascript">
function check_uncheck_main_{topics_list_box.row.header_table.BOX_ID}() {
 var all_checked = true;
 for (i = 0; (i < document.{topics_list_box.FORMNAME}.elements.length) && all_checked; i++) {
 if (document.{topics_list_box.FORMNAME}.elements[i].name == '{topics_list_box.FIELDNAME}[]{topics_list_box.row.header_table.BOX_ID}') {
 all_checked = document.{topics_list_box.FORMNAME}.elements[i].checked;
 }
 }
 document.{topics_list_box.FORMNAME}.all_mark_{topics_list_box.row.header_table.BOX_ID}.checked = all_checked;
}
function check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}() {
 for (i = 0; i < document.{topics_list_box.FORMNAME}.length; i++) {
 if (document.{topics_list_box.FORMNAME}.elements[i].name == '{topics_list_box.FIELDNAME}[]{topics_list_box.row.header_table.BOX_ID}') {
 document.{topics_list_box.FORMNAME}.elements[i].checked = document.{topics_list_box.FORMNAME}.all_mark_{topics_list_box.row.header_table.BOX_ID}.checked;
 }
 }
}
</script>
<!-- END multi_selection -->

<table class="forumline subjects-total" width="100%" border="0" cellspacing="1" cellpadding="0">
 <!-- BEGIN pagination -->
 <tr>
 <td class="row1" colspan="7" align="right"><span class="gensmall">{PAGINATION}</span></td>
 </tr>
 <!-- END pagination -->
 <!-- END header_table --><!-- BEGIN header_row -->
 <tr>
 <td class="row3" colspan="{topics_list_box.row.COLSPAN}"><span class="gensmall"> <b>{topics_list_box.row.L_TITLE}</b></span></td>
 </tr>
<!-- END header_row -->

<!-- BEGIN topic -->
  
{topics_list_box.row.END_TABLE_STICKY}
 <tr class="subj-body">
          <td class="img-subj">
            <img title="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" src="{topics_list_box.row.TOPIC_FOLDER_IMG}" alt="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" />
          </td>
          
          <td class="subj-tit-descr">
             <h2 class="topic-title">
 <a class="topictitle" href="{topics_list_box.row.U_VIEW_TOPIC}">{topics_list_box.row.TOPIC_TITLE}</a>
 </h2>
             <!-- BEGIN switch_description -->
 <span class="genmed">
 <br />
 {topics_list_box.row.topic.switch_description.TOPIC_DESCRIPTION}
 </span>
 <!-- END switch_description -->
          </td>
          
          <td class="author-vuerep">    
            <div class="vues-mess">{topics_list_box.row.VIEWS} vues / {topics_list_box.row.REPLIES} réponses</div>
            <span class="auth-naiss">{topics_list_box.row.TOPIC_AUTHOR}</span>
          </td>
          
             <td class="subj-dern">  
                           <!-- BEGIN avatar -->
            <span class="lastpost-avatar">{topics_list_box.row.topic.avatar.LAST_POST_AVATAR}</span>
                           <!-- END avatar -->
              <div class="author-mess">{topics_list_box.row.LAST_POST_TIME}<br /><span class="dern-rep">{topics_list_box.row.LAST_POST_AUTHOR} {topics_list_box.row.LAST_POST_IMG}</span></div>
          </td>

              
<!-- BEGIN multi_selection -->
 <td class="row2" align="center" valign="middle"><span class="postdetails"><input onclick="javascript:check_uncheck_main_{topics_list_box.row.BOX_ID}();" type="checkbox" name="{topics_list_box.FIELDNAME}[]{topics_list_box.row.BOX_ID}" value="{topics_list_box.row.FID}" {topics_list_box.row.L_SELECT} /></span></td>
 <!-- END multi_selection -->
 </tr>
 <!-- END topic --><!-- BEGIN no_topics -->
 <tr>
 <td class="row1" colspan="{topics_list_box.row.COLSPAN}" align="center" valign="middle" height="30"><span class="gen">{topics_list_box.row.L_NO_TOPICS}</span></td>
 </tr>
 <!-- END no_topics --><!-- BEGIN bottom -->
 <tr>
 <td class="catBottom" colspan="{topics_list_box.row.COLSPAN}" valign="middle">
 <table width="100%" border="0" cellspacing="0" cellpadding="0">
 <tr>
 <td> <span class="gensmall">{PAGINATION}</span></td>
 <td align="right"><a href="#top">{L_BACK_TO_TOP}</a>&nbsp;</td>
 </tr>
 </table>
 </td>
 </tr>
<!-- END bottom --><!-- BEGIN footer_table -->
</table><!-- END footer_table --><!-- BEGIN spacer --><br class="gensmall" /><!-- END spacer --><!-- END row --><!-- END topics_list_box -->

CSS



Code:
/********************** LISTE DE SUJETS PAR KOALAVOLANT ************************/

.subj-body{ display:flex; justify-content:space-between; margin:10px 0px; background-color:#D3CFC0; padding:10px; }

/* Image sur le coté */

.img-subj{ width:30px; }
.img-subj img{ width: 30px;height: 65px;  object-fit: cover;}

/* Titre & Description */

.subj-tit-descr{ width:53%; }
.subj-tit-descr a.topictitle{ margin:0; background:#7D4F42; padding:5px; color:#fff; font-family:'Oswald', sans-serif;
  font-weight:normal; font-size:16px; letter-spacing:3px; text-transform:uppercase; transition:500ms; }
.subj-tit-descr a:hover{ background:#222; }
.subj-tit-descr .genmed{ font-family:Verdana; font-size: 12px; color:#222; display:block; }

/* Vue Reponse et Auteur */

.author-vuerep{ width:15%; }
.vues-mess{ font-family:'Oswald', sans-serif;  font-size:11px; text-align:center; background:#8E5D4C; color:#fff; padding:5px 0px; }
.auth-naiss{ font-family:Verdana; font-size:17px; text-align:center; color:#222; margin-top:5px; }
.auth-naiss a{ display:block; margin-top:5px; }
.auth-naiss a span{ text-align:center; }

/* Date et Image */

.subj-dern{ width:25%; margin-top:6px; }
.subj-dern .lastpost-avatar{ position:relative; z-index:14; }
.subj-dern .lastpost-avatar img{ border-radius: 50%;    border: 3px solid #7D4F42;     height: 38px;    width: 38px; object-fit:cover; }
.subj-dern .dern-rep{ background-color:#7D4F42; padding:5px; margin-left: -14px;  padding-left: 31px;position: relative;z-index: 5;
  margin-top: 2px; display: inline-block;}
.subj-dern .dern-rep strong{ color:#fff !important; }

.author-mess{ font-size:10px; }
Revenir en haut

Partenaires footer

RPG-Chevalier Logo WyvArtem Image hébergée gratuitement chez Image hébergée gratuitement chez