Открыть:
viewtopicviewers_body.html
Найти:
Код: Выделить всё
<dd class="resultbar">
Код: Выделить всё
<dd class="resultbar">
<style scoped>
@-webkit-keyframes move{stats.PCT} {
0% { width: 0;}
100% { width: {stats.PERCENT}; }
}
@keyframes move{stats.PCT} {
0% { width: 0; }
100% { width: {stats.PERCENT}; }
}
div.poll_animation{stats.PCT} {
-webkit-animation: move 3s linear 0s normal none infinite, move{stats.PCT} 6s linear 0s normal none 1;
animation: move 3s linear 0s normal none infinite, move{stats.PCT} 6s linear 0s normal none 1;
}
</style>
Код: Выделить всё
<div class="<!-- IF stats.PCT < 20 -->pollbar1<!-- ELSEIF stats.PCT < 40 -->pollbar2<!-- ELSEIF stats.PCT < 60 -->pollbar3<!-- ELSEIF stats.PCT < 80 -->pollbar4<!-- ELSE -->pollbar5<!-- ENDIF -->" style="width:{stats.PERCENT};">{stats.RESULT}</div></dd>
Код: Выделить всё
<div class="meter"><div class="poll_animation{stats.PCT} <!-- IF stats.PCT < 20 -->pollbar1<!-- ELSEIF stats.PCT < 40 -->pollbar2<!-- ELSEIF stats.PCT < 60 -->pollbar3<!-- ELSEIF stats.PCT < 80 -->pollbar4<!-- ELSE -->pollbar5<!-- ENDIF -->" style="width:{stats.PERCENT}; max-width:{stats.PERCENT};">{stats.RESULT} </div></div></dd>
Заодно, по просьбам, выкладываю код всего своего файла
viewtopicviewers_body.html
....Внимание!!! Некоторые его элементы стилизованы уже под CSS3+HTML5
Код: Выделить всё
<!-- INCLUDE overall_header.html -->
<div class="m-stat">
<h5 style="text-align: center; font: bold 25px Arial,sans-serif; color: #000066; text-shadow: 2px 2px 8px #3652ad;"><img src="{T_THEME_PATH}/images/yeux_viewtopic.gif" alt="" /> • {L_TV_VIEW_TOPIC_VIEWERS} • <img src="{T_THEME_PATH}/images/yeux_viewtopic.gif" alt="" /></h5>
</div>
<br />
<h5 style="text-align: center; font: bold 18px Arial; color: #000066; text-shadow: 2px 2px 8px #3652ad;;"><img src="{T_THEME_PATH}/images/yeux_viewtopic.gif" alt="" /> • {TOTAL_TOPIC_VIEWERS} • <img src="{T_THEME_PATH}/images/yeux_viewtopic.gif" alt="" /></h5>
<br />
<div class="forumbg">
<div class="inner"><span class="corners-top"><span></span></span>
<table class="table1" style="border-spacing: 1px;" >
<!-- IF .user_row -->
<thead>
<tr>
<th class="name">{L_USERNAME}</th>
<th class="active">{L_TV_LAST_VIEW_DATES}</th>
<th class="active">{L_TV_NB_VIEW_DATES}</th>
<th class="active">{L_TV_POSTER}</th>
</tr>
</thead>
<tbody>
<!-- BEGIN user_row -->
<tr class="<!-- IF user_row.S_ROW_COUNT is odd -->bg1<!-- ELSE -->bg2<!-- ENDIF -->">
<td>{user_row.USERNAME_FULL}</td>
<td>{user_row.DATES}</td>
<td>{user_row.NB}</td>
<td>{user_row.POSTER}</td>
</tr>
<!-- END user_row -->
<!-- ELSE -->
<tbody>
<tr class="bg1">
<td colspan="3">{L_TV_NO_TOPIC_VIEWERS}</td>
</tr>
<!-- ENDIF -->
</tbody>
</table>
<span class="corners-bottom"><span></span></span></div>
</div>
<div class="panel">
<div class="inner">
<div class="content">
<h5 style="text-align: center; font: bold 18px Arial; color: #000066; text-shadow: 2px 2px 8px #3652ad;"><img src="{T_THEME_PATH}/images/yeux_viewtopic.gif" alt="" /> • {L_TV_TOPIC_VIEW_STATS} • <img src="{T_THEME_PATH}/images/yeux_viewtopic.gif" alt="" /></h5>
<fieldset class="polls poll_stat">
<!-- BEGIN stats -->
<dl class="voted" title="{L_TV_DESCRIPTION}">
<dt>{stats.MONTH}</dt>
<dd class="resultbar">
<style scoped>
@-webkit-keyframes move{stats.PCT} {
0% { width: 0;}
100% { width: {stats.PERCENT}; }
}
@keyframes move{stats.PCT} {
0% { width: 0; }
100% { width: {stats.PERCENT}; }
}
div.poll_animation{stats.PCT} {
-webkit-animation: move 3s linear 0s normal none infinite, move{stats.PCT} 6s linear 0s normal none 1;
animation: move 3s linear 0s normal none infinite, move{stats.PCT} 6s linear 0s normal none 1;
}
</style>
<div class="meter"><div class="poll_animation{stats.PCT} <!-- IF stats.PCT < 20 -->pollbar1<!-- ELSEIF stats.PCT < 40 -->pollbar2<!-- ELSEIF stats.PCT < 60 -->pollbar3<!-- ELSEIF stats.PCT < 80 -->pollbar4<!-- ELSE -->pollbar5<!-- ENDIF -->" style="width:{stats.PERCENT}; max-width:{stats.PERCENT};">{stats.RESULT} </div></div></dd>
<dd><!-- IF stats.RESULT == 0 -->{L_TV_NO_VOTES}<!-- ELSE -->{stats.PERCENT}<!-- ENDIF --></dd>
</dl>
<!-- END stats -->
</fieldset>
</div>
</div>
</div>
<div class="m-stat">
<h5 style="text-align: center; font: bold 15px Arial,sans-serif; color: #000066; text-shadow: 2px 2px 8px #3652ad;"> • <img src="{T_THEME_PATH}/images/yeux_viewtopic.gif" alt="" /> • {U_BACK_POST} • <img src="{T_THEME_PATH}/images/yeux_viewtopic.gif" alt="" /> • {U_SUPP} • <img src="{T_THEME_PATH}/images/yeux_viewtopic.gif" alt="" /> • {U_BACK_POST} • <img src="{T_THEME_PATH}/images/yeux_viewtopic.gif" alt="" /> • </h5>
</div>
<br />
<!-- INCLUDE overall_footer.html -->
m-stat
самопальный... использую его на форумах повсеместно, очень помогает выводить красивые названия страниц...В файл
content.css
добавить:
Код: Выделить всё
.post .m-stat {
margin: 8px 0 1px 8px;
}
.m-stat {
background: #E7E7F7;
margin-top: 1.2em;
padding: 4px 4px 5px;
position: relative;
border: 1px solid #000066;
border-radius: 5px;
box-shadow: 4px 4px 10px #9E9EAF;
}
.m-stat-pm {
background: #E7E7F7;
padding: 4px 4px 5px;
position: relative;
border: 1px solid #000066;
border-radius: 5px;
}
.m-stat p {
margin: 0;
padding-left: 30px;
}
.m-stat span {
font-weight: bold;
}
.m-stat hr {
border-top: 3px dotted #000066;
}
common.css
новый класс шрифта h5
Код: Выделить всё
h5 {
/* Forum header titles */
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-weight: normal;
color: #3f3f3f;
font-size: 2em;
}