AccueilDernières imagesRechercherS'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.

-55%
Le deal à ne pas rater :
Friteuse sans huile – PHILIPS – Airfryer HD9200/90 Série 3000
49.99 € 109.99 €
Voir le deal

    Catégories ergonomiques

    Acedia
    Acedia
    FémininAge : 29Messages : 45

    Ven 7 Mar 2014 - 23:54

    Ma demande



    Bonsoir ! Après quelques semaines de recherches et de lamentations intensives, je me décide enfin à venir demander de l’aide ! :’) J’espère que mes plans seront lisibles !

    Schéma(s) et Eléments
    Schémas :
    Catégories ergonomiques 370216schema

    Tailles des éléments : 969px de largeur obligatoirement. La hauteur est libre, mais il faut prendre en compte la rotation de l’image du lieu qui fait 100*300px. Je dirais donc aproximativement 200 px de haut, mais plus ou moins ne dérange pas. La taille de l’image des nouveaux messages fait 110*110px !
    Effets voulus : Un petit changement de couleurs sur les sous-forums et titres de catégories/forums serait chouette, mais rien de trop extravagant. 


    Ressources
    Toutes les polices voulues sont du Sylfaen, en italique pour les titres et le nombre de messages/sujets. Simple pour les descriptions, les sous-forums et les nouveaux messages !

    Autres précisions ?
    Il serait bien de prendre en compte le débordement de l’image des lieux, c’est un effet que j’aimerais rendre… Si c’est impossible, tant pis ! Il faudrait également prévoir de mettre une image de fond derrière le tout.

    Si vous vous posez la question, l'image du lieu à été inclinée à 9° lors du montage (on sait jamais, ça peut servir !)


    Merci de votre attention et de votre patience à lire ma demande ! J'espère n'avoir rien oublié et avoir mis tout ce qu'il faut. :) A très bientôt je l'espère !
    Acedia
    Acedia
    FémininAge : 29Messages : 45

    Dim 9 Mar 2014 - 20:23

    Un petit Up pour prévenir que la demande est toujours d'actualité et n'attend que les beaux yeux d'un codeur qui passerais par là ! Very Happy Merci d'avance à vous ! Wink
    Anonymous
    Invité

    Lun 10 Mar 2014 - 13:09

    Hey,

    Je prends, j'édite quand c'est bon Wink
    Acedia
    Acedia
    FémininAge : 29Messages : 45

    Lun 10 Mar 2014 - 16:25

    Waw ! Very Happy Merci beaucoup de te pencher sur mon cas ! :)
    Anonymous
    Invité

    Mar 11 Mar 2014 - 13:26

    Acedia
    Acedia
    FémininAge : 29Messages : 45

    Mar 11 Mar 2014 - 19:00

    C'est réellement extra chouette ! *^* Merci beaucoup ! Very Happy
    Anonymous
    Invité

    Mar 11 Mar 2014 - 19:42

    Voici donc les codes (LS dispo' ici) :

    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 --><!-- BEGIN tablehead -->

    <div style="background-image: url('http://i58.servimg.com/u/f58/17/97/89/15/light_10.png'); padding: 10px;"><div class="cate_titre" style="vertical-align: middle;">{catrow.tablehead.L_FORUM}</div>



       <!-- END tablehead -->
       <!-- BEGIN cathead -->
      
      <!-- END cathead -->
       <!-- BEGIN forumrow -->
     
     
       <div class="categorie">
    <table><tr>
      <td><img style="position: relative; left: 2em; top: -1.3em;" title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
      </td>
      <td><div class="titrefofo"><center><a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a></center></div>
        <div class="rien">{catrow.forumrow.FORUM_DESC}</div></td>
      <td><span class="stats"><nobr>{catrow.forumrow.TOPICS} sujets ; {catrow.forumrow.POSTS} messages</nobr></span></td>
    </tr>
    </table>
         <div class="lienssf">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</div>
         <div class="last_mess"><span class="gensmall" id="last">{catrow.forumrow.LAST_POST}</span></div>
    <script type="text/javascript">
    jQuery('#last').html(jQuery('#last').html().replace(/<br>/g,'<span style="display: inline-block; padding: 0 2px;">-</span>')).removeAttr('id');
      </script>
      </div>

       <!-- END forumrow -->
       <!-- BEGIN catfoot -->
      
      <!-- END catfoot -->
       <!-- BEGIN tablefoot -->
     
    </div>  
     
    <!-- END tablefoot --><!-- END catrow -->
    <link href='http://fonts.googleapis.com/css?family=Ceviche+One' rel='stylesheet' type='text/css'>



    CSS
    Code:
    /* --------------------------------- CATEGORIES --------------------------------- */




    /*** FONDS GENERAUX ***/

    /* Contenu de l'ensembre des forum */
    .categorie {
      width: 950px;
      height: 190px;
      padding: 10px;
      background: #969595;
    }

    /* Fond des forum */
    .sous-forum {
      width: 300px;
      height: 50px;
      overflow: auto;
      top: -10em;
    }

    /* Fond titre catégorie */
    .cate_titre {
      width: 969px;
      margin: auto;
      background-color: #767676;
      border: 1px solid #8F8F8F;
      box-shadow: 2px 2px 15px black;
     -moz-box-shadow: 2px 2px 15px black;
      -webkit-box-shadow: 2px 2px 15px black;
    }

    /* Mise en forme nom de catégorie */
    h2 {
      font-size: 15px;
      font-family: Sylfaen;
      font-style: italic !important;
      color: #000000;
      text-align: center;
    }




    /*** MISE EN FORME DES FORUM ***/

    /* Mise en forme du texte des titres de forum */
    .forumlink {
      color: #000000 !important;
      font-family: Sylvaen;
     font-style: italic !important;
      font-size: 17px !important;
      font-weight: none !important;
      text-align: center;
    }

    .forumlink:hover {
      color: #521B36 !important;
      text-decoration: none !important;
    }

    .forumlink a {
      font-size: 16px;
      width: 500px;
    }

    /* Mise  en forme du fond des titres de forum */
    .titrefofo {
      width: 400px;
      max-height: 100px;
      position: relative;
      margin-top: 10px;
      left: 6em;
      font-size: 11px;
      text-align: justify;
      color: #2E2E2E;
      background-color: #C2C2C2;
      padding: 15px;
    }

    /* Mise en forme de la description */
    .description {
      width: 400px;
      position: relative;
      left: 5.7em;
      top: -1.5em;
      font-size: 11px;
      text-align: justify;
      color: #2E2E2E;
      background-color: #C2C2C2;
      padding: 15px;
    }

    .imagedesc {
      position: relative;
      right: -6em;
      top: -2em;
     -moz-transform:rotate(8deg);
      -webkit-transform:rotate(8deg);
      transform:rotate(8deg);
    }




    /*** SOUS-FORUM ***/

    .lienssf {
      width: 552px;
      max-height: 20px;
      overflow: auto;
      background-color: #767676;
      border: 1px solid #8F8F8F;
      padding: 10px;
      position: relative;
      top: -2em;
      left: -0.8em;
    }

    .lienssf a {
      color: #000000 !important;
      text-decoration: none !important;
    }

    .lienssf a:hover {
      color: #CAC9C7 !important;
     text-decoration : none !important;
    }




    /*** DERNIERS MESSAGES ***/

    .last_mess
    {
      width: 380px;
      height: 20px;
      overflow: auto;
      background-color: #767676;
      position: relative;
      top: -4.65em;
      right: -35em;
      padding: 10px;
      border: 1px solid #8F8F8F;
    }

    .last_mess a {
      color: black !important;
      text-decoration: none !important;
    }

    .last_mess a:hover {
      color: #CAC9C7 !important;
     text-decoration : none !important;
    }




    /*** NOMBRE DE MESSAGES ET SUJETS ***/
    .stats {
      display: block;
      position: relative;
      top: -7.5em;
      left: -6em;
      font-family: arial;
      font-size: 11px;
      font-weight: bold;
      color: #000000;
      padding-bottom: 4px;
      margin-bottom: 4px;
    }

      

    /*--------------------------------- FIN CATEGORIES --------------------------------- */



    A mettre dans la description de tes forum
    Code:
    <table>
     
    <tbody>
     <tr>
     
    <td>
     
    <div class="description" style="width: 400px; height: 50px; overflow: auto; padding: 15px;">
     Ex his quidam aeternitati se commendari posse per statuas aestimantes eas ardenter adfectant quasi plus praemii de figmentis aereis sensu carentibus adepturi, quam ex conscientia honeste recteque factorum, easque auro curant inbracteari, quod Acilio Glabrioni delatum est primo, cum consiliis armisque regem superasset Antiochum. quam autem sit pulchrum exigua haec spernentem et minima ad ascensus verae gloriae tendere longos et arduos, ut memorat vates Ascraeus, Censorius Cato monstravit. qui interrogatus quam ob rem inter multos... statuam non haberet malo inquit ambigere bonos quam ob rem id non meruerim, quam quod est gravius cur inpetraverim mussitare. Inter quos Paulus eminebat notarius ortus in Hispania, glabro quidam sub vultu latens, odorandi vias periculorum occultas perquam sagax. is in Brittanniam missus ut militares quosdam perduceret ausos conspirasse Magnentio, cum reniti non possent, iussa licentius supergressus fluminis modo fortunis conplurium sese repentinus infudit et ferebatur per strages multiplices ac ruinas, vinculis membra ingenuorum adfligens et quosdam obterens manicis, crimina scilicet multa consarcinando a veritate longe discreta. unde admissum est facinus impium, quod Constanti tempus nota inusserat sempiterna. Quod cum ita sit, paucae domus studiorum seriis cultibus antea celebratae nunc ludibriis ignaviae torpentis exundant, vocali sonu, perflabili tinnitu fidium resultantes. denique pro philosopho cantor et in locum oratoris doctor artium ludicrarum accitur et bybliothecis sepulcrorum ritu in perpetuum clausis organa fabricantur hydraulica, et lyrae ad speciem carpentorum ingentes tibiaeque et histrionici gestus instrumenta non levia.
    </div>
     
    </td>
     
    <td>
     <img src="http://i58.servimg.com/u/f58/17/97/89/15/4512.png" class="imagedesc" />
    </td>
     
    </tr>
     
    </tbody>
    </table>

    Dis-moi si tout va bien Wink
    Acedia
    Acedia
    FémininAge : 29Messages : 45

    Mar 11 Mar 2014 - 20:24

    Le tout m'as l'air réellement satisfaisant une fois mis en place *o*

    Je ne vois pas de bug visible, seulement que si la description du forum n'est pas assez longue, l'image du lieu viens en dessous des derniers messages, mais ça ne gène pas la visibilité, donc c'est pas gênant :)

    J'aurais quelques modifications personnelles à faire pour que tout soit en accord avec mon forum, mais ce n'est qu'une question de couleurs. :)
    Anonymous
    Invité

    Mar 11 Mar 2014 - 20:27

    Ah mince ... faudrait que je regarde ça =/
    Contenu sponsorisé


      La date/heure actuelle est Ven 22 Nov 2024 - 22:19