AccueilRechercherS'enregistrerConnexion

Forum de graphisme, codage et game design proposant des tutoriels, astuces, libres services et commandes dans les domaines de l'infographie amateur, de l'intégration web (HTML et CSS essentiellement) ainsi que dans la conception de RPG sur forum.


    Catégories Pink & Gray

    A-Lice
    A-Lice
    FémininAge : 27Messages : 4939

    Sam 19 Juil 2014 - 3:47

    Rappel du premier message :



    Catégories Pink & Gray


    Suite à une demande de Javarakita voici des catégories Pink & Gray.

    Je précise que l'arrière plan beige correspond à mon forum.

    HTML & CSS ~ Voici donc un aperçu : www ~ Version : PhpBB2


    Précision : La taille des images news/no news/lock doit faire 150px par 50px.

    Et le code :
    HTML :
    Code:
    <link href='http://fonts.googleapis.com/css?family=Playball' rel='stylesheet' type='text/css'>
      <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 --><!-- BEGIN tablehead --><table class="forumline" width="100%" border="0" cellspacing="0" cellpadding="0">
    <th colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%" class="secondarytitle"> {catrow.tablehead.L_FORUM} </th>   
    <th nowrap="nowrap" width="150"><div style="width:150px;"> </div></th><!-- 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%">
                <span class="cattitle">
                   <a class="cattitle" title="{catrow.cathead.CAT_DESC}" href="{catrow.cathead.U_VIEWCAT}">{catrow.cathead.CAT_TITLE}</a>
                </span>
          </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="{catrow.forumrow.INC_CLASS}" align="center"><br/>
                <img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" style="margin-top:7px;" />
                      <div class="cat_gauche"><span class="gensmall">{catrow.forumrow.TOPICS} sujets | {catrow.forumrow.POSTS} messages</span><br/>
             <span class="gensmall">{catrow.forumrow.LAST_POST}</span>
                      </div></td>
          <td class="row1 over" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%" height="50">
                      <span class="nom_cat">
                   <a class="nom_cat" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a><br />
                </span>
                      <span class="cat_desc">{catrow.forumrow.FORUM_DESC}</span>
          </td>
          <td class="row3" align="center" valign="middle" height="50">
                      <span class="cat_droite_conteneur"><div class="cat_droite_contenu" id="sousForums"><span class="gensmall2">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</span></div></span>
                        <script type="text/javascript">
      <!--
                          jQuery('#sousForums').html(jQuery('#sousForums').html().replace(/, /g,'<br />')).removeAttr('id');
      jQuery(document).ready(function(){
        jQuery('a.gensmall').each(function (){
        var texte = jQuery(this).attr('title') ;
        if(texte){
        texte = texte.replace(/\<\/a\>/gi, '').replace(/\<br \/\>/gi, '').replace(/\<br >/gi, '');
        jQuery(this).attr('title', texte);
        }
        });
      });
      //-->
      </script>
          </td>
       </tr>
       <!-- 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 -->
    </table><img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow -->


    CSS :
    Code:
    .secondarytitle {
      text-align:left !important;
      font-family: 'Playball', cursive;
    }
    .cat_gauche {
    font-size:12px;
    background-color:WhiteSmoke;
    padding:5px;
    margin-top:9px;
    width:140px;
    }

    .nom_cat {
    font-size:20px;
    font-weight:bold;
    font-family: 'Playball', cursive;
    transition:1s;
    transition-delay: -0.1s;
    }

    .nom_cat:hover {
    font-size:20px;
    font-weight:bold;
    font-family: 'Playball', cursive;
    letter-spacing:5px;
    transition:1s;
    }

    .cat_desc {
    height:105px;
    overflow:auto;
    display:block;
    text-align:justify;
    font-size:12px;
    background-color:WhiteSmoke;
    padding:10px;
    }

    .cat_droite_conteneur {
    margin-top:25px;
    height:105px;
    overflow:auto;
    display:block;
    text-align:justify;
    background-color:WhiteSmoke;
    padding:10px;
    }

    .cat_droite_contenu {
    background-color:pink;
    padding:3px;
    width:124px;
    margin:auto; 
    font-family: 'Playball', cursive;
    font-size:18px;
    }

    .gensmall2 a {
      font-size:18px !important;
    }

    La suite de l'ensemble se trouve ici :


    PA Pink & Gray
    Catégories
    Qeel

    Un petit merci ou commentaire est toujours le bienvenu ^^
    - Mettre/laisser un crédit vers Never-Utopia est obligatoire.
    - Si vous avez des problèmes avec ce LS ou des questions, venez poster ici.


    Dernière édition par A-Lice le Lun 16 Fév 2015 - 21:13, édité 1 fois

    Furries
    Furries
    FémininAge : 24Messages : 34

    Mar 9 Sep 2014 - 8:24

    Merci !
    Raween
    Raween
    FémininAge : 29Messages : 112

    Mer 10 Sep 2014 - 20:18

    Merci beaucoup <3
    Xelha
    Xelha
    FémininAge : 28Messages : 135

    Jeu 11 Sep 2014 - 20:58

    Merci du partage
    Milka
    Milka
    FémininAge : 33Messages : 112

    Sam 13 Sep 2014 - 17:05

    Thanks :)
    Mélaïna
    Mélaïna
    FémininAge : 33Messages : 70

    Lun 15 Sep 2014 - 11:50

    Merci pour le code :)
    LHOOQ
    LHOOQ
    MasculinAge : 28Messages : 20

    Mer 24 Sep 2014 - 0:01

    Merci :arrh:
    Monaka
    Monaka
    FémininAge : 29Messages : 133

    Jeu 25 Sep 2014 - 20:37

    très jolie code !
    Tony`s
    Tony`s
    MasculinAge : 29Messages : 64

    Ven 26 Sep 2014 - 4:04

    merci !! bravo
    GeoNimo
    GeoNimo
    FémininAge : 36Messages : 48

    Ven 26 Sep 2014 - 17:52

    merci
    cosmos-chann
    cosmos-chann
    FémininAge : 24Messages : 115

    Sam 27 Sep 2014 - 12:57

    Trop jolies !
    Myfanwi
    Myfanwi
    FémininAge : 24Messages : 97

    Sam 27 Sep 2014 - 22:49

    Merci beaucoup Very Happy
    avatar
    Løve
    MasculinAge : 26Messages : 189

    Jeu 2 Oct 2014 - 11:37

    Merci o/
    The_Psychocat
    The_Psychocat
    MasculinAge : 26Messages : 37

    Ven 10 Oct 2014 - 13:33

    Encore un très beau code, A-Lice ! Merci ! ♥
    Lihuén
    Lihuén
    FémininAge : 31Messages : 544

    Ven 10 Oct 2014 - 15:26

    Merci! (:



    avatar
    Wolftactick
    FémininAge : 19Messages : 71

    Sam 11 Oct 2014 - 0:29

    wuw
    Screen
    Screen
    FémininAge : 29Messages : 92

    Dim 19 Oct 2014 - 22:23

    Merci!
    Pinkie
    Pinkie
    FémininAge : 21Messages : 33

    Lun 20 Oct 2014 - 13:47

    Bravo =) ♫
    Layla4
    Layla4
    FémininAge : 22Messages : 149

    Lun 20 Oct 2014 - 14:28

    Thanks ! *-*
    Shadaan
    Shadaan
    FémininAge : 29Messages : 80

    Jeu 23 Oct 2014 - 16:58

    Merciii :)



    Catégories Pink & Gray - Page 3 897455signnu
    Astra
    Astra
    FémininAge : 24Messages : 20

    Sam 25 Oct 2014 - 20:25

    Super boulot, c'est très joli, et épuré à la fois ! Merci A-Lice Wink
    Kaamee
    Kaamee
    FémininAge : 25Messages : 110

    Lun 27 Oct 2014 - 18:22

    Merci ♥



    Dark Dream
    Dark Dream
    FémininAge : 29Messages : 79

    Mar 28 Oct 2014 - 15:05

    merci beaucoup ♥
    Nasu
    Nasu
    FémininAge : 24Messages : 70

    Ven 7 Nov 2014 - 14:37

    Oh oui j'adore !
    Kiki*
    Kiki*
    FémininAge : 24Messages : 32

    Lun 10 Nov 2014 - 18:54

    Merci :)
    Anonymous
    Invité

    Jeu 13 Nov 2014 - 20:14

    Very Happy Very Happy
    Contenu sponsorisé


      La date/heure actuelle est Jeu 5 Aoû 2021 - 19:07