Artemis Sujet: Catégories #3 Ven 8 Mai - 17:05 Codes
Code compatible avec les forums PHPBB2
(la partie contenant les catégories se trouve entre
Code: <!-- BEGIN catrow -->
et
Code: <!-- END forumrow -->
, mais vous pouvez tout copier/coller pour un template non modifié.)
Template index_box
Code: <table width="100%" border="0" cellspacing="1" cellpadding="0" align="center"> <tr> <td valign="bottom"> <!-- BEGIN switch_user_logged_in --> <span class="gensmall">{LAST_VISIT_DATE}<br /> {CURRENT_TIME}<br /> </span> <!-- END switch_user_logged_in --> <div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div> </td> <td class="gensmall" align="right" valign="bottom"> <!-- BEGIN switch_user_logged_in --> <a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a><br /> <a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a><br /> <!-- END switch_user_logged_in --> <a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a> </td> </tr> </table> <!-- BEGIN catrow --><div class="title_category_artemis"><!-- BEGIN tablehead -->{catrow.tablehead.L_FORUM} <!-- END tablehead --></div> <!-- BEGIN forumrow --> <div class="category_ls_artemis1"> <div class="avatar_member_ls"> <!-- BEGIN avatar --> {catrow.forumrow.avatar.LAST_POST_AVATAR} <!-- END avatar --> </div> <div class="new_post_stats"> <a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a> <div class="stats_sujets_artemis"> <span>{catrow.forumrow.TOPICS} {L_TOPICS}</span> <span>{catrow.forumrow.POSTS} {L_POSTS}</span> </div> <div class="last_post_link_a"> {catrow.forumrow.LAST_POST} </div> </div> <div class="description_category_ls_arte"> {catrow.forumrow.FORUM_DESC} </div> <div class="image_etat_category"> <img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" /> </div> </div> <div class="sous_forums_category_arte"> {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</div> <!-- END forumrow --> <!-- BEGIN catfoot --> <tr> <!-- BEGIN inc --> <td class="{catrow.catfoot.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td> <!-- END inc --> <td class="spaceRow" colspan="{catrow.catfoot.INC_SPAN}" height="1"><img src="{SPACER}" alt="" height="1" width="1" /></td> </tr> <!-- END catfoot --> <!-- BEGIN tablefoot --> <img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow -->
CSS :
Code: /*********************************************CATEGORIES ARTEMIS ARTIFICES*********************************************/ .title_category_artemis h2 { width: 900px; height: 60px; margin: auto; background: #AAAAAA; font-family: 'Arial'; text-transform: uppercase; font-size: 27px; text-align: right; padding: 16px 40px 0px 0px; -webkit-box-sizing: border-box; box-sizing: border-box; color: #767676; font-style: oblique; } .category_ls_artemis1 { width: 900px; height: 150px; background: #323232; margin: auto; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-pack: distribute; justify-content: space-around; padding: 20px 40px; -webkit-box-sizing: border-box; box-sizing: border-box; position: relative; } .avatar_member_ls { width: 120px; height: 108px; box-sizing: border-box; border: 4px solid #484848; } .avatar_member_ls img { width: 100px; height: 100px; -o-object-fit: cover; object-fit: cover; } .new_post_stats { width: 320px; height: 108px; font-size: 24px; font-family: 'Arial Narrow'; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-left: 40px; } .new_post_stats a { display: inline-block; width: 250px; text-decoration: none; color: #007C6B !important; font-family: 'Calibri'; font-weight: bold; font-size: 25px; margin-bottom: 5px; border-bottom: 1px solid #007C6B; } .new_post_stats a:hover { text-decoration: none !important; } .stats_sujets_artemis span { display: inline-block; text-align: center; text-transform: uppercase; padding-top: 4px; font-family: 'Calibri'; -webkit-box-sizing: border-box; box-sizing: border-box; width: 83px; height: 20px; background: #AAAAAA; font-size: 11px; margin-right: 4px; } .last_post_link_a { height: 70px; width: 200px; font-size: 11px; text-transform: uppercase; color: #AAAAAA; margin-left: -20px; margin-top: 5px; } .last_post_link_a a { text-decoration: none; display: block; border: none; color: #aaaaaa !important; font-family: 'Arial Narrow'; font-size: 14px; font-weight: normal; text-transform: lowercase; margin-bottom: -10px; } .last_post_link_a a:hover { text-decoration: none !important; } .description_category_ls_arte { width: 460px; height: 120px; text-align: justify; font-family:'Georgia'; overflow: auto; font-size: 11px; color: #828282; position: relative; z-index: 2; } .image_etat_category { position: absolute; bottom: 0px; right: 0; z-index: 1; } .sous_forums_category_arte { width: 900px; height: 24px; background: #007C6B; color: #007C6B; margin: auto; padding: 1px 10px; -webkit-box-sizing: border-box; box-sizing: border-box; margin-bottom: 5px; font-size: 11px; } .sous_forums_category_arte a { display: inline-block; width: auto; height: 15px; padding: 0px 5px; background: #484848; color: #AAAAAA; font-family: 'Calibri'; font-size: 11px; text-decoration: none; margin-top: 3px; line-height: 15px; } .sous_forums_category_arte a:hover { text-decoration: none !important; color: #AAAAAA; } /*********************************************FIN CATEGORIES ARTEMIS ARTIFICES*********************************************/
- Code compatible pour les forums en phpbb2.
- Schéma d'Øfty, sur Libre Graph.
- Le brush à droite correspond à l'image no new. Voici les images new et no new :
https://imgur.com/a/Mish49c. Il est bien évidemment possible de modifier la couleur des brushs pour l'adapter à votre forum.
- L'image à gauche correspond à l'avatar du dernier posteur. Pensez à activer cette option dans
Affichage > Page d'Accueil > Structure & Hierarchie > Afficher les avatars dans la colonne "Derniers messages" : oui. En cas de soucis avec ce code, laissez-moi un petit message
ici ! c: