QEEL Gris/Rose

Voici un LS de QEEL aux couleurs Gris/Rose.
Elle vous est proposée suite à la demande de Madii-x. Vous avez également la PA ainsi que les catégories qui vont avec ce qeel.

---

Aperçus : www - phpbb2

L'installation

Dans Affichage > Templates > Index_body ...

Code:

<!-- BEGIN disable_viewonline -->
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
  <tr>
      <td class="catHead" colspan="2" height="28">
      <!-- BEGIN switch_viewonline_link -->
      <span class="cattitle"><a class="cattitle" href="{U_VIEWONLINE}" rel="nofollow">{L_WHO_IS_ONLINE}</a></span>
      <!-- END switch_viewonline_link -->

      <!-- BEGIN switch_viewonline_nolink -->
      <span class="cattitle">{L_WHO_IS_ONLINE}</span>
      <!-- END switch_viewonline_nolink -->
      </td>
  </tr>
  <tr>
      <td class="row1" rowspan="6" align="center" valign="middle"><img src="{L_ONLINE_IMG}" id="i_whosonline" alt="{L_WHO_IS_ONLINE}" /></td>
      <td class="row1" width="100%"><span class="gensmall">{TOTAL_POSTS}<br />
      {TOTAL_USERS}<br />
      {NEWEST_USER}</span></td>
  </tr>
  <tr>
      <td class="row1"><span class="gensmall">{TOTAL_USERS_ONLINE}<br />
      {RECORD_USERS}<br />
      <br />
      {LOGGED_IN_USER_LIST}</span></td>
  </tr>
  {L_CONNECTED_MEMBERS}
  {L_WHOSBIRTHDAY_TODAY}
  {L_WHOSBIRTHDAY_WEEK}
  <tr>
      <td class="row1"><span class="gensmall">{LEGEND} : {GROUP_LEGEND}</span></td>
  </tr>
  <!-- BEGIN switch_chatbox_activate -->
  <tr>
      <td class="row1">
        <span class="gensmall">{TOTAL_CHATTERS_ONLINE} :  {CHATTERS_LIST}<br />
            <!-- BEGIN switch_chatbox_popup -->
            <div id="chatbox_popup"></div>
            <script type="text/javascript">
            //<![CDATA[
            insertChatBoxPopup('{disable_viewonline.switch_chatbox_activate.switch_chatbox_popup.U_FRAME_CHATBOX}', '{L_CLICK_TO_JOIN_CHAT}');
            //]]>
            </script>
            <!-- END switch_chatbox_popup -->
        </span>
      </td>
  </tr>
  <!-- END switch_chatbox_activate -->
</table>
<!-- END disable_viewonline -->

Code:

<div id="qeel">
      <h1>Qui se promène ?</h1>
      <table width="800px" cellspacing="15px" cellpadding="10px" id="contenu-general">
        <tr>
          <td rowspan="2" class="withbg">
            <h2>Statistiques</h2>
            <p><span class="gensmall">{TOTAL_POSTS}<br /><br />
              {TOTAL_USERS}<br /><br />
              {NEWEST_USER}</span></p>
            </td>
          <td class="withbg">
            <h2>Les membres en ligne</h2>
                      <p><table>{L_CONNECTED_MEMBERS}</table>
                          <span class="gensmall">{TOTAL_USERS_ONLINE}<br />
              {RECORD_USERS}<br />
              {LOGGED_IN_USER_LIST}</span></p>
          </td>
        </tr>
        <tr>
          <td class="withbg">
            <h2>Anniversaires</h2>
            <table class="annifs">
               
              {L_WHOSBIRTHDAY_TODAY}
              {L_WHOSBIRTHDAY_WEEK}
            </table>
          </td>
        </tr>
        <tr>
          <td colspan="2" class="withbg groups">
            <!-- <h2>Groupes</h2> -->
            <p><span class="gensmall"><!-- {LEGEND} :&nbsp; -->{GROUP_LEGEND}</span></p>
          </td>
        </tr>
      </table>

  <div id="credits">QEEL by <a href="http://www.never-utopia.com">Never-Utopia</a></div>
  </div>

Affichage > Couleurs > Feuille de Style ...

Code:

/* CODES POUR LE QEEL */

#qeel h1, #qeel h2, #qeel h3, #qeel p {
        margin: 0; padding: 0; font-weight: normal;
      }

      #qeel {
        width: 800px;
        min-height: 200px;
        border-radius: 10px;
        background: #fff;
        margin: 75px auto 20px;
        position: relative;
        padding-top: 50px;
        font-family: "abeatbykai", sans-serif;
        font-size: 12px;
        letter-spacing: 1px;
        color: gray;
      }

      #qeel a {
        color: darkgray;
        text-decoration: none;
      }

      #qeel a, #qeel h2 {
        -webkit-transition: all .2s ease;
        -moz-transition: all .2s ease;
        -ms-transition: all .2s ease;
        -o-transition: all .2s ease;
        transition: all .2s ease;
      }

      #qeel a:hover {
        color: #d74e77;
      }
     
      #qeel h1 {
        width: 328px;
        height: 83px;
        background: url("http://i39.servimg.com/u/f39/19/07/10/81/qeel-m10.jpg") no-repeat;
        position: absolute;
        top: -58px;
        left: 50%;
        margin-left: -164px;
        text-indent: -9999px;
      }

      #qeel td {
        vertical-align: top;
      }

      #qeel td p .gensmall, #qeel td.row1 .gensmall, #qeel .gensmall {
        font-family: "century gothic", sans-serif;
        color: #F54DA0;
        font-size: 10px;
      }

      #qeel table td {
        border-radius: 10px;
        position: relative;
        padding-top: 25px;
        min-height: 50px;
      }

      #qeel table td.withbg {
        background: #e4e1e2;
      }

      #qeel h2 {
        /*height: 34px;*/
        position: absolute;
        top: -12px;
        z-index: 3;
        font-size: 24px;
        font-family: 'Covered By Your Grace', cursive;
        color: #808080;
      }

      #qeel h2:hover {
        color: rgba(209,42,97,1);
      }

      #qeel td.row1, td.row3.over:hover {
        background-color: transparent !important;
      }

      #qeel table.annifs {
        margin-top: -30px !important;
      }

      table.annifs tbody tr:nth-child(2) td {
        padding-top: 0px !important;
      }

      .groups {padding: 10px !important; text-align: center; }

/* CREDITS */

      #credits {
        position: absolute;
        padding: 0px 10px;
        bottom: -20px;
        right: 0px;
        height: 20px;
        line-height: 20px;
        font-size: 8px;
        color: gray;
        text-transform: uppercase;
        text-shadow: 1px 1px 0px #ffffff;
      }

Une question ? Un souci avec le code ?

bubulle a écrit:merci

Prismatic a écrit:Merci du partage ^^ !