• thèmes (l-b)

    Ces thèmes sont fait pour eklablog, donc je ne sais pas s'ils sont adaptables à d'autres plateformes.

  • Thème #4 - Fantasmagories

     

     

    Voici un thème converti en full CSS, il était avant installé avec l'interface d'eklablog et comme il ne me servait, je vous le laisse ici! C'était un ancien thème de RPG et comme vous êtes plutôt favorable à ce que je mette des thèmes de RPG inutilisés en libre-service, voici!

    Si jamais vous ne savez pas comment trouver le numéro de vos menus, dites le moi, je vous aiderait.

    Le blog test se trouve ici, si vous voulez voir l'intégralité du thème (les commentaires, les forums, le reste de la page...).

    Merci de me prévenir si vous l'utilisez. ♥

    (+) Pour changer le titre, demandez moi et donnez moi le votre, je le ferais aussi vite que possible!

    (+) Il faut que toutes les valeurs soit à zéro et décochées, sauf format du blog > page > automatique centré

    (+) Tous les menus sont personnalisés avec de l'html!

    (+) Vous pouvez changer les couleurs si elles ne vous plaisent pas. Si vous avez besoin d'aide, n'hésitez pas! (je peux modifier une image pour vous, si vous voulez qu'elle s'accorde à peu près avec le thème)

    (+) Les "XXXXXXXX" module_menu_contenuXXXXXXXX sont à remplacer par le "numéro" de votre module. Voici un tuto qui pourrait vous aider ici! Et si jamais, je suis joignable pour toute question.

    (+) L'ordre des menus doit être (de préférence, pour une certaine cohérence): contexte - liens - péripéties - shoutbox - prédéfinis - derniers topics - statistiques - derniers visiteurs

     

     CODE CSS:

    /*----------------ENTÊTE DECLARATIVE----------------*/
     
    @font-face {font-family: "Dosra"; /*dorsa regular*/
     src: url('http://ekladata.com/sursaut-gamma.cd.st/perso/police/Dorsa-Regular.ttf');}
     
    @font-face {font-family: "Asloch"; /*astloch regular*/
     src: url('http://ekladata.com/sursaut-gamma.cd.st/perso/police/Astloch-Regular.ttf');}
     
    @font-face {font-family: "Six Caaps"; /*six caps*/
     src: url('http://ekladata.com/sursaut-gamma.cd.st/perso/police/SixCaps.ttf');}
     
    @font-face {font-family: "Wirone"; /*wire one*/
     src: url('http://ekladata.com/sursaut-gamma.cd.st/perso/police/WireOne.ttf');}
     
    @font-face {font-family: "Boubbet"; /*geo sans light*/
     src: url('http://ekladata.com/chercher.lo.gs/perso/police/GeosansLight.ttf');}

      
    /*----------------BODY & FENÊTRE----------------*/
     
    #body {
        background:transparent url("http://ekladata.com/f3M89nCcVF-GifSdoS350BJ88TI.png")center top repeat;
        background-color: #1e1e1e;
        font-family: arial;
        font-size: 12px;
    }
     
    #body a {
        text-decoration: none;
        -webkit-transition: all 0.7s ease;
        -moz-transition: all 0.7s ease;
        -o-transition: all 0.7s ease;
    }
     
    body a:hover {
        -webkit-transition: all 0.7s ease;
        -moz-transition: all 0.7s ease;
        -o-transition: all 0.7s ease;
    }
     
    .module_contenu img {text-align: center;
                         margin 0px;
    }
     
     
    /*----------------FOND PAGE----------------*/
     
    #background {width: 888px;
        background-color: #1e1e1e;
        box-shadow: 0 0 5px #0F0F0F;
        border-left: 3px solid #0F0F0F;
        border-right: 3px solid #0F0F0F;
    }
     
     
     
    /*----------------HEADER----------------*/
     
    #header {
        height:500px;
        widht: 800px;
        background:transparent url(http://ekladata.com/90VqirgCbVYlEiAxrP8Uok1BDWE/ESSAI-classe-with-cara-png-and-typo-dechirer.png) center top no-repeat;
    }
     
    #menu a{
        text-transform: uppercase;
        font-style: italic;
        color: white;
        width: 129px;
        height: 19px;
        margin-right: 5px;
        padding-top: 6px;
        padding-bottom: 5px;
        text-align: center;
        font-family: arial;
        font-size: 14px;  
    }


     
    /*----------------MENU----------------*/
     
    /****MENU 1*****/
     
    #menu1 {
        text-align: center;
        font-family: arial;
        width: 220px;
        color: #808080;
        margin-left: 35px;
    }
     
    #menu1 a{color: #D0AE85;}
     
    #menu1 a:hover{color: #873F32;}
     
    #menu1 .module_menu_titre {
        font-size: 0px;
    }
     
    #menu1 .module_menu {
        margin-bottom: 20px;
    }
     
    #menu1 .module_menu_contenu {
    }
     
    /*MENU LIENS*/
     
    #module_menuXXXXXXXX a{
        letter-spacing: 2px;
        background-color: #121212;
        color: #8E7666;
        display: block;
        margin: 5px;
        padding: 2px 6px;
        text-align: center;
        font-size: 11px;
        text-transform: uppercase;
        transition: all 0.8s ease;
        -moz-transition: all 0.8s ease;
        -webkit-transition: all 0.8s ease;
        opacity: 0.8;

    }
      
    #module_menuXXXXXXXX a:hover{
        -moz-transition: all 0.8s ease 0s;
        background-color: #7B6362;
        color: #C5B3AF;
        transition: all 0.8s ease;
        -webkit-transition: all 0.8s ease;
        opacity: 0.4;
    }

     
    /***DERNIERS VISISTEURS***/
     
    .module_menu_type_lastvisitors img{
        border-radius: 34px;
        border: 2px solid #5A757D;
        max-width: 38px;
        margin: 7px;
    }
     
    .module_menu_type_lastvisitors img:hover{
        opacity: 0.7;
    }
     
     
    /*----------------ARTICLES----------------*/
     
     
    .module_titre_contenu{
        height: 100%;
        color: white;
        text-align: center;
        padding: 30px;
        font-family: "Six Caaps";
        font-size: 40px;
        letter-spacing: 2px;
        word-spacing: 1px;
        text-transform: uppercase;
        background:transparent url(http://ekladata.com/jYv4jcalGLRP9ATz3ZpqkRRkh_Y.png) center top no-repeat;
        background-color: #59737A;
        margin-left: 30px;
        margin-right: 40px;
        letter-spacing: 1px;
        border-top-left-radius: 53px;
        border-top-right-radius: 53px;
        text-transform: uppercase;
    }
     
    .module_titre_contenu a{
        color: white;
        padding-bottom: 10px;
        font-family: "Six Caaps";
        font-size: 40px;
        text-transform: uppercase;
    }
     
    .article_info {
        font-size: 0px;
    }
     
    .module_contenu {
        background-color: #131313;
        color: #333333;
        text-align: justify;
        font-family: arial;
        font-size: 12px;
        padding: 20px;
        margin-bottom: 20px;
        margin-left: 30px;
        margin-right: 40px;
        border-bottom-left-radius: 10px;
        border-bottom-right-radius: 10px;
    }
     
    .module_contenu a {
        color: #2C3449;
        font-weight: bold;
        
    }
     
    .module_contenu a:hover {
        color: #D0AE85;
    }
     
    /*----------------COMMENTAIRE----------------*/
     
    .comment_normal, .comment_admin {
        width: 98%;
    }
     
    div.commentheader{
        background-color: #391A15;
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;
        margin-bottom: 8px;
        margin-top: 28px;
        font-family: arial;
        padding: 5px;
        position: relative;
    }
     
    .comment_admin .commentheader{
        background-color: #5B2B22;
    }
     
    div.commentbody {
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;
        background-color: #222222;
        padding: 10px;
        color: #C1C1C1;
        margin-top: -10px;
    }
     
    .comment_admin .commentbody {
        background-color: #0F0F0F;
        color: grey;
        padding: 10px;
    }
     
    .block-reply {
        border-left: 3px solid #2C3449;
    }
     
    .comment-reply a{
        color: #616161;
        font-family: Arial;
        text-transform: uppercase;
        font-size: 8px;
        letter-spacing: 1px;
    }
     
    .comment-reply a:hover{
        color: #2C3449;
    }
     
    .commentnumber {
        font-family: "Asloch";
        color: white;
        font-size: 20px;
        padding-left: 5px;
        opacity: 0.6;
    }
     
    .commentpseudo {
        font-family: "Asloch";
        color: #888888;
        font-size: 15px;
        letter-spacing: 1px;
        text-transform: lowercase;
    }
     
    .commentpseudo a {color: #999999; font-weight: none;}
     
    .commentpseudo a:hover {color: #888888; opacity: 0.5;}
     
    .commentavatar {
        margin-right: 10px;
        margin-top: -35px;
        position: relative;
        padding: 5px;
    }
     
    .commentavatar img {
        border: 3px solid #2C3449;
        border-radius: 100px;
    }
     

    .block-reply li .commentavatar {
        margin-right: 5px;
        margin-top: -5px;
        position: relative;
        padding: 5px;}
     
    .commentdate {
        font-size: 10px;
        opacity: 0.5;
    }
     
     
     
     
    /*----------------PIED DE PAGE----------------*/
     
    #footer {
        text-align: center;
        text-transform: uppercase;
        font-size: 11px;
        color: #827A69;
        padding: 40px;
    }
     
    #footer a {
        color: #873F32;
        font-weight: bold;
    }
     
    #footer a:hover {
        color: #4C6167;
    }
     
    #footer:after {content: " Thème de Fabule";}
     
     
    /*----------------HELPBUBBLES----------------*/
     
    #help_bubble {
        background-color: #333333;
        color: #F1F1F1;
        border: 2px solid black;
        border-radius: 4px;
        opacity: 0.7;
        font-size: 11px;
        text-transform: uppercase;
        font-family: consolas;
    }
     
     
    /*----------------BOUTONS----------------*/
     
    input[type=button],input[type=submit], button {
        margin: 9px;
        margin-left: 0px;
        min-width: 100px;
        min-height: 20px;
        background-color: #873F32;
        color: white;
        text-shadow: 2px 1px 0px rgba(0, 0, 0, 0.15);
        font-family: consolas;
        border: 3px solid #632F25;
        text-transform: uppercase;
        font-size: 11px;
        border-radius: 5px;
    }
     
    input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover, button:hover, .button:hover {
        background-color: #454E63;
        color: white;
        border: 3px solid #333A4A;
    }
     
    /*******FORUMS********/
     
    .post_table_msg {background-color: #242424;
                     padding: 10px;
                     border-bottom: 1px solid #131313;
                     border-top-right-radius: 3px;
                     border-bottom-right-radius: 3px;
    }
     
    .post_table_head {color: #F7F7F7;
                      font-size: 0px;
    }
     
    .post_table_profile img{border: 2px solid #0F0F0F;
                            margin-left: 10px;
                            margin-top: -7px;
                            margin-bottom: 10px;
                            padding: 0px;
                            opacity: 0.7;
    }
     
    .post_table_profile a{color: #454545;
                          display: block;
                          width: 79px;
                          background-color: #0F0F0F;
                          border-radius: 30px;
                          margin-top: 15px;
                          margin-left: 10px;
                          text-align: center;
                          opacity: 0.7;
                          -webkit-transform: rotate(-2deg);
                          -moz-transform: rotate(-2deg);
                          -o-transform: rotate(-2deg);
                          transform: rotate(-2deg);
    }
     
    .post_table_profile {background-image: url('http://ekladata.com/GLDhNEK2TcYAfFNXK8mPP1r-ns8/jvhhkkj.png');
                         border-top-left-radius: 3px;
                         border-bottom-left-radius: 3px;
                         border-bottom: 1px solid #131313}
     
    .forum-description {background-color: #0D0D0D;
                        margin-top: 20px;
                        margin-bottom: 20px;
                        padding: 10px;
                        border: 2px solid #080808;}
     
    /****************BALISES****************/
     
    .CONTEXTE {
        border: 3px solid #black;
        margin: 0px;
        padding: 10px;
        background-color: #1A1A1A; /*Couleur de fond*/
        height: 191px; /*hauteur de ton image*/
        opacity: 0; /*pour qu'on ne le voit pas, tant que ce n'est pas survollé*/
        position: absolute;
        width: 169px; /*largeur de ton image*/
        transition: all 0.6s ease; /*temps d'apparition au survol*/
    }

    #image:hover .CONTEXTE {
        height: 191px; /*hauteur de ton image*/
        opacity: 0.95; /*opicité du fond lorsqu'il apparaît, si y a 0.9 c'est qu'il est un peu transparent*/
        width: 169px; /*largeur de ton image*/
    }
     
     

     

    CODE HTML FICHE DE PERSONNAGE:

    <p style="text-align: center;">&nbsp;</p>
    <table style="margin-left: auto; margin-right: auto;">
    <tbody>
    <tr>
    <td style="text-align: center;">
    <table>
    <tbody>
    <tr>
    <td>
    <p style="text-align: center;"><img style="padding: 3px; border: 1px solid #0D0D0D;" src="http://ekladata.com/lVOLUcyGUtidr-EWmzLAFBxlPcE.png" alt="" /></p>
    </td>
    </tr>
    <tr>
    <td>
    <div style="background-color: #0d0d0d; width: 468px; min-height: 25px; line-height: 11px; margin: 10px; border: 1px solid #0A0A0A; padding: 20px; overflow: auto; text-align: justify; color: #7d7d7d;">
    <p><span style="font-family: 'Dosra'; font-size: 36pt; color: #2c2e33; letter-spacing: 3px;"> <br />INFORMATIONS;<br /></span></p>
    <strong>NOM:</strong> &eacute;crire ici &mdash; <strong>PR&Eacute;NOM:</strong> &eacute;crire ici &mdash; <strong>&Acirc;GE:</strong> &eacute;crire ici &mdash; <strong>DATE DE NAISSANCE:</strong> &eacute;crire ici &mdash; <strong>NATIONALIT&Eacute;</strong> &eacute;crire ici &mdash; <strong>ORIENTATION SEXUELLE:</strong> &eacute;crire ici &mdash; <strong>STATUT CIVIL:</strong> &eacute;crire ici&nbsp;&mdash; <strong>PROFESSION/&Eacute;TUDES:</strong> &eacute;crire ici</div>
    </td>
    </tr>
    <tr>
    <td>
    <div style="background-color: #2c2e33; width: 468px; min-height: 25px; line-height: 11px; margin: 10px; border: 1px solid #0D0D0D; padding: 20px; overflow: auto; text-align: justify;">
    <p><span style="font-family: 'Dosra'; font-size: 36pt; color: #b5b5b5; letter-spacing: 3px;"> <br />CARACT&Egrave;RE;<br /></span></p>
    <span style="color: #7c8087;"><strong>AIME:</strong> &eacute;crire ici &mdash; <strong>AIME PAS:</strong> &eacute;crire ici &mdash; <strong>SI TU &Eacute;TAIS UN ANIMAL:</strong> &eacute;crire ici &mdash;&nbsp;<strong>SI TU &Eacute;TAIS UN JOUR DE LA SEMAINE:</strong> &eacute;crire ici &mdash; <strong>TA PLUS GRANDE PEUR:</strong> &eacute;crire ici &mdash; <strong>QUI ES-TU? :</strong> &eacute;crire ici (humain/magus/faucheur) &mdash; <strong>QUEL CAMP? :</strong> &eacute;crire ici<br />&nbsp;<br />D&eacute;cris ton caract&egrave;re ici.</span><span style="color: #cad0e3;">&nbsp;</span><span style="color: #cad0e3;">&nbsp;</span></div>
    </td>
    </tr>
    <tr>
    <td>&nbsp;
    <p style="text-align: center;"><img style="padding: 3px; border: 1px solid #0D0D0D;" src="http://ekladata.com/lVOLUcyGUtidr-EWmzLAFBxlPcE.png" alt="" /></p>
    </td>
    </tr>
    <tr>
    <td>&nbsp;
    <table>
    <tbody>
    <tr>
    <td>
    <div style="background-color: #0d0d0d; width: 468px; min-height: 25px; line-height: 11px; margin: 10px; border: 1px solid #0A0A0A; padding: 20px; overflow: auto; text-align: justify; color: #7d7d7d;">
    <p><span style="font-family: 'Dosra'; font-size: 36pt; color: #2c2e33; letter-spacing: 3px;"> <br />POUVOIR;<br /></span></p>
    <strong>L'AS-TU DEPUIS LONGTEMPS? :</strong> &eacute;crire ici &mdash; <strong>T'EN SERS TU SOUVENT? :</strong> &eacute;crire ici &mdash; <strong>EST-CE QUE TU CONNAIS D'AUTRES MAGUS? :</strong> &eacute;crire ici &mdash; <strong>EN AS-TU PEUR?&nbsp;</strong> &eacute;crire ici<strong><br />&nbsp;<br />&nbsp;<br />&nbsp;<br />NOM DE TON POUVOIR (&eacute;ventuellement) </strong>&mdash; D&eacute;cris ici ton pouvoir, ce qu'il fait, et peut &ecirc;tre des effets secondaires?</div>
    </td>
    </tr>
    <tr>
    <td>
    <div style="background-color: #2c2e33; width: 468px; min-height: 25px; line-height: 11px; margin: 10px; border: 1px solid #0D0D0D; padding: 20px; overflow: auto; text-align: justify;">
    <p><span style="font-family: 'Dosra'; font-size: 36pt; color: #b5b5b5; letter-spacing: 3px;"> <br />HISTOIRE;<br /></span></p>
    <span style="color: #7c8087;"><strong>AS-TU DES R&Ecirc;VES? :</strong> &eacute;crire ici &mdash; <strong>CROIS-TU EN L'AMOUR? :</strong> &eacute;crire ici &mdash; <strong>VIS TU BIEN TA CONDITION? :</strong> &eacute;crire ici &mdash; <strong>SI TU POUVAIS CHANGER UN TRUC DANS TA VIE, CE SERAIT QUOI? :</strong> &eacute;crire ici &mdash; <strong>CRAINS-TU LE FUTUR? :</strong> &eacute;crire ici </span><br /><span style="color: #7c8087;">&nbsp;</span><br /><span style="color: #cad0e3;">&nbsp;</span><br /><span style="color: #7c8087;">&Eacute;cris son histoire ici.<br /></span></div>
    </td>
    </tr>
    </tbody>
    </table>
    </td>
    </tr>
    </tbody>
    </table>
    </td>
    </tr>
    </tbody>
    </table>
    <p style="text-align: center;">&nbsp;</p>
    <table style="margin-left: auto; margin-right: auto;">
    <tbody>
    <tr>
    <td>
    <div style="background-color: #0d0d0d; width: 468px; min-height: 25px; line-height: 11px; margin: 10px; border: 1px solid #0A0A0A; padding: 20px; overflow: auto; text-align: justify; color: #7d7d7d;">
    <p><span style="font-family: 'Dosra'; font-size: 36pt; color: #2c2e33; letter-spacing: 3px;"> <br /><em>RELATIONS</em>;<br />&nbsp;<br /></span></p>
    <strong>PRENOM NOM :</strong> &eacute;crire ici</div>
    </td>
    </tr>
    </tbody>
    </table>
    <p>&nbsp;</p>
    <p>&nbsp;</p>

     

    CODE HTML FICHE DE PNJ:

    <p style="text-align: center;">&nbsp;</p>
    <table style="margin-left: auto; margin-right: auto;">
    <tbody>
    <tr>
    <td style="text-align: center;">
    <table>
    <tbody>
    <tr>
    <td>
    <p style="text-align: center;"><img style="padding: 3px; border: 1px solid #0D0D0D;" src="http://ekladata.com/lVOLUcyGUtidr-EWmzLAFBxlPcE.png" alt="" /></p>
    </td>
    </tr>
    <tr>
    <td>
    <div style="background-color: #0d0d0d; width: 468px; min-height: 25px; line-height: 11px; margin: 10px; border: 1px solid #0A0A0A; padding: 20px; overflow: auto; text-align: justify; color: #7d7d7d;">
    <p><span style="font-family: 'Dosra'; font-size: 36pt; color: #2c2e33; letter-spacing: 3px;"> <br />INFORMATIONS;<br /></span></p>
    <strong>NOM:</strong> &eacute;crire ici &mdash; <strong>PR&Eacute;NOM:</strong> &eacute;crire ici &mdash; <strong>&Acirc;GE:</strong> &eacute;crire ici &mdash; <strong>DATE DE NAISSANCE:</strong> &eacute;crire ici &mdash; <strong>NATIONALIT&Eacute;</strong> &eacute;crire ici &mdash; <strong>ORIENTATION SEXUELLE:</strong> &eacute;crire ici &mdash; <strong>STATUT CIVIL:</strong> &eacute;crire ici&nbsp;&mdash; <strong>PROFESSION/&Eacute;TUDES:</strong> &eacute;crire ici</div>
    </td>
    </tr>
    <tr>
    <td>&nbsp;
    <table>
    <tbody>
    <tr>
    <td>
    <div style="background-color: #2c2e33; width: 468px; min-height: 25px; line-height: 11px; margin: 10px; border: 1px solid #0d0d0d; padding: 20px; overflow: auto;">
    <p style="text-align: justify;"><span style="font-family: 'Dosra'; font-size: 36pt; color: #b5b5b5; letter-spacing: 3px;"> <br />POUVOIR;<br /></span></p>
    <span style="color: #7c8087;"><strong>&nbsp;<br />NOM DE TON POUVOIR (&eacute;ventuellement) </strong>&mdash; D&eacute;cris ici ton pouvoir, ce qu'il fait, et peut &ecirc;tre des effets secondaires?</span></div>
    </td>
    </tr>
    </tbody>
    </table>
    </td>
    </tr>
    </tbody>
    </table>
    </td>
    </tr>
    </tbody>
    </table>
    <p>&nbsp;</p>
    <table>
    <tbody>
    <tr>
    <td>
    <div style="background-color: #0d0d0d; width: 468px; min-height: 25px; line-height: 11px; margin: 10px; border: 1px solid #0A0A0A; padding: 20px; overflow: auto; text-align: justify; color: #7d7d7d;">
    <p><span style="font-family: 'Dosra'; font-size: 36pt; color: #2c2e33; letter-spacing: 3px;"> <br /><em>RELATIONS</em>;<br />&nbsp;<br /></span></p>
    <strong>PRENOM NOM :</strong> &eacute;crire ici</div>
    </td>
    </tr>
    </tbody>
    </table>
    <p>&nbsp;</p>

     

    CODE HTML IMAGE DE CONTEXTE:

    <div id="image">
    <div class="CONTEXTE">
    <div style="width: 165px; height: 195px; overflow: auto; padding: 5px; margin-top: -7px; text-align: justify;">
    <p style="text-align: justify;">Ton texte ici</div>
    </div>
    </div>
    <p style="text-align: center;"><img style="border: 3px solid #242424;" src="URL_DE_L_IMAGE_180*205PX" alt=" " /></p>

     

     

    CODE HTML PERIPETIES:

    <p>&nbsp;</p>
    <table style="margin-left: auto; margin-right: auto;">
    <tbody>
    <tr>
    <td>
    <div style="background-color: #161417; width: 180px; min-height: 210px; line-height: 11px; margin-left: 0px; padding: 0px; text-align: justify; border-top-right-radius: 50px; border-top-left-radius: 50px; border-bottom-right-radius: 20px; border-bottom-left-radius: 20px;">
    <p><img style="border-top-right-radius: 50px; border-top-left-radius: 50px; display: block; margin: -10 auto -10 auto;" src="http://ekladata.com/t7TkWjosQyT539_mxnYsfNvQvNY@180x170.png" alt="statistiques" width="180" height="170" /></p>
    <div style="width: 155px; height: 195px; overflow: auto; padding: 5px; margin: 5px; text-align: justify;">
    <p style="text-align: justify;">Rien pour le moment, en attente d'inscription pour d&eacute;marrer les p&eacute;rip&eacute;ties.<br /><br /></p>
    </div>
    &nbsp;</div>
    <span style="font-family: arial,helvetica,sans-serif;">&nbsp;</span></td>
    </tr>
    </tbody>
    </table>
    <p style="text-align: left;">&nbsp;</p>
    <p style="text-align: center;">&nbsp;</p>
    <p style="text-align: center;"><img src="http://ekladata.com/7rNEkYmJ_f0fJX1SWAmNesBsxE0.png" alt="p&eacute;rip&eacute;ties" /></p>

     

     

    CODE HTML PREDEFINIS: (si vous n'en avez pas besoin, juste garder l'image de la "shoutbox")

    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <table style="margin-left: auto; margin-right: auto;">
    <tbody>
    <tr>
    <td>
    <div style="background-color: #161417; width: 180px; min-height: 210px; line-height: 11px; margin-left: 0px; padding: 0px; text-align: justify; border-top-right-radius: 50px; border-top-left-radius: 50px; border-bottom-right-radius: 20px; border-bottom-left-radius: 20px;">
    <p style="text-align: center;"><img style="border-top-right-radius: 50px; border-top-left-radius: 50px; margin: -10;" src="http://ekladata.com/_xZj7xNf6uqUJLX5mdAnz8YJ1V4@180x170.png" alt="statistiques" width="180" height="170" /></p>
    <p style="text-align: center;"><img src="http://ekladata.com/zKKpBQ8za4bIz4GAcBOP5EZA6SM.png" alt="Module" width="50" /> <img src="http://ekladata.com/zKKpBQ8za4bIz4GAcBOP5EZA6SM.png" alt="Module" width="50" /> <img src="http://ekladata.com/zKKpBQ8za4bIz4GAcBOP5EZA6SM.png" alt="Module" width="50" /></p>
    <p style="text-align: center;">&nbsp;</p>
    <p style="text-align: center;"><span style="font-size: 7pt;"><a href="http://fantasmagories.lo.gs/les-predefinis-c27152382">voir tous les pr&eacute;d&eacute;finis</a>&nbsp;&mdash; <a href="http://fantasmagories.lo.gs/proposez-vos-predefinis-forum89336">proposer un pr&eacute;d&eacute;fini</a></span><br />&nbsp;</p>
    </div>
    </td>
    </tr>
    </tbody>
    </table>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p style="text-align: center;"><img src="http://ekladata.com/8QEvKjKGKvKg50XpwxAm3jUsBGw.png" alt="navigation" /></p>

     

    CODE HTML STATISTIQUES:

    <p>&nbsp;</p>
    <table style="margin-left: auto; margin-right: auto;">
    <tbody>
    <tr>
    <td>
    <div style="background-color: #161417; width: 180px; min-height: 210px; line-height: 11px; margin-left: 0px; padding: 0px; text-align: justify; border-top-right-radius: 50px; border-top-left-radius: 50px; border-bottom-right-radius: 20px; border-bottom-left-radius: 20px;">
    <p style="text-align: center;"><img style="margin: -10px; border-top-right-radius: 50px; border-top-left-radius: 50px;" src="http://ekladata.com/t-RSTwR2LBKPq0P5O7qWdZ84Hio.png" alt="statistiques" /></p>
    <p style="text-align: left;"><span style="font-family: arial,helvetica,sans-serif;">&nbsp; <strong>0</strong>&nbsp;&nbsp; &mdash; &nbsp; <em>HUMAINS</em></span></p>
    <p><span style="font-family: arial,helvetica,sans-serif;">&nbsp; <strong>3 </strong>&nbsp; &mdash; &nbsp; <em>MAGUS</em></span></p>
    <p><span style="font-family: arial,helvetica,sans-serif;">&nbsp; <strong>0&nbsp;</strong>&nbsp; &mdash; &nbsp; <em>FAUCHEURS</em></span></p>
    <p style="text-align: center;"><span style="font-family: arial,helvetica,sans-serif;"><br />&nbsp; <br /></span></p>
    <p style="text-align: center;"><span style="font-family: arial,helvetica,sans-serif;">dont</span></p>
    <p><span style="font-family: arial,helvetica,sans-serif;">&nbsp;<br />&nbsp;<br /></span></p>
    <p><span style="font-family: arial,helvetica,sans-serif;">&nbsp; <strong>2</strong> &nbsp; &mdash; &nbsp; <em>REBELLES</em></span></p>
    <p><span style="font-family: arial,helvetica,sans-serif;">&nbsp; <strong>0</strong>&nbsp;&nbsp; &mdash; &nbsp;<em> PARTISANS</em></span></p>
    <p><span style="font-family: arial,helvetica,sans-serif;">&nbsp; <strong>0</strong>&nbsp;&nbsp; &mdash; &nbsp;<em> FUYARDS</em></span></p>
    <p><span style="font-family: arial,helvetica,sans-serif;">&nbsp; <strong>1 </strong>&nbsp; &mdash; &nbsp;<em> NEUTRES</em></span></p>
    <p><span style="font-family: arial,helvetica,sans-serif;">&nbsp;</span></p>
    <p style="text-align: left;"><span style="font-family: arial,helvetica,sans-serif;">&nbsp;&nbsp;&nbsp;&nbsp; Nous&nbsp;&nbsp;&nbsp;&nbsp; comptabilisons&nbsp;&nbsp; <span style="color: #161417;">''</span><strong>3</strong>&nbsp; </span><br /><span style="font-family: arial,helvetica,sans-serif;">&nbsp;&nbsp; &nbsp; personnages&nbsp; ainsi&nbsp; que&nbsp;&nbsp; <strong>0</strong> </span><br /><span style="font-family: arial,helvetica,sans-serif;">&nbsp;&nbsp;&nbsp;&nbsp; PNJ. &nbsp; Il&nbsp;&nbsp; <span style="color: #161417;">'</span>y&nbsp;&nbsp; a&nbsp; actuellement </span><br /><span style="font-family: arial,helvetica,sans-serif;">&nbsp;&nbsp;&nbsp;&nbsp; <strong>%1% &nbsp; </strong><span style="color: #161417;">'</span> <strong>&nbsp;</strong> petit(s)&nbsp; &nbsp; &nbsp; curieux&nbsp;&nbsp; <br />&nbsp;&nbsp;&nbsp;&nbsp; qui </span><span style="font-family: arial,helvetica,sans-serif;">parcourt le blog. </span><br />&nbsp;<br />&nbsp;</p>
    </div>
    </td>
    </tr>
    </tbody>
    </table>
    <p style="text-align: left;">&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p style="text-align: center;">&nbsp;</p>
    <p style="text-align: center;"><img src="http://ekladata.com/jhS1zYpJtOfX-kdH-r3o2tagr2A.png" alt="Module" /></p>

     

     

    CODE HTML LIEUX:

    <table>
    <tbody>
    <tr>
    <td>
    <div style="color: black; width: 250px; min-height: 150px; padding: 0px; border: 3px solid #391A15; text-align: left; background-image: url('URL_IMAGE_250*150PX');">&nbsp;</div>
    </td>
    <td>
    <table>
    <tbody>
    <tr>
    <td>
    <div style="color: black; width: 260px; min-height: 44px; padding: 2px; padding-top: 6px; margin: 0px; border: 0px solid #2C2E33; background-color: #391a15; text-align: right;"><span style="font-family: 'Boubbet'; font-size: 18pt; color: #ffffff;"><span style="color: #bfa8a8;"><em>TITRE DU LIEU &nbsp; </em></span><br /></span></div>
    </td>
    </tr>
    <tr>
    <td>
    <div style="width: 265px; min-height: 87px; padding: 0px; margin: 0px; border-top: 7px solid #2C2E33; background-color: #0d0d0d; text-align: right;">
    <div style="width: 255px; height: 87px; overflow: auto; text-align: justify; padding: 5px;">(<a href="http://fantasmagories.lo.gs/centre-ville-forum89314">www</a>) - Description du lieux</div>
    </div>
    </td>
    </tr>
    </tbody>
    </table>
    </td>
    </tr>
    </tbody>
    </table>
    <p>&nbsp;</p>

     


    12 comments
  • Thème #4 - You're space, right?

     

    Voici mon deuxième thème en full css! Vous n'avez qu'à copier/coller les codes dans les parties indiquées et c'est magique!

    Si jamais vous ne savez pas comment trouver le numéro de vos menus, dites le moi, je vous aiderait. Sivous ne souhaitez que l'un ou l'autre des menus de lien, vous pouvez supprimer le code qui ne vous sert pas. (j'ai mis des indications dans le css si jamais)

    Le blog test se trouve ici, si vous voulez voir l'intégralité du thème (les commentaires, les forums, le reste de la page...).

    Merci de me prévenir si vous l'utilisez. ♥

    (+) il faut que toutes les valeurs soit à zéro et décochées, sauf format du blog > page > automatique centré

    (+) L'image, le titre du blog et les liens doivent être dans le même menu.

    (+) Vous pouvez changer les couleurs si elles ne vous plaisent pas. Si vous avez besoin d'aide, n'hésitez pas! (je peux modifier une image pour vous, si vous voulez qu'elle s'accorde à peu près avec le thème)

    (+) Les "XXXXXXXX" module_menu_contenuXXXXXXXX sont à remplacer par le "numéro" de votre module. Voici un tuto qui pourrait vous aider ici! Et si jamais, je suis joignable pour toute question.

     

     CODE CSS:

    /*----------------BODY & FENÊTRE----------------*/
     
    #body {
        background:transparent url("http://ekladata.com/O7lG9Ob_KkVv9pTZZBaATKBB1Is/fond1.png")center top repeat-y;
        background-color: #C1C1C1;
        font-family: tahoma;
        font-size: 11px;
    }
     
    #body a {
        text-decoration: none;
        -webkit-transition: all 0.4s ease;
        -moz-transition: all 0.4s ease;
        -o-transition: all 0.4s ease;
    }
     
    body a:hover {
        -webkit-transition: all 0.4s ease;
        -moz-transition: all 0.4s ease;
        -o-transition: all 0.4s ease;
    }
     
    .module_contenu img {text-align: center;
                         margin 0px;
    }
     
     
    /*----------------FOND PAGE----------------*/
     
    #background {
        width: 860px;
    }
     
     
     
    /*----------------HEADER----------------*/
     
    #header{
        height: 15px;
    }
     
    /*----------------MENU----------------*/
     
     
    /****MENU 1*****/
     
    #menu1 {
        position: fixed;
        top: 37px;
        margin-left: 20px;
        width: 167px;
        text-align: center;
        color: #808080;
    }
     
    #menu1 a{
        color: #58853D;
    }
     
    #menu1 a:hover{
        color: #8EB4C9;
    }

     
    /*menu 1*/
     
    #module_menu_contenuXXXXXXXX p{
        background-color: #889D92;
        color: white;
        margin-top: 5px;
        text-transform: lowercase;
        letter-spacing: 1px;
    }

     
    #module_menu_contenuXXXXXXXX a{
        display: block;
        color: white;
        background-color: #6A91B0;
        width: 100%;
        padding: 10px 0px 10px 0px;
        margin: 5px 0px 2px 0px;
        font-size: 9px;
        text-transform: uppercase;
        font-family: tahoma;
        letter-spacing: 2px;
    }
     
    #module_menu_contenuXXXXXXXX a:hover{
        color: white;
        background-color: #E3836C;
    }

     
    /***DERNIERS VISISTEURS***/
     
    .module_menu_type_lastvisitors .module_menu_titre {
        font-size: 0px;
        height: 0px;
        margin-top: 20px;
    }
     
    .module_menu_type_lastvisitors img {max-width: 35px;
    border: 2px solid lightgrey; margin-bottom: 3px;
        border-radius: 80px; margin: 5px;
    }
     
    .module_menu_type_lastvisitors img:hover {opacity: 0.8;}
     
     
    /*----------------ARTICLES----------------*/
     
     
    .module_titre_contenu{
        height: 100%;
        background-color: #889D92;
        border: 4px solid white;
        outline: 1px solid #CECECE;
        color: white;
        text-align: center;
        padding: 10px;
        font-family: arial;
        font-size: 15px;
        letter-spacing: 2px;
        word-spacing: 2px;
        text-transform: lowercase;
        font-style: italic;
        margin-left: 104px;
        margin-right: 87px;

    }
     
    .module_titre_contenu a{
        color: white;
        font-style: italic;
    }
     
    .module_titre_contenu a:hover{
        opacity: 0.7;
    }
     
    .article_info {
        font-size: 0px;
        text-align: right;
        font-style: italic;
        color: #A1A1A1;
        margin-bottom: 10px;
    }
     
    .article-info a{
        font-weight: bold;
    }
     
    .module_contenu {
        color: #555555;
        text-align: justify;
        font-family: tahoma;
        font-size: 12px;
        padding: 15px;
        margin-bottom: 50px;
        margin-left: 94px;
        margin-right: 78px;
    }
     
    .module_contenu a {
        color: #E48069;
        font-weight: bold;
        
    }
     
    .module_contenu a:hover {
        color: #6A91B0;
    }
     
     
    /*----------------COMMENTAIRE----------------*/
     
    .comment_normal, .comment_admin {
        width: 100%;
    }
     
    div.commentheader{
        background-color: #6A91B0;
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;
        margin-bottom: 8px;
        margin-top: 28px;
        font-family: arial;
        padding: 5px;
        position: relative;
    }
     
    .block-reply li .commentheader{
        border-radius: 3px;
    }
     
    div.commentbody {
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;
        background-color: #DDDDDD;
        padding: 10px;
        color: #lighgrey;
        margin-top: -10px;
    }
     
    .block-reply {
        border-left: 3px solid #E48069;
    }
     
    .comment-reply a{
        color: #64796D;
        font-family: Arial;
        text-transform: uppercase;
        font-size: 8px;
        letter-spacing: 1px;
    }
     
    .comment-reply a:hover{
        color: grey;
    }
     
    .commentnumber {
        font-family: "playmaj";
        color: white;
        font-size: 20px;
        padding-left: 5px;
        opacity: 0.6;
    }
     
    .commentpseudo {
        font-family: "playit";
        color: #888888;
        font-size: 13px;
        letter-spacing: 1px;
        text-transform: lowercase;
    }
     
    .commentpseudo a {color: white; font-weight: none;}
     
    .commentpseudo a:hover {color: white; opacity: 0.5;}
     
    .commentavatar {
        margin-right: 10px;
        margin-top: -25px;
        position: relative;
        padding: 5px;
    }
     
    .commentavatar img {
        border: 3px solid #6A91B0;
        border-radius: 100px;
    }
     

    .block-reply li .commentavatar {
        margin-right: 5px;
        margin-top: -5px;
        position: relative;
        padding: 5px;}
     
    .commentdate {
        padding-top: 5px;
        font-size: 10px;
        color: white;
        opacity: 0.5;
    }
     
     
     
    /*----------------PIED DE PAGE----------------*/
     
    #footer {
        text-align: center;
        text-transform: uppercase;
        font-size: 9px;
        color: #E68D7F;
        height: 30px;
        width: 400px;
        margin-left: 325px;
    }
     
    #footer a {
        color: #6A91B0;
    }
     
    #footer a:hover {
        color: #889D92;
    }
     
    #footer:after {content: " Thème de Fabule";}
     
     
    /*----------------HELPBUBBLES----------------*/
     
    #help_bubble {
        background-color: #889D92;
        color: #F1F1F1;
        border: 2px solid #607368;
        border-radius: 10px;
        opacity: 0.8;
        font-weight: bold;
    }
     
     
    /*----------------BOUTONS----------------*/
     
    input[type=button],input[type=submit], button {
        margin: 5px;
        margin-left: 0px;
        min-width: 10px;
        min-height: 20px;
        background-color: #889D92;
        color: white;
        font-family: arial;
        border: 2px solid #60756A;
        text-transform: uppercase;
        font-size: 11px;
        letter-spacing: 2px;
        border-radius: 2px;
    }
     
    input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover, button:hover, .button:hover {
        background-color: #6A91B0;
        color: white;
        font-family: arial;
        border: 3px solid #39556C;
    }
     
     
    /*******FORUMS********/
     
    .post_table_msg {
        background-color: #E5E5E5;
        padding: 10px;
        border-top-right-radius: 5px;
        border-bottom-right-radius: 5px;
    }
     
    .post_table_head {color: #F7F7F7;
                      font-size: 0px;
    }
     
    .post_table_profile img{
        border: 2px solid #B1C6D6;
        border-radius: 50px;
        margin-left: 10px;
        margin-top: -10px;
        margin-bottom: 20px;
        padding: 0px;
    }
     
    .post_table_profile a{
        color: white;
        font-size: 13px;
        font-family: consolas;
        text-transform: uppercase;
        display: block;
        width: 76px;
        padding: 2px 0px 2px 0px;
        background-color: #B1C6D6;
        text-align: center;
        border-radius: 2px;
        margin-top: 20px;
        margin-left: 11px;
        text-align: center;
    }
     
    .post_table_profile a:hover{
        opacity: 0.7;
        color: white;
    }
     
    .post_table_profile {
        background-color: #6A91B0;
        border-top-left-radius: 3px;
        border-bottom-left-radius: 3px;

    }
     
     
    .forum-description {
        background-color: #F0F0F0;
        border: 1px solid lightgrey;
        margin-top: 20px;
        margin-bottom: 20px;
        padding: 10px;
        border-radius: 2px;
        color: #333333
    }
     
     

    /*********BALISES***********/
     
    .esp img{
        margin: 5px;
        max-width: 78px;
        border: 3px solid white;
        outline: 1px solid lightgrey;
    }
     
    .liens a{
        display: inline-block;
        width: 47%;
        padding: 2px;
        text-transform: uppercase;
        text-align: center;
        font-size: 10px;
        background-color: #E0E0E0;
        border: 1px solid lightgrey;
        margin: 2px;
        color: grey;
    }

     

    CODE HTML "LINKS":

    <div class="liens">
    tes liens ici
    </div>

     

    CODE HTML "BLOGROLL":

    <div class="esp">
    tes images ici
    </div>

     


    59 comments
  • Thème #3 - Warrior Cat

     

    Voici mon tout premier thème en full css! En gros, vous avez qu'à copier/coller le colde et BIM, le thème est installé! Je tiens à remercier Elinae pour m'avoir expliquer comment on faisait et donner les sélecteurs nécessaires.

    Si vous souhaitez installer ce thème, donnez moi juste le titre et le slogan (s'il en a un) de votre blog, comme ça je modifierait le header pour vous.

    Si jamais vous ne savez pas comment trouver le numéro de vos menus, dites le moi, je vous aiderait. Voici un tuto qui pourrait vous aider ici! Si vous ne souhaitez que l'un ou l'autre des menus de lien, vous pouvez supprimer le code qui ne vous sert pas. (j'ai mis des indications dans le css si jamais)

    Le blog test se trouve ici, si vous voulez voir l'intégralité du thème (les commentaires, les forums, le reste de la page...).

    Merci de me prévenir si vous l'utilisez. ♥

    (+) il faut que toutes les valeurs soit à zéro et décochées, sauf format du blog > page > automatique centré & format du blog > marges > la marge entre le menu1 et le contenu (vous choisissez votre valeur)

     

     CODE CSS:

    /*----------------ENTÊTE DECLARATIVE----------------*/
     
    @font-face {font-family: "Astloch";
     src: url('http://ekladata.com/sursaut-gamma.cd.st/perso/police/Astloch-Regular.ttf');}
     
    @font-face {font-family: "Six Caps";
     src: url('http://ekladata.com/sursaut-gamma.cd.st/perso/police/SixCaps.ttf');}
     
    @font-face {font-family: "Roboto";  
     src: url('http://ekladata.com/Z5B6_aSg_DAeSfa--kAjF4QNQTs/Roboto-BlackItalic.ttf');}
     
      
      
    /*----------------BODY & FENÊTRE----------------*/
     
    #body {
        background:transparent url("URL_DU_HEADER_MODIFIE")center top no-repeat;
        background-color: #DCDCDC;
    }
     
    #body a {
        text-decoration: none;
        -webkit-transition: all 0.7s ease;
        -moz-transition: all 0.7s ease;
        -o-transition: all 0.7s ease;
    }
     
    body a:hover {
        -webkit-transition: all 0.7s ease;
        -moz-transition: all 0.7s ease;
        -o-transition: all 0.7s ease;
    }
     
    .img {margin: 2px;}
     
     
    /*----------------FOND PAGE----------------*/
    #background {width: 900px;}
     
     
     
    /*----------------HEADER----------------*/
     
    #header {
        height: 550px;  
    }  
     
     
     
    /*----------------MENU----------------*/
     
    #menu1 {
        width: 200px;
        text-align: justify;
        font-family: arial;
    }
     
    #menu1 a {
        color: #AD968D;
    }
     
    #menu1 a:hover {
        color: #AA6F76;
    }
     
    #menu1 .module_menu_titre {height: 100%;
        font-family: "Six Caps";
        text-transform: uppercase;
        letter-spacing: 3px;
        font-size: 23pt;
        background: #2A323A;
        color: #CDD3DA;
        padding-left: 10px;
        border-bottom: 2px solid #424F5B;
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;}
     
    #menu1 .module_menu_contenu {
        background: #272727;
        color: #C0C0C0;
        padding: 10px;
        margin-bottom: 45px;
        text-align: justify;
        font-family: arial;
        font-size: 13px;
        border-bottom-left-radius: 3px;
        border-bottom-right-radius: 3px;
    }
     
    #module_menuNUMEROMENU1 a{   /*pour avoir les liens 1 seule colonne*/
        display: inline-block;
        width: 100%;
        min-height: 18px;
        margin-bottom: 3px;
        padding: 1px;
        text-align: center;
        background-color: #B9666F;
        color: #F1F1F1;
        text-transform: uppercase;
        font-family: "Roboto";
        font-size: 12px;
        opacity: 0.7;
    }
     
    #module_menuNUMEROMENU1 a:hover{
        background-color: #C39988;
        color: #422728;
        border-left: 23px solid #B9666F;
    }
     
    #module_menuNUMEROMENU2 a/*pour avoir les liens en deux colonnes*/
        display: inline-block;
        width: 47.7%;
        min-height: 18px;
        margin-bottom: 3px;
        padding: 1px;
        text-align: center;
        background-color: #B9666F;
        color: #F1F1F1;
        text-transform: uppercase;
        font-family: "Roboto";
        font-size: 12px;
        opacity: 0.7;
    }
     
    #module_menuNUMEROMENU2 a:hover{
        background-color: #C39988;
        color: #422728;
    }
     
     
    /*----------------DERNIERS VISITEURS----------------*/
     
    .module_menu_type_lastvisitors {}
     
    .module_menu_type_lastvisitors img {
        margin-bottom: 5px;
        margin-right: 1.5px;
        border-top-left-radius: 30px;
        border-top-right-radius: 5px;
        border-bottom-left-radius: 7px;
        border-bottom-right-radius: 15px;
        -webkit-transform: rotate(2deg);
        -moz-transform: rotate(2deg);
        -o-transform: rotate(2deg);
        transform: rotate(2deg)
    }
     
    .module_menu_type_lastvisitors img:hover{ }
     
     
     
    /*----------------ARTICLES----------------*/
     
     
    .module_titre_contenu{
        min-height: 50px;
        border-bottom: 5px double #424F5B;
        color: #713638;
        padding-left: 10px;
        padding-bottom: 10px;
        font-family: "Six Caps";
        font-size: 40px;
        letter-spacing: 3px;
        word-spacing: 3px;
        text-transform: uppercase;
    }
     
    .module_titre_contenu a{
        min-height: 50px;
        color: #713638;
        padding-left: 10px;
        padding-bottom: 10px;
        font-family: "Six Caps";
        font-size: 40px;
        letter-spacing: 3px;
        word-spacing: 3px;
        text-transform: uppercase;
    }
     
    .module_titre_contenu a:hover{
        color: #A46763;
    }
     
    .article_info {
        font-size: 10px;
        color: #DCDCDC;
        opacity: 0.5;
        text-align: right;
        padding-top: 10px;
        padding-right: 10px;
        padding-bottom: 30px;
    }
     
    .article_info a {
        color: #95776B;
        text-transform: uppercase;
    }
     
    .article_info a:hover {
        color: #B5B5B5;
    }
     
    .module_contenu {
        background-color: #272727;
        color: #F1F1F1;
        text-align: justify;
        font-family: arial;
        font-size: 13px;
        padding: 20px;
        border-bottom-right-radius:5px;
        border-bottom-left-radius: 5px;
        border-right: 3px solid #424F5B;
        border-bottom: 3px solid #424F5B;
        margin-bottom: 50px;
    }
     
    .module_contenu a {
        color: #D86356;
        
    }
     
    .module_contenu a:hover {
        color: #B17C83;
    }
     
    .module_bottom {}
     
     

    /*----------------PIED DE PAGE----------------*/
     
    #footer {
        text-align: center;
        text-transform: uppercase;
        font-size: 11px;
    }
     
    #footer a {
        color: #D86356;
    }
     
    #footer a:hover {
        color: #B17C83;
    }
     
    #footer:after {content: "-  Thème de Fabule";}
     
     
     
    /*----------------COMMENTAIRE----------------*/
     
    .comment_normal, .comment_admin {
        width: 98%;
    }
     
    div.commentheader{
        background-color: #2A323A;
        border-radius: 10px;
        padding: 5px;
        margin-bottom: 8px;
        margin-top: 10px;
        color: #566676;
    }
     
    .block-reply {width: 99%;
        border-left: 3px solid #424F5B;
    }
     
    .comment-reply a{
        color: #616161;
        font-family: "Roboto";
    }
     
    .comment-reply a:hover{
        color: #A1544E;
    }
     
    .commentnumber {
        font-family: "Roboto";
        font-size: 11px;
        padding-left: 5px;
    }
     
    .commentpseudo {
        font-family: "Roboto";
        color: #9E311D;
    }
     
    .commentpseudo a {color: #9E311D;}
     
    .commentpseudo a:hover {color: #A1544E;}
     
    .commentdate {}
     
    .commentavatar img {
        border: 2px solid #424F5B;
    }
     
    .commentavatar img:hover {}
     
     
     
    /*----------------BOUTONS----------------*/
     
    input[type=button],input[type=submit], button {
        margin: 9px;
        margin-left: 0px;
        min-width: 100px;
        min-height: 20px;
        background-color: #BE3A2C;
        color: #F1F1F1;
        font-family: "Roboto";
        border: 3px solid #881A10;
        text-transform: uppercase;
        font-size: 15px;
        letter-spacing: 2px;
    }
     
    input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover, button:hover, .button:hover {
        background-color: #881A10;
        color: #F1F1F1;
        font-family: "Roboto";
        border: 3px solid #BE3A2C;
    }
     
     
     
    /*----------------HELPBUBBLES----------------*/
     
    #help_bubble {
        background-color: #BE3A2C;
        color: #F1F1F1;
        border: 1px solid #881A10;
        opacity: 0.7;
        box-shadow: 0px 1px 1px black;
    }
     
     
     
    /*----------------FORUMS----------------*/
     
    .post_table_msg {
        background-color: #3A3A3A;
        padding: 10px;
        border-bottom: 1px solid #3A3A3A;
        border-top-right-radius: 6px;
        border-bottom-right-radius: 6px;
    }
     
    .post_table_head {
        color: #3A3A3A;
        font-size: 0px;
    }
     
    .post_table_profile img{
        border: 2px solid #272727;
         margin-left: 10px;
         margin-top: -7px;
         margin-bottom: 10px;
         padding: 0px;
    }
     
    .post_table_profile a{
        color: #3A2728;
        font-family: "Roboto";
        text-transform: uppercase;
        display: block;
        width: 79px;
        background-color: #95776B;
        margin-top: 15px;
        margin-left: 10px;
        text-align: center;
        border-radius: 30px;
        margin-top: 15px;
        margin-left: 10px;
        text-align: center;
        opacity: 0.7;
        -webkit-transform: rotate(-2deg);
        -moz-transform: rotate(-2deg);
        -o-transform: rotate(-2deg);
        transform: rotate(-2deg);
    }
     
    .post_table_profile a:hover{
        color: #B5B5B5;
    }
     
    .post_table_profile {
        background-image: url('http://ekladata.com/HCRc_M04atpy4qVct74FjK8oLlY/872859rTJbL.jpg');
        border-top-left-radius: 6px;
        border-bottom-left-radius: 6px;
        border-bottom: 1px; solid #272727;
        opacity: 0.7;
    }
     
     
    .forum-description {
        background-color: #494949;
        margin-top: 20px;
        margin-bottom: 20px;
        padding: 10px;
        border: 4px double #363636;
    }/*----------------ENTÊTE DECLARATIVE----------------*/
     
    @font-face {font-family: "Astloch"; /*astloch regular*/
     src: url('http://ekladata.com/sursaut-gamma.cd.st/perso/police/Astloch-Regular.ttf');}
     
    @font-face {font-family: "Six Caps"; /*six caps*/
     src: url('http://ekladata.com/sursaut-gamma.cd.st/perso/police/SixCaps.ttf');}
     
    @font-face {font-family: "Roboto"; /*roboto black italic*/
     src: url('http://ekladata.com/Z5B6_aSg_DAeSfa--kAjF4QNQTs/Roboto-BlackItalic.ttf');}
     
      
      
    /*----------------BODY & FENÊTRE----------------*/
     
    #body {
        background:transparent url("http://ekladata.com/xrxrmQ1scWvK_Ge_rdUYMtrPNBI/THEME-LB-WARRIOR-CAT-w-bord.png")center top no-repeat;
        background-color: #DCDCDC;
    }
     
    #body a {
        text-decoration: none;
        -webkit-transition: all 0.7s ease;
        -moz-transition: all 0.7s ease;
        -o-transition: all 0.7s ease;
    }
     
    body a:hover {
        -webkit-transition: all 0.7s ease;
        -moz-transition: all 0.7s ease;
        -o-transition: all 0.7s ease;
    }
     
    .img {margin: 2px;}
     
     
    /*----------------FOND PAGE----------------*/
    #background {width: 900px;}
     
     
     
    /*----------------HEADER----------------*/
     
    #header {
        height: 550px;  
    }  
     
     
     
    /*----------------MENU----------------*/
     
    #menu1 {
        width: 200px;
        text-align: justify;
        font-family: arial;
    }
     
    #menu1 a {
        color: #AD968D;
    }
     
    #menu1 a:hover {
        color: #AA6F76;
    }
     
    #menu1 .module_menu_titre {height: 100%;
        font-family: "Six Caps";
        text-transform: uppercase;
        letter-spacing: 3px;
        font-size: 23pt;
        background: #2A323A;
        color: #CDD3DA;
        padding-left: 10px;
        border-bottom: 2px solid #424F5B;
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;}
     
    #menu1 .module_menu_contenu {
        background: #272727;
        color: #C0C0C0;
        padding: 10px;
        margin-bottom: 45px;
        text-align: justify;
        font-family: arial;
        font-size: 13px;
        border-bottom-left-radius: 3px;
        border-bottom-right-radius: 3px;
    }
     
    #module_menu149371828 a{
        display: inline-block;
        width: 100%;
        min-height: 18px;
        margin-bottom: 3px;
        padding: 1px;
        text-align: center;
        background-color: #B9666F;
        color: #F1F1F1;
        text-transform: uppercase;
        font-family: "Roboto";
        font-size: 12px;
        opacity: 0.7;
    }
     
    #module_menu149371828 a:hover{
        background-color: #C39988;
        color: #422728;
        border-left: 23px solid #B9666F;
    }
     
    #module_menu149371832 a{
        display: inline-block;
        width: 47.7%;
        min-height: 18px;
        margin-bottom: 3px;
        padding: 1px;
        text-align: center;
        background-color: #B9666F;
        color: #F1F1F1;
        text-transform: uppercase;
        font-family: "Roboto";
        font-size: 12px;
        opacity: 0.7;
    }
     
    #module_menu149371832 a:hover{
        background-color: #C39988;
        color: #422728;
    }
     
     
    /*----------------DERNIERS VISITEURS----------------*/
     
    .module_menu_type_lastvisitors {}
     
    .module_menu_type_lastvisitors img {
        margin-bottom: 5px;
        margin-right: 1.5px;
        border-top-left-radius: 30px;
        border-top-right-radius: 5px;
        border-bottom-left-radius: 7px;
        border-bottom-right-radius: 15px;
        -webkit-transform: rotate(2deg);
        -moz-transform: rotate(2deg);
        -o-transform: rotate(2deg);
        transform: rotate(2deg)
    }
     
    .module_menu_type_lastvisitors img:hover{ }
     
     
     
    /*----------------ARTICLES----------------*/
     
     
    .module_titre_contenu{
        min-height: 50px;
        border-bottom: 5px double #424F5B;
        color: #713638;
        padding-left: 10px;
        padding-bottom: 10px;
        font-family: "Six Caps";
        font-size: 40px;
        letter-spacing: 3px;
        word-spacing: 3px;
        text-transform: uppercase;
    }
     
    .module_titre_contenu a{
        min-height: 50px;
        color: #713638;
        padding-left: 10px;
        padding-bottom: 10px;
        font-family: "Six Caps";
        font-size: 40px;
        letter-spacing: 3px;
        word-spacing: 3px;
        text-transform: uppercase;
    }
     
    .module_titre_contenu a:hover{
        color: #A46763;
    }
     
    .article_info {
        font-size: 10px;
        color: #DCDCDC;
        opacity: 0.5;
        text-align: right;
        padding-top: 10px;
        padding-right: 10px;
        padding-bottom: 30px;
    }
     
    .article_info a {
        color: #95776B;
        text-transform: uppercase;
    }
     
    .article_info a:hover {
        color: #B5B5B5;
    }
     
    .module_contenu {
        background-color: #272727;
        color: #F1F1F1;
        text-align: justify;
        font-family: arial;
        font-size: 13px;
        padding: 20px;
        border-bottom-right-radius:5px;
        border-bottom-left-radius: 5px;
        border-right: 3px solid #424F5B;
        border-bottom: 3px solid #424F5B;
        margin-bottom: 50px;
    }
     
    .module_contenu a {
        color: #D86356;
        
    }
     
    .module_contenu a:hover {
        color: #B17C83;
    }
     
    .module_bottom {}
     
     

    /*----------------PIED DE PAGE----------------*/
     
    #footer {
        text-align: center;
        text-transform: uppercase;
        font-size: 11px;
    }
     
    #footer a {
        color: #D86356;
    }
     
    #footer a:hover {
        color: #B17C83;
    }
     
    #footer:after {content: "-  Thème de Fabule";}
     
     
     
    /*----------------COMMENTAIRE----------------*/
     
    .comment_normal, .comment_admin {
        width: 98%;
    }
     
    div.commentheader{
        background-color: #2A323A;
        border-radius: 10px;
        padding: 5px;
        margin-bottom: 8px;
        margin-top: 10px;
        color: #566676;
    }
     
    .block-reply {width: 99%;
        border-left: 3px solid #424F5B;
    }
     
    .comment-reply a{
        color: #616161;
        font-family: "Roboto";
    }
     
    .comment-reply a:hover{
        color: #A1544E;
    }
     
    .commentnumber {
        font-family: "Roboto";
        font-size: 11px;
        padding-left: 5px;
    }
     
    .commentpseudo {
        font-family: "Roboto";
        color: #9E311D;
    }
     
    .commentpseudo a {color: #9E311D;}
     
    .commentpseudo a:hover {color: #A1544E;}
     
    .commentdate {}
     
    .commentavatar img {
        border: 2px solid #424F5B;
    }
     
    .commentavatar img:hover {}
     
     
     
    /*----------------BOUTONS----------------*/
     
    input[type=button],input[type=submit], button {
        margin: 9px;
        margin-left: 0px;
        min-width: 100px;
        min-height: 20px;
        background-color: #BE3A2C;
        color: #F1F1F1;
        font-family: "Roboto";
        border: 3px solid #881A10;
        text-transform: uppercase;
        font-size: 15px;
        letter-spacing: 2px;
    }
     
    input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover, button:hover, .button:hover {
        background-color: #881A10;
        color: #F1F1F1;
        font-family: "Roboto";
        border: 3px solid #BE3A2C;
    }
     
     
     
    /*----------------HELPBUBBLES----------------*/
     
    #help_bubble {
        background-color: #BE3A2C;
        color: #F1F1F1;
        border: 1px solid #881A10;
        opacity: 0.7;
        box-shadow: 0px 1px 1px black;
    }
     
     
     
    /*----------------FORUMS----------------*/
     
    .post_table_msg {
        background-color: #3A3A3A;
        padding: 10px;
        border-bottom: 1px solid #3A3A3A;
        border-top-right-radius: 6px;
        border-bottom-right-radius: 6px;
    }
     
    .post_table_head {
        color: #3A3A3A;
        font-size: 0px;
    }
     
    .post_table_profile img{
        border: 2px solid #272727;
         margin-left: 10px;
         margin-top: -7px;
         margin-bottom: 10px;
         padding: 0px;
    }
     
    .post_table_profile a{
        color: #3A2728;
        font-family: "Roboto";
        text-transform: uppercase;
        display: block;
        width: 79px;
        background-color: #95776B;
        margin-top: 15px;
        margin-left: 10px;
        text-align: center;
        border-radius: 30px;
        margin-top: 15px;
        margin-left: 10px;
        text-align: center;
        opacity: 0.7;
        -webkit-transform: rotate(-2deg);
        -moz-transform: rotate(-2deg);
        -o-transform: rotate(-2deg);
        transform: rotate(-2deg);
    }
     
    .post_table_profile a:hover{
        color: #B5B5B5;
    }
     
    .post_table_profile {
        background-image: url('http://ekladata.com/HCRc_M04atpy4qVct74FjK8oLlY/872859rTJbL.jpg');
        border-top-left-radius: 6px;
        border-bottom-left-radius: 6px;
        border-bottom: 1px; solid #272727;
        opacity: 0.7;
    }
     
     
    .forum-description {
        background-color: #494949;
        margin-top: 20px;
        margin-bottom: 20px;
        padding: 10px;
        border: 4px double #363636;
    }

     

    CODE HTML ACCUEIL

    <div style="background-color: #95776b; width: 565px; min-height: 10px; line-height: 15px; margin-left: 0px; border: 1px solid #664446; padding: 20px; text-align: justify;"><span style="font-family: 'Astloch'; font-size: 18pt; color: #3a2728; letter-spacing: 5px;">titre quelconque ;<span style="color: #664446;"> citation comme &ccedil;a, vite fait histoire de remplir le vide<br /></span></span></div>
    <table>
    <tbody>
    <tr>
    <td>
    <div style="margin-top: 10px;">
    <p style="text-align: center;"><img style="border: 2px solid #664446;" src="URL_IMAGE_250*250" alt="" /></p>
    </div>
    </td>
    <td>
    <div style="background-color: #494949; width: 305px; height: 210px; line-height: 11px; margin-left: 5px; border: 2px solid #664446; padding: 20px; overflow: auto; text-align: justify;"><span style="font-family: 'Six Caps'; font-size: 42pt; color: #95776b; letter-spacing: 3px;"><span style="font-size: 18pt;">CONTEXTE ;</span><br /></span><strong>&nbsp;<br />&laquo; petite citation&nbsp;&raquo; &mdash;</strong>écris ici ce que tu veux, contexte, mises à jour, bref, ce qui te sembles le plus utile!.</p>
    </div>
    </td>
    </tr>
    </tbody>
    </table>
    <div style="background-color: #95776b; width: 595px; min-height: 10px; line-height: 15px; margin-left: 0px; border: 1px solid #664446; padding: 5px; text-align: justify; opacity: 0.3;"><span style="font-font-size: 11px; color: #3a2728; letter-spacing: 5px;">code by Fabule ;<span style="color: #664446;"> www.fabule-ation.ek.la/<br /></span></span></div>

    55 comments
  • Thème #2 - Extrêmement près et incroyablement fort.

     

    Thème dans toute sa totalité ici. Les conditions et informations sur le blog où le thème est exposé. J'ai pas réussi à le faire en full CSS donc vous pouvez pas l'installer tout seul, alors si vous le voulez, il faudra me demander par MP de vous l'installer. Le titre du header peut être remplacé par le nom de votre blog, il suffit de demander. Le slogan peut être changé, donc les mots changeant également (à plus de 6 différents). Merci de ne pas retirer mon pseudo du pied de page. (Désolé pour la grosse faute du titre. Q_Q)

    Ah oui, explorez un peu car certaines rubriques sont codées. Pour les liens, survolez les blocs colorés. J'espère que ça vous, plaît, je me suis dépassée là.

    (bannière inspirée de cette page tumblr, donc l'idée de base n'est pas de moi)


    62 comments


    Follow this section's article RSS flux
    Follow this section's comments RSS flux