Колонка под аватаром для доп. полей

Posted 1 апреля, 201510 yr

Помогите пожалуйста сделать колонку под аватаром в теме:

У меня сейчас вот так:

А нужно сделать вот так:

1 апреля, 201510 yr

Смотрите какие это элементы ( .custom_fields > li ) и оформляете с помощью css.

Например так: просто дописать вниз ipb_styles.css

/* new custom_fields */
.custom_fields > li {
  display: block;
  margin: 3px 22px;
  padding: 3px;
  border: 1px solid #ddd;
  border-radius: 4px;
}

А если хотите выровнять все элементы в userInfoPane

то примерно вот так: просто дописать вниз ipb_styles.css
/* new custom_fields */
.custom_fields { margin-top: 0 !important; }
.basic_info > li.post_count { color: #505050; }
.tBorder_1 { width: 156px !important; }
.custom_fields > li, .basic_info > li.post_count {
  display: block;
  margin: 3px 22px;
  padding: 3px;
  border: 1px solid #ddd;
  border-radius: 4px;
}
Принцип понятен - юзайте CSS

Цитата

RoyalDream
1

1 апреля, 201510 yr

Author

Смотрите какие это элементы ( .custom_fields > li ) и оформляете с помощью css.

Например так: просто дописать вниз ipb_styles.css
/* new custom_fields */
.custom_fields > li {
  display: block;
  margin: 3px 22px;
  padding: 3px;
  border: 1px solid #ddd;
  border-radius: 4px;
}
А если хотите выровнять все элементы в userInfoPane
Буфер обмена-1.jpg

то примерно вот так: просто дописать вниз ipb_styles.css
/* new custom_fields */
.custom_fields { margin-top: 0 !important; }
.basic_info > li.post_count { color: #505050; }
.tBorder_1 { width: 156px !important; }
.custom_fields > li, .basic_info > li.post_count {
  display: block;
  margin: 3px 22px;
  padding: 3px;
  border: 1px solid #ddd;
  border-radius: 4px;
}
Принцип понятен - юзайте CSS

Благодарю! Маленький вопрос: как опустить эту часть чуть ниже?

Еще странно, что у администратора берется репутация в эту колонку, а у пользователей и остальных групп - нет. Можно чтобы именно репутация не бралась в эту колонку у всех?

Edited 1 апреля, 201510 yr by RoyalDream

Цитата

1 апреля, 201510 yr

Благодарю! Маленький вопрос: как опустить эту часть чуть ниже?

Там же в строку

.basic_info > li.post_count { color: #505050; }

дописать margin-top - это и будет отступ сверху

.basic_info > li.post_count { color: #505050; margin-top: 15px !important; }

Еще странно, что у администратора берется репутация в эту колонку, а у пользователей и остальных групп - нет. Можно чтобы именно репутация не бралась в эту колонку у всех?

А вот с этим надо разобраться. Покажите код UserInfoPane, ибо у Вас для каждого пользователя свой класс что-ли ( .tBorder_номер ) ?

Хотя вру, не надо, можно сделать так

вместо

.tBorder_1 { width: 156px !important; }

надо

.basic_info > div { width: 156px !important; }

в итоге буде так:

/* new custom_fields */
.custom_fields { margin-top: 0 !important; }
.basic_info > li.post_count { color: #505050; margin-top: 15px !important; }
.basic_info > div { width: 156px !important; }
.custom_fields > li, .basic_info > li.post_count {
  display: block;
  margin: 3px 22px;
  padding: 3px;
  border: 1px solid #ddd;
  border-radius: 4px;
}

поправил

Цитата

1 апреля, 201510 yr

Author

Нет, классы я не менял никому. На счет вот этого: - это картинки обычные.

<div itemscope itemtype="__schema.org/Person" class='user_details'>

<span class='hide' itemprop="name">{$author['members_display_name']}</span>

<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'>

<if test="canSeeProfiles:|:$this->memberData['g_is_supmod'] OR ( $this->memberData['g_mem_info'] && ! IPSMember::isInactive( $author ) )">

<a itemprop="url" href="{parse url="showuser={$author['member_id']}" template="showuser" seotitle="{$author['members_seo_name']}" base="public"}" title="{$this->lang->words['view_profile']}: {$author['members_display_name']}" class='ipsUserPhotoLink'>

</if>

<if test="hasVariable:|:$this->settings['member_topic_avatar_max']">

<img itemprop="image" src='{$author['pp_main_photo']}' class='ipsUserPhoto ipsUserPhoto_variable' />

<else />

<img itemprop="image" src='{$author['pp_thumb_photo']}' class='ipsUserPhoto ipsUserPhoto_large' />

</if>

<if test="canSeeProfiles2:|:$this->memberData['g_is_supmod'] OR ( $this->memberData['g_mem_info'] && ! IPSMember::isInactive( $author ) )">

</a>

</if>

</li>

<else />

<li class='avatar'>

<img itemprop="image" src='{$author['pp_thumb_photo']}' class='ipsUserPhoto ipsUserPhoto_large' />

</li>

</if>

<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 desc lighter'>

{$this->lang->words['m_posts']}: {parse expression="$this->registry->getClass('class_localization')->formatNumber( intval( $author['posts'] ) )"}

</li>

</if>

<if test="authorwarn:|:$author['show_warn']">

<li>

<if test="hasWarningId:|:$options['wl_id']">

<img src='{$this->settings['img_url']}/warn.png' class='clickable' onclick='warningPopup( this, {$options['wl_id']} )' title='{$this->lang->words['warnings_issued']}' />

</if>

<a class='desc lighter blend_links' href='{parse url="app=members&module=profile&section=warnings&member={$author['member_id']}&from_app={$this->request['app']}&from_id1={$contentid}&from_id2={$options['id2']}" base="public"}' id='warn_link_{$contentid}_{$author['member_id']}' title='{$this->lang->words['warn_view_history']}'>{parse expression="sprintf( $this->lang->words['warn_status'], $author['warn_level'] )"}</a>

</li>

</if>

</ul>

<if test="authorcfields:|:$author['custom_fields'] != """>

<ul class='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>

</ul>

</if>

</div>

Цитата

1 апреля, 201510 yr

Нет, классы я не менял никому. На счет в

Да не, речь про то, что где-то (скорее всего в хуке полоски репутации) автоматом назначается класс вида .tBorder_номер, где номер- разный для разных пользователей. Соответственно на страницу генерится и вставляется такой код (тоже разный):

<style type='text/css'>
.tCard{
  float:right;
  width:28%;
  vertical-align:middle;
  background: none !important;
  font-weight:bold;
  padding-top:2px;
  color:white;
  text-shadow:rgba(0, 0, 0, 0.4) 1px 1px 1px;
}
.tBorder_16{
  width:120px; 
  margin:0 auto; 
  background-color:#ccc; 
  height:20px;
  border-radius:3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  padding:1px;
  position: relative;
}

.tText_16{
  position: absolute;
  z-index: 10;
  text-align:center;
  top:2px;
  left:1px;
  margin:0 auto; 
  width:85px; font-weight:bold;
  color:#ccc;
  text-shadow:rgba(0, 0, 0, 0.4) 1px 1px 1px;
}
.progress-container_16 {
  width: 70%; 
  height: 18px;
  padding: 1px;
  background: white;
  float:left;
}
.progress-container_16 > div {
  background-color: white;
  background-image: url(__forum.l2fire.ru/public/style_images/master/repbar/status1.png);
  background-repeat: no-repeat;
  height: 18px;
  border-top-left-radius:3px;
  border-bottom-left-radius:3px;
  -moz-border-radius: 3px 0 0 3px;
  -webkit-border-radius: 3px 0 0 3px;
}
</style>

Собственно решение написал выше.

Цитата

1 апреля, 201510 yr

Author

Спасибо, колонка растянулась - стало лучше намного! Но все равно оно у админа почему-то обводит (еле заметно конечно, это не суть, можно и так).

Цитата

Sign In

Колонка под аватаром для доп. полей

Featured Replies

Join the conversation

Последние посетители 0

Account

Navigation

Search

Configure browser push notifications

Chrome (Android)

Chrome (Desktop)

Safari (iOS 16.4+)

Safari (macOS)

Edge (Android)

Edge (Desktop)

Firefox (Android)

Firefox (Desktop)