Sous-Forums

Le code

Code:

   <!-- BEGIN catrow --><!-- BEGIN tablehead --><table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
       <tr>
         <th colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%" class="secondarytitle"> {catrow.tablehead.L_FORUM} </th>
       </tr>
       <!-- END tablehead -->
       <!-- BEGIN cathead -->
       <tr>
          <!-- BEGIN inc -->
          <td class="{catrow.cathead.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
          <!-- END inc -->
          <td class="{catrow.cathead.CLASS_CAT}" colspan="{catrow.cathead.INC_SPAN}" width="100%">
             <h{catrow.cathead.LEVEL} class="hierarchy">
                <span class="cattitle">
                   <a class="cattitle" title="{catrow.cathead.CAT_DESC}" href="{catrow.cathead.U_VIEWCAT}">{catrow.cathead.CAT_TITLE}</a>
                </span>
             </h{catrow.cathead.LEVEL}>
          </td>
          <td class="{catrow.cathead.CLASS_ROWPIC}" colspan="3" align="right">&nbsp;</td>
       </tr>
       <!-- END cathead -->
       <!-- BEGIN forumrow -->
       <tr>
          <!-- BEGIN inc -->
          <td class="{catrow.forumrow.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" alt="." /></td>
          <!-- END inc -->
          <td class="row1 over" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%">
       <div class="contour_gris_cat">
          <h{catrow.forumrow.LEVEL} class="hierarchy">
                <div class="forumlink">
                  <a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a><br />
                </div>
            </h{catrow.forumrow.LEVEL}>
              <div class="cate_bas">
          <div class="descript_caté_entoure"><span class="genmed">{catrow.forumrow.FORUM_DESC}</span></div>
            <div class="liens_ss_forum"><span id="subforums">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</span></div>
                <div class="position_messages_cat">
              <div class="last_mess_nyo"><span class="gensmall">{catrow.forumrow.LAST_POST}<br/>{catrow.forumrow.TOPICS} sujets<br/>{catrow.forumrow.POSTS} messages</span></div>
              <div class="new_images">
          <img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
       </div>
                </div>
              </div>
            <script type="text/javascript">
            jQuery(function(){
             var separator = "<br />";
               jQuery('span#subforums').each(function(){
                var links = jQuery(this).find("a");
                if(links.length > 1){
                   var html = "";
                   links.each(function(i){
                         html += "<a href='"+jQuery(this).attr('href')+"'  title=\""+jQuery(this).attr('title')+"\" class='gensmall'>"+jQuery(this).text()+"</a>";
                     if(i+1 != links.length){
                        html += separator;
                     }
                   });
                   jQuery(this).html(html);
                }
                jQuery(this).removeAttr('id');
               });
            });
          </script>
       </div>
    </td>
      </tr>
      <!-- END forumrow -->

Code:

   /***** DÉBUT CATÉ *******/
    /* Permet de retirer le fond du titre de catégorie */
    .secondarytitle {
      background: none;
    }

    /* Permet de mettre de l'espace entre les sous-forums et retirer le fond de table */
    .cat-table .forumline .row1, .cat-table .forumline .row2, .cat-table .forumline .row3, .cat-table .forumline .row3Right {
      background: none;
      padding-bottom: 50px;
    }

    /* Retire les fond de tables derrières les sous-forums */
    .cat-table td.row1, .cat-table td.row3.over:hover {
        background: none;
    }

    /* Retire les fond de tables derrières les sous-forums */
    .cat-table td.row1.over:hover, .cat-table td.row2 {
        background: none;
    }

    /* Contour des sous-forums */
    .contour_gris_cat {
      width: 730px;
      height: 260px;
      margin: auto;
      overflow: hidden;
      border-radius: 20px;
      /* Couleur de fond des sous-forums */
      background-color: #999999;
    }

     /* Placement des liens et titres du sous-forum */
    .forumlink {
      margin-left: 30px;
      margin-top: 10px;
      width: 425px;
      height: 25px;
      padding-top: 5px;
      padding-bottom: 5px;
      border-radius: 50px;
      background-color: #CCCCCC;
      text-align: center;
    }

    /* Effet sur les liens de sous-forums */
    a.forumlink {
      margin: 0;
      font-size: 18px;
      transition: all ease 1s;
    }

    /* Au passage de la souris */
    a.forumlink:hover,a.forumlink:link, a.forumlink:focus {
      text-decoration:none !important;
      font-size: 18px;
      transition: all ease 1s;
    }

    /* Mise en place des trois parties */
    .cate_bas {
      width: 100%;
      padding-top: 15px;
      padding-left: 10px;
    }

    /* Bloc de description des catégories */
    .descript_caté_entoure {
      width: 350px;
      height: 190px;
      float: left;
      overflow: hidden;
      border-radius: 10px;
      margin-right: 10px;
      /* Couleur de fond */
      background-color: #666666;
    }

    /* Lien vers les sous-forums */
    .liens_ss_forum {
      width: 120px;
      height: 170px;
      float: left;
      /* Alignement */
      text-align: center;
      border-radius: 10px;
      padding: 10px;
      margin-left: 10px;
      margin-right: 15px;
      /* Couleur de fond */
      background-color: #666666;
    }

    /* Effet sur les liens vers les sous-forums */
    .liens_ss_forum a {
      letter-spacing: 1px;
      transition: all ease 1s;
    }

    /* Effet au passage de la souris */
    .liens_ss_forum a:hover {
      letter-spacing: 3px;
      text-decoration:none !important;
      transition: all ease 1s;
    }

    /* Positionnement du dernier message  */
    .position_messages_cat {
      float: left;
      width: 150px;
      height: 170px;
      position: relative;
      margin-left: 10px;
    }
    
   /* Positionnement de l'image des derniers messages */
    .new_images {
      position: absolute;
      top: -30px;
      left: 7px;
    }

    /* Transformer l'image en rond */
    .new_images img {
      border-radius: 50%;
    }

    /* Mise en forme du dernier message */
    .last_mess_nyo {
      position: absolute;
      top: 60px;
      left: 0;
      padding-top: 45px;
      width: 150px;
      height: 85px;
      border-radius: 10px;
      /* Couleur de fond */
      background-color: #666666;
      text-align: center;
    }
    /***** FIN CATÉ *******/