Welcome

Halloween Catégories

Pokemon

Halloween, LS codage Forumactif Templates & Eléments Catégories Catégories Pokemon

PHPBB2

Non optimisé Affichage des stats au survol de l'icône et effets sur les blocs de droite

Retour

Codage catégories Pokemon Halloween Forumactif

CSS

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

a {
  text-decoration: none;
  color: #434937 !important;
}

a:hover {
  text-decoration: none;
}

.SF {
  width: 150px;
  height: 50px;
  overflow: auto;
  background-color: #6B70B4;
  color: #111546;
  padding: 15px;
  font-size: 12px;
  border: 2px solid #2F3368;
  -webkit-border-radius: 25px 0px 25px 0px;
  khtml-border-radius: 25px 0px 25px 0px;
  -moz-border-radius: 25px 0px 25px 0px;
  border-radius: 25px 0px 25px 0px;
  -moz-transform: rotate(3deg);
  -webkit-transform: rotate(3deg);
  transform: rotate(3deg);
}

.derniers {
  width: 150px;
  background-color: #111546;
  height: 50px;
  color: #7F83B4;
  padding: 15px;
  font-size: 12px;
  border: 2px solid #2F3368;
  -webkit-border-radius: 25px 0px 25px 0px;
  khtml-border-radius: 25px 0px 25px 0px;
  -moz-border-radius: 25px 0px 25px 0px;
  border-radius: 25px 0px 25px 0px;
  -moz-transition-duration: 0.5s;
  -moz-transition-timing-function: linear;
  -webkit-transition-duration: 0.5s;
  -webkit-transition-timing-function: linear;
  transition-duration: 0.5s;
  transition-timing-function: linear;
}

.derniers:hover {
  -moz-transform: rotate(5deg);
  -webkit-transform: rotate(5deg);
  transform: rotate(5deg);
}

.cate {
  width: 100px;
  height: 100px;
  margin-top: -65px;
  margin-left: 70px;
  overflow: hidden;
  position: absolute;
  background-color: #D8D9E9;
  -webkit-border-radius: 50px;
 khtml-border-radius: 50px;
 -moz-border-radius: 50px;
 border-radius: 50px;
}

.cate_img {
  position: relative;
  z-index: 2;
  width: 400px;
  height: 120px;
  margin-left: 0px;
  transform: all;
  -moz-transform: all;
  -o-transform: all;
  -htm-transform: all;
  -webkit-transform: all;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
}
    
.cate:hover .cate_img {
  margin-left: 400px;
  transform: all;
  -moz-transform: all;
  -o-transform: all;
  -htm-transform: all;
  -webkit-transform: all;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
}
    
.cate_description {
  position: relative;
  z-index: 1;
  width: 100px;
  height: 100px;
  margin-top: -115px;
  text-align: center;
  font-size: 11px;
  color: #111546;
  padding: 2px;
  overflow: auto;
  -webkit-border-radius: 50px;
 khtml-border-radius: 50px;
 -moz-border-radius: 50px;
 border-radius: 50px;
    }

a.forumlink:link {
  font-size: 30px;
  margin-left: 200px;
  color: #7F83B4 !important;
  font-family: 'The Girl Next Door', cursive;
}

a.forumlink:hover {
  font-size: 30px;
  margin-left: 250px;
  color: #7F83B4 !important;
  font-family: 'The Girl Next Door', cursive;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
}

.secondarytitle h2 {
  display: inline;
  color: #111546;
  font-family: 'Coming Soon', cursive;
  font-size: 36px;
  text-transform: none !important;
}

.description {
  background-color: #7F83B4;
  width: 500px;
  height: 100px;
  overflow: auto;
  color: #3D4061;
  text-align: justify;
  padding: 15px;
  font-size: 12px;
  border: 2px solid #ffffff;
  -webkit-border-radius: 25px 25px 25px 25px;
  khtml-border-radius: 25px 25px 25px 25px;
  -moz-border-radius: 25px 25px 25px 25px;
  border-radius: 25px 25px 25px 25px;
  margin-top: -10px;
}

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

Index_box

<table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
 <tr>
 <td valign="bottom">
 
 <span class="gensmall">{LAST_VISIT_DATE}<br />
 {CURRENT_TIME}<br />
 </span>
 
 <div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div>
 </td>
 <td class="gensmall" align="right" valign="bottom">
 
 <a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a><br />
 <a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a><br />
 
 <a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a>
 </td>
 </tr>
</table>
<center><table class="forumline" width="800" border="0" cellspacing="1" cellpadding="0" style="background-color: #2E314F; color: #7F83B4; -webkit-border-radius: 25px; khtml-border-radius: 25px; -moz-border-radius: 25px; border-radius: 25px;">
 <tr style="background-image: url('http://i58.servimg.com/u/f58/18/40/69/79/light_10.png'); height: 213px; -webkit-border-radius: 25px 25px 0px 0px; khtml-border-radius: 25px 25px 0px 0px; -moz-border-radius: 25px 25px 0px 0px; border-radius: 25px 25px 0px 0px;  border: 1px solid #394367;">
          <th colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%" class="secondarytitle"><br /><br /><br /><br /><br /> {catrow.tablehead.L_FORUM} </th>
 </tr>
 
 
 <tr>
 
 <td class="{catrow.cathead.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
 
 <td class="{catrow.cathead.CLASS_CAT}" colspan="{catrow.cathead.INC_SPAN}" width="100%">
 <h{catrow.cathead.LEVEL} class="hierarchy">
 <span class="cattitle">
 <a class="cattitle" title="{catrow.cathead.CAT_DESC}" href="{catrow.cathead.U_VIEWCAT}">{catrow.cathead.CAT_TITLE}</a>
 </span>
 </h{catrow.cathead.LEVEL}>
 </td>
 <td class="{catrow.cathead.CLASS_ROWPIC}" colspan="3" align="right"> </td>
 </tr>
 
 
 <tr width="100%">
 
 <td class="{catrow.forumrow.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" alt="." /></td>
          
 
<td colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%" height="50"><br /><br />
 <h{catrow.forumrow.LEVEL} class="hierarchy">
 <span class="forumlink">
 <a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a><br />
 </span>
 </h{catrow.forumrow.LEVEL}>
          <div class="cate"><div class="cate_img"><img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" style="-webkit-border-radius: 50px; khtml-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px;" /></div><div class="cate_description"><span class="gensmall"><img src="http://fc05.deviantart.net/fs70/f/2012/050/1/b/pikachu_run__by_ai_ki_san-d4qby4i.gif" /><br />{catrow.forumrow.TOPICS} Sujets <br />
                         {catrow.forumrow.POSTS} Messages</span></div></div>
                    <center><div class="description"><br /><br />{catrow.forumrow.FORUM_DESC}</div></center><br /></td>
 
<td align="center" valign="middle" style="width: 200px;"><br /><br />
                  <span class="gensmall"><div class="SF">{catrow.forumrow.L_LINKS}<br />{catrow.forumrow.LINKS}</div>
                          <br />
                    <div class="derniers">{catrow.forumrow.LAST_POST}</div><br /></span>
                  </td>
          </tr>
 
 
 <tr><br /><br />
 
 <td class="{catrow.catfoot.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
 
 <td class="spaceRow" colspan="{catrow.catfoot.INC_SPAN}" height="1"><img src="{SPACER}" alt="" height="1" width="1" /></td>
 </tr>
 
 
</table><br /><br /></center><img src="{SPACER}" alt="" height="5" width="1" />

Dernière modification : 25 April 2020 23 : 33.

#pokemon #categories #forumactif #codage #libreservice

Halloween