userInfoPane - меняем дизайн

Тема в разделе "IP. Board 3.4", создана пользователем razzer, 8 мар 2013.

  1. razzer

    razzer

    Регистрация:
    26 дек 2012
    Сообщения:
    57
    Симпатии:
    17
    [​IMG]

    1. Файл ipb_styles.css

    Код:
    .author_info {
    background:#f6f6f6;
    border:1px solid #d6d6d6;
    border-top:none;
    border-left:none;
    border-radius:0 0 6px 0;
    -moz-border-radius:0 0 6px 0;
    -webkit-border-radius:0 0 6px 0;
    float:left;
    font-size:12px;
    padding:15px 10px;
    text-align:center;
    width:155px;
    }
    .author_info ul.post_author_info{
    margin:10px 0;
    padding-top:1px;
    text-align:left;
    }
    .author_info ul.post_author_info li{
    background: #f9fcf7; /* Old browsers */
    background: -moz-linear-gradient(top,  #f9fcf7 0%, #f5f9f0 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f9fcf7), color-stop(100%,#f5f9f0)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #f9fcf7 0%,#f5f9f0 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #f9fcf7 0%,#f5f9f0 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #f9fcf7 0%,#f5f9f0 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #f9fcf7 0%,#f5f9f0 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9fcf7', endColorstr='#f5f9f0',GradientType=0 ); /* IE6-9 */
    border:1px solid #fff;
    border-radius:4px;
    box-shadow:0 1px 3px rgba(0,0,0,0.1);
    -moz-box-shadow:0 1px 3px rgba(0,0,0,0.1);
    -webkit-box-shadow:0 1px 3px rgba(0,0,0,0.1);
    font:13px Calibri,Arial,Tahoma,sans-serif;
    margin:5px 0;
    padding:5px 10px;
    }
    .cap{text-transform:capitalize}
     
    .author_info .group_title {
      font-weight: bold;
      color: #5a5a5a;
      margin-top: 5px;
    }
    .author_info .reputation_stars{text-align:center}
    .author_info .member_title {margin-bottom:5px}
    .author_info .group_icon {text-align:center}
    2. Шаблон userInfoPane.html

    Код:
    <ips:template parameters="$author, $contentid, $options" />
    <div class='user_details'>
    <ul class='basic_info'>
      <if test="membertitle:|:$author['member_title']">
      <p class='desc member_title'>{$author['member_title']}</p>
      </if>
      <if test="avatar:|:$author['member_id']">
      <li class='avatar'>
    	<a href="{parse url="showuser={$author['member_id']}" template="showuser" seotitle="{$author['members_seo_name']}" base="public"}" title="{$this->lang->words['view_profile']}" class='ipsUserPhotoLink'>
    	<if test="hasVariable:|:$this->settings['member_topic_avatar_max']">
    	<img src='{$author['pp_main_photo']}' class='ipsUserPhoto ipsUserPhoto_variable' />
    	<else />
    	<img src='{$author['pp_thumb_photo']}' class='ipsUserPhoto ipsUserPhoto_large' />
    	</if>
    	</a>
      </li>
      <else />
      <li class='avatar'>
    	<img src='{$author['pp_thumb_photo']}' class='ipsUserPhoto ipsUserPhoto_large' />
      </li>
      </if>
    </ul>
     
    <ul class='post_author_info'>
      <!-- Add a <li> line here, to change style, like for post count & reputation. -->
      <if test="rankimage:|:$author['member_rank_img']">
      <li class='group_icon'>
      <if test="rankimageimage:|:$author['member_rank_img_i'] == 'img'">
    	<img src='{$author['member_rank_img']}' alt='' />
      <else />
    	{$author['member_rank_img']}
      </if>
      </li>
      </if>
      <if test="postCount:|:$author['member_id']">
      <li class='post_count'>
    	<span class='cap'>{$this->lang->words['m_posts']}</span>: <strong>{parse exp<b></b>ression="$this->registry->getClass('class_localization')->formatNumber( intval( $author['posts'] ) )"}</strong>
      </li>
      </if>
      <if test="authorcfields:|:$author['custom_fields'] != """>
    	<foreach loop="customFieldsOuter:$author['custom_fields'] as $group => $data">
    	<foreach loop="customFields:$author['custom_fields'][ $group ] as $field">
    	  <if test="$field != ''">
    	  <li>
    		{$field}
    	  </li>
    	  </if>
    	</foreach>
    	</foreach>
      </if>
      <if test="cardRep:|:$this->settings['reputation_enabled'] && $this->settings['reputation_show_profile']">
      <li>
    	{$this->lang->words['top_rep']}:
    	<if test="cardRepPos:|:$author['pp_reputation_points'] > 0">
    	<span style='color:green;font-weight:bold'>{$author['pp_reputation_points']}</span>
    	</if>
    	<if test="cardRepNeg:|:$author['pp_reputation_points'] < 0">
    	<span style='color:red;font-weight:bold'>{$author['pp_reputation_points']}</span>
    	</if>
    	<if test="cardRepZero:|:$author['pp_reputation_points'] == 0">
    	<span style='color:gray;font-weight:bold'>{$author['pp_reputation_points']}</span>
    	</if>
      </li>
      </if>
    </ul>
    <if test="authorwarn:|:$author['warn_percent'] !== NULL">
      <br>
      <ul>
      <li>
    	<div class='warn_panel clear rounded ipsType_small'>
    	  <strong><a href='{parse url="app=core&amp;module=modcp&amp;section=editmember&amp;do=view&amp;mid={$author['member_id']}&amp;_tab=warn" base="public"}' id='warn_link_{$contentid}_{$author['member_id']}' title='{$this->lang->words['warn_view_history']}' class='warn_link'>{$this->lang->words['warn_status']}</a></strong>
    	<if test="highwarn:|:$author['warn_percent'] >= 80">
    	  <p class='progress_bar user_warn limit' title="{$this->lang->words['warn_level']} {$author['warn_percent']}%">
    	<else />
    	  <p class='progress_bar user_warn' title="{$this->lang->words['warn_level']} {$author['warn_percent']}%">
    	</if>
    	  <span style="width: {$author['warn_percent']}%"><span>{$this->lang->words['warn_level']} {$author['warn_percent']}%</span></span>
    	</p>
    	</div>
      </li>
      </ul>
    </if>
    </div>