Annonce test.

Partagez|

Catégories background

Croquelune
Croqueuse de pommes
avatar
Messages : 50
Date d'inscription : 02/12/2011
Catégories background Lun 23 Mai - 16:54

ANY COLOR TOUCH


Auteur Charlie
Plateforme Forumactif
Version phpbb2
Difficulté Facile (Moyen pour les modifications)
Accès aux templates Oui
Aperçu

Oy,

Cette fois-ci, quelque chose de plus personnalisable et complet, à jour au niveau tendance.

Un petit merci pour voir la suite ! ^-^




Panneau d'administration Affichage Couleurs Feuille de style CSS


Code:
/** CATÉGORIES & SOUS-FORUMS - DÉBUT **/

 /* class de la catégorie */
.f_categorie {
    padding: 0 0 0 5px;
    border-bottom: 1px solid rgba(0,0,0,0.5);
    margin: 15px 0 10px 0;
    height: 20px;
    line-height: 0px;
    letter-spacing: 1px;
}

 /* texte de la catégorie */
.f_categorie h2 {
    color: black;
    font-size: 30px;
    font-family: Georgia;
    font-weight: 100;
    margin-top: 50px;
}

 /* applique un effet aux sous-sous-forums ayant un nouveau message */
.gensmall.ff_new {font-weight: bold;padding-left: 4px}

 /* les liens des sous-sous-forums */
.f_links a {
    display: block;
    text-align: justify;
    font-family: Tahoma;
    font-size: 9px;
    padding: 0px 0 1px 1px;
    text-transform: uppercase;
}
.f_links {font-size: 0}

 /* cacher les images des liens - ne pas enlever de préférence */
.f_links img {height: 0;width: 0}

 /* class contour des liens des sous-sous-forums */
.f_right {
    display: inline-block;
    width: 200px;
    float: right;
    position: absolute;
    bottom: 0;
    right: 0;
    height: 144px;
    padding: 5px;
    background-color: white;
    text-align: right;
}

 /* cadre blanc de la description */
.f_cadre {
    background-color: rgba(300,300,300,0.75);
    padding: 5px;
}

 /* texte de la description - à modifier à vos risques.. et péril. mwahaha. */
.f_content {
    display: inline-block;
    width: 425px;
    padding: 10px 10px 10px 20px;
    height: 134px;
    margin-top: -10px;
    background-image: linear-gradient(90deg,transparent,#DFDFDF,#DFDFDF,#DFDFDF,#DFDFDF);
    margin-left: -20%;
    position: relative;
}

 /* illustration de la description - taille image = 340x154px*/
.f_sfi {
    float: left;
    margin-right: 10px;
    margin-top: -10px;
    margin-left: -10px;
    opacity: 0.75;
}

 /* description du sous-forum */
.f_desc {
    height: 155px;
    width: 696px;
    font-family: Calibri;
    font-size: 14px;
    padding: 10px;
    text-align: justify;
    color: #3A3A3A;
}

 /* class de la date */
.f_lp span {
    font-size: 14px;
    color: #2A2A2A;
    font-family: Calibri;
}

 /* class de limage menant vers le dernier message */
.f_lp .last-post-icon {
    position: absolute;
    right: 3px;
    bottom: 3px;
    opacity: 0.75;
}

 /* class du lien menant vers le dernier message */
.f_lp a[href^="/t"] {
    color: #232323;
    font-size: 13px;
    font-weight: bold;
    font-family: Arial;
    text-transform: uppercase;
}

 /* class contourant lavatar de lauteur du dernier post */
.f_lpa {
    display: inline-block;
    float: left;
    padding-right: 5px;
    width: 55px;
    height: 55px;
    overflow: hidden;
    margin-top: -2px;
}

 /* lavatar de lauteur du dernier post */
.f_lpa img {
    width: 55px;
    height: auto;
}


 /* class regroupant toutes les infos du dernier post */
.f_lp {
    display: inline-block;
    position: absolute;
    right: 0;
    top: 0;
    background-image: linear-gradient(90deg,transparent,rgba(300,300,300,0.6),rgba(300,300,300,0.7));
    height: 65px;
    width: 40%;
    text-align: right;
    padding-right: 2%; }

 /* css apporté à la banderole lorsquil y a un nouveau message */
.f_line.f_new {
background-color: #2AB3CD;
background-image: url(http://i.imgur.com/TaXWsDT.png);
background-repeat: no-repeat }

 /* cacher les images old et new - à retirer si vous souhaitez voir l image old */
.f_folder img[title="Pas de nouveaux messages"] {display: none}
.f_folder img[title="Nouveaux messages"] {height: 0;width: 0}

 /* statistiques du sous-forum */
.f_stats {
    display: inline-block;
    vertical-align: super;
    padding: 1px 5px 2px 5px;
    font-size: 13px;
    color: white;
    font-weight: bold;
    background-color: rgba(0,0,0,0.08);
    margin-left: 5px;
}

 /* le titre du sous-forum */
.f_forumlink a {
display: inline-block;
color: white !important;
font-family: Oswald;
text-transform: uppercase;
font-size: 23px;
letter-spacing: 1px;
text-shadow: 1px 1px 0px rgba(0,0,0,0.2);
line-height: 45px;
padding-left: 5px }

 /* alignements sur la banderole - à ne pas toucher */
.f_lpb {width: 250px;padding-top: 2%}
.f_forumlink {display: inline-block}
.f_folder {display: inline-block}

 /* la banderole du haut */
.f_line {
background-color: #5c8a93;
height: 45px;
padding: 10px;
position: relative }

 /* la class regroupant tout le sous-forum */
.f_ {
background-color: #dfdfdf;
height: 219px;
margin-bottom: 10px;
margin-left: -10px;
margin-right: -10px;
width: 930px;
position: relative }

/** CATÉGORIES & SOUS-FORUMS - FIN **/

Panneau d'administration Affichage Templates Général Index_box


Code:
<!-- BEGIN catrow -->
<!-- BEGIN tablehead -->
<div class="f_categorie">{catrow.tablehead.L_FORUM}</div>
<!-- END tablehead -->
<!-- BEGIN cathead --> <!-- END cathead -->

<!-- BEGIN forumrow -->
<div class="f_">

<div class="f_line">
  <div
 class="f_forumlink"><a
href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a></div>
  <div class="f_stats">{catrow.forumrow.POSTS} M | {catrow.forumrow.TOPICS} S</div>
  <div
 class="f_folder"><img
title="{catrow.forumrow.L_FORUM_FOLDER_ALT}"
src="{catrow.forumrow.FORUM_FOLDER_IMG}"
alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" /></div>
  <div class="f_lp"><div align="right"><div class="f_lpb">
  <!--
 BEGIN avatar --><div
class="f_lpa">{catrow.forumrow.avatar.LAST_POST_AVATAR}</div><!--
 END avatar -->
    <span>{catrow.forumrow.LAST_POST}</span></div></div></div>
</div>
 
<div class="f_desc">{catrow.forumrow.FORUM_DESC}</div>
<div class="f_right"><div class="f_links">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</div></div>

</div>
<!-- END forumrow -->
<!-- BEGIN catfoot --> <!-- END catfoot -->
<!-- BEGIN tablefoot --> <!-- END tablefoot -->
<!-- END catrow -->


<script>
$(function() {
  $('img[title="Nouveaux messages"]').parent().parent().addClass('f_new');
});
</script>

<script>
$(function() {
  $('.f_links img[title="Nouveaux messages"]').parent().next().addClass('ff_new');
});
</script>

<link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>

Code pour la description des sous-forums:


Code:
<div class="f_sfi1">
 <img src="image" />
</div>
<div class="f_content"><div class="f_cadre">
 Suspendisse
 libero enim, <strong>ornare nec tellus quis</strong>,
feugiat dapibus neque. Praesent laoreet sapien sollicitudin ultricies
luctus. Suspendisse libero enim, ornare nec tellus quis, feugiat dapibus
 neque. Praesent laoreet sapien sollicitudin ultricies luctus.
Suspendisse libero enim, ornare nec tellus quis, feugiat dapibus neque.
Praesent laoreet sapien sollicitudin ultricies luctus.
</div></div>

» Des ajustements et modifications sont à prévoir, mais j'ai limité ceux-ci. Ayant fait l'intégralité, la reproduction de ces codes, qu'elle soit partielle ou non, est strictement interdite pour des raisons évidentes.
Voir le profil de l'utilisateur
Catégories background
Voir le sujet précédent Voir le sujet suivant Revenir en haut
Page 1 sur 1

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
HEAVEN MARCH. :: Bidules trucs :: Codes-
Sauter vers: