[SMF 2.1 RC3] Smf Yatay Profil Alanı

Merhaba, tekrar hoş geldiniz!

Bilgi sahibi olanlarla ihtiyaç duyanları buluşturmak, farklı bakış açılarına sahip insanları bir araya getirerek birbirlerini daha iyi anlamalarını sağlamak ve herkesin bilgisini paylaşmasını sağlamak istiyoruz.

orhan

Moderator
Katılım
5 Ara 2018
Mesajlar
466
Tepkime puanı
89
Puanları
28
Bugün smf 2.1 RC3  pospit alanını nasıl dikeyden yataya çeviririz onu anlatmaya çalışacağım katkıda bulunmak isteyen konu altında yaza bilir 2.0 için Smf Yatay Profil Alanı

yataypospit.png


Display.template.php

Bul
Kod:
<div class="post_wrapper">';

Değiştir

Kod:
	<div class="post_wrapper message-inner">
					<div class="keyinfo head">';

	// Some people don't want subject... The div is still required or quick edit breaks.
	echo '
								<div id="subject_', $message['id'], '" class="subject_title', (empty($modSettings['subject_toggle']) ? ' subject_hidden' : ''), '">
									', $message['link'], '
								</div>';

	echo '
								<h5>
									<span class="messageicon" ', ($message['icon_url'] === $settings['images_url'] . '/post/xx.png' && !$message['can_modify']) ? ' style="position: absolute; z-index: -1;"' : '', '>
										<img src="', $message['icon_url'] . '" alt=""', $message['can_modify'] ? ' id="msg_icon_' . $message['id'] . '"' : '', '>
									</span>
									<a href="', $message['href'], '" rel="nofollow" title="', !empty($message['counter']) ? sprintf($txt['reply_number'], $message['counter'], ' - ') : '', $message['subject'], '" class="smalltext">', $message['time'], '</a>
									<div class="page_number floatright">';

	// Show "<< Last Edit: Time by Person >>" if this post was edited. But we need the div even if it wasn't modified!
	// Because we insert into it through AJAX and we don't want to stop themers moving it around if they so wish so they can put it where they want it.
	echo '
									<span class="smalltext modified floatright', !empty($modSettings['show_modify']) && !empty($message['modified']['name']) ? ' mvisible' : '', '" id="modified_', $message['id'], '">
									<strong>', !empty($message['counter']) ? ' #' . $message['counter'] : '', ' ', '</strong>';

	if (!empty($modSettings['show_modify']) && !empty($message['modified']['name']))
		echo
										$message['modified']['last_edit_text'];

	echo '
									</span>
									</div>
								</h5>
								<div id="msg_', $message['id'], '_quick_mod"', $ignoring ? ' style="display:none;"' : '', '></div>
							</div><!-- .keyinfo -->';
Bul
Kod:
<div class="poster">';

Değiş
Kod:
<div class="poster message-cell message-cell--user">';

Bul
Kod:
<h4>';

Değiş
Kod:
	<ul class="post__panel-avatar user_info">';

	// Show the user's avatar.
	if (!empty($modSettings['show_user_images']) && empty($options['show_no_avatars']) && !empty($message['member']['avatar']['image']))
		echo '
								<li class="avatar">
									<a href="', $message['member']['href'], '" class="avatar avatar--m">', $message['member']['avatar']['image'], '</a>
									<span class="' . ($message['member']['online']['is_online'] == 1 ? 'on' : 'off') . '" title="' . $message['member']['online']['text'] . '"></span>
								</li>
								</ul>
								<ul class="ts-display--flex ts-flex-direction--column">
								<h4>';

Bul
Kod:
</h4>
							<ul class="user_info">';

	// Show the user's avatar.
	if (!empty($modSettings['show_user_images']) && empty($options['show_no_avatars']) && !empty($message['member']['avatar']['image']))
		echo '
								<li class="avatar">
									<a href="', $message['member']['href'], '">', $message['member']['avatar']['image'], '</a>
								</li>';

Degisin
Kod:
</h4>';

Bul
Kod:
<li class="postgroup">', $message['member']['post_group'], '</li>';

Degis
Kod:
	<li class="postgroup">', $message['member']['post_group'], '</li></ul>
								<ul class="post-author-details">';
Bul
Kod:
<li class="profile">

Degis
Kod:
<li class="post-author-details__item  profile">

Bul
Kod:
<li class="poster_ip">', $txt['logged'], '</li>';

Degis
Kod:
<li class="post-author-details__item poster_ip">', $txt['logged'], '</li>';

Bul
Kod:
<div class="postarea">
							<div class="keyinfo">';

	// Some people don't want subject... The div is still required or quick edit breaks.
	echo '
								<div id="subject_', $message['id'], '" class="subject_title', (empty($modSettings['subject_toggle']) ? ' subject_hidden' : ''), '">
									', $message['link'], '
								</div>';

	echo '
								<h5>
									<span class="messageicon" ', ($message['icon_url'] === $settings['images_url'] . '/post/xx.png' && !$message['can_modify']) ? ' style="position: absolute; z-index: -1;"' : '', '>
										<img src="', $message['icon_url'] . '" alt=""', $message['can_modify'] ? ' id="msg_icon_' . $message['id'] . '"' : '', '>
									</span>
									<a href="', $message['href'], '" rel="nofollow" title="', !empty($message['counter']) ? sprintf($txt['reply_number'], $message['counter'], ' - ') : '', $message['subject'], '" class="smalltext">', $message['time'], '</a>
									<span class="page_number floatright">
										', !empty($message['counter']) ? ' #' . $message['counter'] : '', ' ', '
									</span>';

	// Show "<< Last Edit: Time by Person >>" if this post was edited. But we need the div even if it wasn't modified!
	// Because we insert into it through AJAX and we don't want to stop themers moving it around if they so wish so they can put it where they want it.
	echo '
									<span class="smalltext modified floatright', !empty($modSettings['show_modify']) && !empty($message['modified']['name']) ? ' mvisible' : '', '" id="modified_', $message['id'], '">';

	if (!empty($modSettings['show_modify']) && !empty($message['modified']['name']))
		echo
										$message['modified']['last_edit_text'];

	echo '
									</span>
								</h5>
								<div id="msg_', $message['id'], '_quick_mod"', $ignoring ? ' style="display:none;"' : '', '></div>
							</div><!-- .keyinfo -->';

Degis
Kod:
<div class="postarea message-cell message-cell--main">';

Bul Sil
Kod:
</div><!-- .postarea -->

Bul
Kod:
</div><!-- .moderatorbar -->

Degis
Kod:
</div><!-- .moderatorbar -->
						</div><!-- .postarea -->

index.css
bul
Kod:
.keyinfo h5 {
    padding: 1px 0 5px 0;
    line-height: 1.5em;
    font-size: 0.9em;
}

Degis
Kod:
.keyinfo h5 {
    font-size: 0.9em;
    background: #494c62;
    height: 40px;
    line-height: 30px;
    color: #fff;
    overflow: hidden;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    padding-left: 1rem;
}
Bul Sil

Kod:
.poster {
 float: left;
 /* Don't set this in em.It will eat too much space if people need to set large text sizes. */
 width: 160px;
 -webkit-hyphens: auto;
 -ms-hyphens: auto;
 hyphens: auto;
 word-wrap: break-word; /* IE fallback */
 overflow-wrap: break-word;
}

Bulup Silin
Kod:
.postarea, .moderatorbar {
 margin: 0 0 0 175px;
}

en alta ekleyin
Kod:
/* yatay porofil*/
#forumposts .head {
    height: 35px;
    line-height: 35px;
    font-size: 12px;
}
.message-cell.message-cell--user, .message-cell.message-cell--action {
	 position: relative;
	 background: #f5f5f5;
	 border-right: 1px solid #d8d8d8;
	 min-width: 0;
	 display: -webkit-box;
	 display: -ms-flexbox;
	 display: flex;
	 -webkit-box-align: center;
	 -ms-flex-align: center;
	 align-items: center;
	 padding: 1rem;
	 border-bottom: 1px solid #e0e0e0;
}
.post__panel-avatar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    margin-right: 1rem;
}
.poster .avatar {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border-radius: 100%;
    vertical-align: top;
    overflow: hidden;
}
.poster img.avatar {
    max-width: 100%;
    max-height: 100%;
    width: 80px;
    height: 80px;
    padding: 3px;
    border: 1px solid #bbb;
    background: none repeat scroll 0 0 #f8f9fa;
    border: 3px solid #e0e0e0;
}
.ts-flex-direction--column {
    -webkit-box-orient: vertical!important;
    -webkit-box-direction: normal!important;
    -ms-flex-direction: column!important;
    flex-direction: column!important;
}
.post-author {
    display: inline-block;
    margin-bottom: 0;
    font-size: 1rem;
}
.post-author-details {
    margin: -.875rem 0 -.875rem auto;
    font-size: .875rem;
}
.post-author-details__item:not(:last-child) {
    border-bottom: 1px dotted #9e9e9e;
}
.post-author-details__item {
    padding: .25rem 0;
}
.message-cell.message-cell--main {
    padding-left: 15px;
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    background: #fdfdfd;
    padding: 1rem;
    font-size: .875em;
    background-color: #fff;
}
#forumposts .windowbg {
    padding: 0px 0px;
    border-radius: 0;
}

ikinci dersimizde PersonalMessage.template.php yi editlemeyi yapalım.
 
Geri
Üst Alt