[Шаблон] Создание темы

Подписчики

17 октября 201213 г

Добрый вечер.

Возникла проблема, а точнее нашел небольшой, но неприятный баг в шаблоне и надеюсь на вашу помощь в его скором устранении.

Как видно на скриншоте поле ввода названия темы находится ниже описания. Как можно его поставить на законное место и дело в шаблоне или в css?

CSS:

.ipsForm_horizontal .ipsField_title {
float: left;
width: 185px;
padding-right: 15px;
text-align: right;
line-height: 1.8;
}

Шаблон:

<li class='ipsField ipsField_primary'>
					<label for='topic_title' class='ipsField_title'>{$this->lang
>words['topic_title']}</label>
					<p class='ipsField_content'>
						<input id='topic_title' class='input_text' type="text" size="60" maxlength="{$this->settings['topic_title_max_len']}" name="TopicTitle" value="{$formData['topicTitle']}" tabindex="0" />
					</p>
				</li>

п.с. IPB 3.3.4; Это немного исправленная форма, до этого шел текст: название темы, огромное пустое пространство, и только потом поле ввода. Исправил я это, задав высоту блоку 50px:

.ipsForm_vertical .ipsField_content { margin-top: 3px; height:50px;}

Изменено 17 октября 201213 г пользователем reddd

18 октября 201213 г

Тема перенесена в соответствующий форум.

А что автор стиля говорит по поводу кривой верстки?

18 октября 201213 г

Автор

С автором не связывался, думал, что возможно без них поправить баг.

Если есть какие либо предположения буду рад выслушать. Надеюсь на вашу помощь)

п.с. а пока что ушел изучать их польский форум =)

19 октября 201213 г

Автор

Нет никаких предположений по решению данной проблемы?

Самое интересное то, что иерархия всех правильна, но почему же блок с полем ввода съехал вниз?

19 октября 201213 г

У меня было похожее, только панелька функций съехала в бок :D только у меня проблема оказалась в браузере, через другой было всё ок. Баг был на опере, через хром и мозилу просматривалось норм. Я не знаю может просто скин не адаптирован под браузер через который вы юзаете форум :) Если всё же смена браузера не поможет, значит проблема в скине, но это у не ко мне :D

тем более сами пишите

Самое интересное то, что иерархия всех правильна, но почему же блок с полем ввода съехал вниз?

19 октября 201213 г

Адреса форума в профиле и в теме нет, названия скина нигде нет, версий форума и скина - тоже нет, на скриншотах проблема видна, но на скриншотах кода её причин тоже нет. Что вы предлагаете нам задействовать, телепатию или телекинез?

20 октября 201213 г

Автор

Версия форума 3.3.4, как указано в 1-ом посте. Название скина - Diablo 3 Vanguard 1.7.0. Ссылки на форум нету, так как правлю его на локальном сервере.

20 октября 201213 г

В чейнджлоге файла есть новая версия - 2.1.0:

Fixed profile reputations
Fixed popup user status
Fixed profile tabs
Fixed advanced search
Fixed textarea
Fixed advanced filter member list
Fixed search

По-видимому, ваши проблемы все решены? Купите, скачайте новую версию, да пользуйтесь.

По платному специфичному скину, да еще и через скриншоты с локали - вам точно никто тут не поможет.

20 октября 201213 г

Автор

Версия скина последняя, но баг все равно присутствует. Но дело не в этом, я нашел где ошибка, но пока что не в силах ее решить. Значит заключается она в том что страница создания темы состоит из главного блока (div#container) и двух второстепенных: блок с названием и содержимым темы(div#content) и блок отвечающий за опрос(div#right). Поле ввода название темы съезжало вниз из-за блока с опросом(div#right), который прятался за (div#content). Я поменял местами эти блоки и поле ввода стало отображаться нормально, но теперь блок с опросом вместо того чтоб находится справа от div#content, он находится под ним. Ошибка скорее всего в CSS.

Верстка:

<if test="open_close_perm:|:$formData['modOptionsData']['canSetOpenTime'] == 1 || $formData['modOptionsData']['canSetCloseTime'] == 1">
{parse addtohead="{$this->settings['public_dir']}style_css/{$this->registry->output->skin['_csscacheid']}/calendar_select.css" type="css"}
<script type='text/javascript' src='{$this->settings['public_dir']}js/3rd_party/calendar_date_select/calendar_date_select.js'></script>
</if>
{parse js_module="post"}
{parse striping="post_stripe" classes="row1,row2"}
<h1 class='ipsType_pagetitle'>{$formData['title']}</h1>
<br />
<!--FORUM RULES-->
<form id='postingform' action='{$this->settings['base_url']}' method='post' enctype='multipart/form-data'>
<div class='ipsBox ipsForm_vertical ipsLayout ipsLayout_withright ipsPostForm clearfix'>
<span class="boczki r"></span>
<span class="boczki l"></span>
<span class="topka b"></span>
<span class="topka t"></span>
<span class="rogi tl"></span>
<span class="rogi tr"></span>
<span class="rogi br"></span>
<span class="rogi bl"></span>
<!--Центральная панель-->
	<div class='ipsBox_container ipsLayout_content'>
		<ul class='ipsForm ipsForm_vertical ipsPad'>
			<if test="logged_in_check:|:!$this->memberData['member_id']">
				<li class='ipsField'>
					<label for='username' class='ipsField_title'>{$this->lang->words['guest_name']}</label>
					<p class='ipsField_content'>
						<input type='text' name='UserName' id='username' size='50' value='{$this->request['UserName']}' maxlength="{$this->settings['max_user_name_length']}" class='input_text' tabindex='0' />
					</p>
				</li>
				<if test="guestCaptcha:|:$formData['captchaHTML']">
					{$formData['captchaHTML']}
				</if>
			</if>
			<if test="edit_title_check:|:$formData['formType'] == 'new' OR ( $formData['formType'] == 'edit' AND $formData['canEditTitle'] )">
				<li class='ipsField ipsField_primary'>
					<label for='topic_title' class='ipsField_title'>{$this->lang->words['topic_title']}</label>
					<p class='ipsField_content'>
						<input id='topic_title' class='input_text' type="text" size="60" maxlength="{$this->settings['topic_title_max_len']}" name="TopicTitle" value="{$formData['topicTitle']}" tabindex="0" />
					</p>
				</li>
			</if>
			<if test="edit_tags_check:|:$formData['formType'] == 'new' OR ( $formData['formType'] == 'edit')">
				<if test="hazTag:|:$formData['tagBox']">
					<li class='ipsField tag_field'>
						<label for='ipbTags' class='ipsField_title'>{$this->lang->words['topic_tags']}</label>
						<p class='ipsField_content'>{$formData['tagBox']}</p>
					</li>
				</if>
			</if>

			<li class='ipsField ipsField_editor'>
				<if test="statusMsgs:|:is_array($formData['statusMsg']) AND count($formData['statusMsg']) AND strlen($formData['statusMsg'][0])">
					<div class='message'>{parse expression="implode( '<br />', $formData['statusMsg'])"}</div>
				</if>
				{$formData['editor']}
			</li>				
		</ul>
		<if test="upload_form_check:|:$formData['uploadForm']">
			<fieldset class='attachments'>
				{$formData['uploadForm']}
			</fieldset>
		</if>

	</div>
<!--Центральная панель-->
<!--Правая панель-->
    <div class='ipsBox_container ipsLayout_right ipsPostForm_sidebar'>
		<if test="pollboxHtml:|:$formData['pollBoxHTML']">
			<h3 class='bar'>{$this->lang->words['post_poll']}</h3>
			<fieldset id='poll_fieldset' class='ipsPad' style='display: none'>
				{$formData['pollBoxHTML']}
			</fieldset>
			<script type='text/javascript'>
				$('poll_fieldset').show();
			</script>
		</if>
		<div class='ipsPostForm_sidebar_block'>
			<h3 class='bar'>{$this->lang->words['post_options']}</h3>
			<ul class='ipsPad ipsForm ipsForm_vertical ipsType_small'>
			<if test="htmlstatus:|:$formData['checkBoxes']['html'] !== null">
				<li class='ipsField ipsField_checkbox'>
					<input type="checkbox" name="post_htmlstatus" class="input_check" value="1" id='post_htmlstatus' {$formData['checkBoxes']['html']} />
					<p class='ipsField_content'>
						<label for='post_htmlstatus' data-tooltip='{$this->lang->words['pp_html_tooltip']}'>{$this->lang->words['pp_html']}</label>
					</p>
				</li>
			</if>
				<li class='ipsField ipsField_checkbox'>
					<input type="checkbox" name="enableemo" class="input_check" value="yes" id='enable_emo' {$formData['checkBoxes']['emo']} />
					<p class='ipsField_content'>
						<label for='enable_emo'>{$this->lang->words['enable_emo']}</label>
					</p>
				</li>
			<if test="enablesig:|:$this->memberData['member_id']">
				<li class='ipsField ipsField_checkbox'>
					<input type="checkbox" name="enablesig" class="input_check" value="yes" id='enable_sig' {$formData['checkBoxes']['sig']} />
					<p class='ipsField_content'>
						<label for='enable_sig'>{$this->lang->words['enable_sig']}</label>
					</p>
				</li>
				<li class='ipsField ipsField_checkbox'>
					<input type="checkbox" name="enabletrack" class="input_check" id='enable_track' value="1" {$formData['checkBoxes']['tra']} <if test="tracking:|:$formData['checkBoxes']['tra'] == '-tracking-'">checked='checked'</if> />
					<p class='ipsField_content'>
						<label for='enable_track'>{$this->lang->words['enable_track']}</label>
					</p>
				</li>
			</if>
			</ul>
		</div>
		<if test="showModOptions:|:$formData['modOptionsData']['dropDownOptions'] || $formData['modOptionsData']['canSetOpenTime'] || $formData['modOptionsData']['canSetCloseTime']">
			<div class='ipsPostForm_sidebar_block'>
				<h3 class='bar'>{$this->lang->words['moderator_options']}</h3>
				<ul class='ipsPad ipsForm ipsForm_vertical'>
					<if test="mod_options_check:|:$formData['modOptionsData']['dropDownOptions'] != """>
						<li class='ipsField'>
							<label for='forminput'><strong>{$this->lang->words['after_posting_pf']}</strong></label>
							<p class='ipsField_content'>
								{$formData['modOptionsData']['dropDownOptions']}</select>
							</p>
						</li>
					</if>
					<if test="open_time_check:|:$formData['modOptionsData']['canSetOpenTime'] == 1 ">
						<li class='ipsField'>
							<label for='mod_open_date'><strong>{$this->lang->words['mod_open_time']}</strong></label>
							<p class='ipsField_content'>
								<input type='text' size='7' name='open_time_time' id='mod_open_time' class='date input_text' value='{$formData['modOptionsData']['myTimes']['open_time']}' /> 
								<input type='text' size='16' name='open_time_date' id='mod_open_date' class='input_text date' value='{$formData['modOptionsData']['myTimes']['open_date']}' />
								<img src='{$this->settings['img_url']}/date.png' alt='{$this->lang->words['generic_date']}' id='mod_open_date_icon' class='clickable' />
							</p>
						</li>
					</if>
					<if test="close_time_check:|:$formData['modOptionsData']['canSetCloseTime'] == 1">
						<li class='ipsField'>
							<label for='mod_close_date'><strong>{$this->lang->words['mod_close_time']}</strong></label>
							<p class='ipsField_content'>
								<input type='text' size='7' name='close_time_time' id='mod_close_time' class='date input_text' value='{$formData['modOptionsData']['myTimes']['close_time']}' /> 
								<input type='text' size='16' name='close_time_date' id='mod_close_date' class='date input_text' value='{$formData['modOptionsData']['myTimes']['close_date']}' />
								<img src='{$this->settings['img_url']}/date.png' alt='{$this->lang->words['generic_date']}' id='mod_close_date_icon' class='clickable' />
						</li>
					</if>
				</ul>
				<script type='text/javascript'>
					document.observe("dom:loaded", function(){
						if( $('mod_open_time') ){ $('mod_open_time').defaultize( "{$this->lang->words['mod_time_format']}" ); }
						if( $('mod_open_date') ){ $('mod_open_date').defaultize( "{$this->lang->words['mod_date_format']}" ); }
						if( $('mod_close_time') ){ $('mod_close_time').defaultize( "{$this->lang->words['mod_time_format']}" ); }
						if( $('mod_close_date') ){ $('mod_close_date').defaultize( "{$this->lang->words['mod_date_format']}" ); }
					});
				</script>
			</div>
		</if>
		<if test="edit_options_check:|:$formData['extraData']['showEditOptions']">
			<div class='ipsPostForm_sidebar_block'>
				<h3 class='bar'>{$this->lang->words['edit_options']}</h3>
				<ul class='ipsPad ipsForm ipsForm_vertical'>
					<li class='ipsField ipsField_checkbox'>
						<input type="checkbox" name="add_edit" value="1" id='append_edit' <if test="checkShowEdit:|:$formData['extraData']['checked']">checked="checked"</if> class="input_check" />
						<p class='ipsField_content'>
							<label for='append_edit'>{$this->lang->words['append_edit']}</label>
						</p>
					</li>
					<if test="showeditreason:|:$formData['extraData']['showReason']">
						<li class='ipsField'>
							<label for='post_edit_reason'><strong>{$this->lang->words['preason_for_edit']}</strong></label>
							<p class='ipsField_content'>
								<input type="text" name="post_edit_reason" id='post_edit_reason' value="{$formData['extraData']['reasonForEdit']}" size='30' maxlength='250' class='input_text' />
							</p>
						</li>
					</if>
				</ul>
			</div>
		</if>
	</div>

<!--Конец Правая панель-->

	<if test="shareEnabled:|: ! $formData['socialShareOff']">
		{parse template="socialSharePostStrip" group="global_other"}
	</if>
</div>	

<fieldset class='submit clear'>
	<input type='hidden' name='st' value='{$this->request['st']}' />
	<input type='hidden' name='app' value='forums' />
	<input type='hidden' name='module' value='post' />
	<input type='hidden' name='section' value='post' />
	<input type='hidden' name='do' value='{$form['doCode']}' />
	<input type='hidden' name='s' value='{$this->member->session_id}' />
	<input type='hidden' name='p' value='{$form['p']}' />
	<input type='hidden' name='t' value='{$form['t']}' />
	<input type='hidden' name='f' value='{$form['f']}' />
	<input type='hidden' name='parent_id' value='{$form['parent']}' />
	<input type='hidden' name='attach_post_key' value='{$form['attach_post_key']}' />
	<input type='hidden' name='auth_key' value='{$this->member->form_hash}' />
	<input type='hidden' name='removeattachid' value='0' />
	<input type='hidden' name='return' value='{$this->request['return']}' />
	<input type='hidden' name='_from' value='{$this->request['_from']}' />
	<input type="submit" name="dosubmit" value="{$formData['buttonText']}" tabindex="3" class="input_submit" accesskey="s"  /> 
	<input type="submit" name="preview" value="{$this->lang->words['button_preview']}" tabindex="0" class="input_submit alt" />
	{$this->lang->words['or']}
	<if test="$this->request['return'] == 'modcp:unapproved'">
		<a href='{parse url="app=core&module=modcp&fromapp=forums&tab=unapprovedposts" base="public"}' title='{$this->lang->words['cancel']}' class='cancel' tabindex='0'>{$this->lang->words['cancel']}</a>
	<else />
		<if test="cancelposting:|:$form['t']">
			<a href='{parse url="showtopic={$form['t']}" template="showtopic" seotitle="{$formData['seoTopic']}" base="public"}' title='{$this->lang->words['cancel']}' class='cancel' tabindex='0'>{$this->lang->words['cancel']}</a>
		<else />
			<a href='{parse url="showforum={$form['f']}" template="showforum" seotitle="{$formData['seoForum']}" base="public"}' title='{$this->lang->words['cancel']}' class='cancel' tabindex='0'>{$this->lang->words['cancel']}</a>
		</if>
	</if>
</fieldset>
</form>
{$formData['topicSummary'][0]['html']}

CSS:

/* POSTING FORM STYLES */
/* Additional form styles for posting forms */

.ipsPostForm { }

.ipsPostForm.ipsLayout_withright {
	padding-right: 260px !important;
}

.ipsPostForm .ipsLayout_content {
	z-index: 900;
	-webkit-box-shadow: 2px 0px 4px rgba(0,0,0,0.1);
	-moz-box-shadow: 2px 0px 4px rgba(0,0,0,0.1);
	box-shadow: 2px 0px 4px rgba(0,0,0,0.1);
	float: none;
}

.ipsPostForm .ipsLayout_right {
	width: 250px;
	margin-right: -251px;
	border-left: 0;
	z-index: 800;
}

.ipsPostForm_sidebar .ipsPostForm_sidebar_block.closed h3 {
	background-image: url({style_images_url}/folder_closed.png );
	background-repeat: no-repeat;
	background-position: 10px 9px;
	padding-left: 26px;
	margin-bottom: 2px;
}

В идеале должно быть так:

но это я в фотошопе из кусков сделал)

Очень надеюсь на вашу помощь.

Изменено 20 октября 201213 г пользователем reddd

2 недели спустя...

31 октября 201213 г

Это проблему решило

.ipsPostForm .ipsLayout_right {

width: 250px;

border-left: 0;

z-index: 5000;

position: absolute;

top: 7px;

right: 9px;

}

Создайте аккаунт или войдите в него для комментирования

Зарегистрировать аккаунт

Войти сейчас

Подписчики

Перейти к списку тем

[Шаблон] Создание темы

Рекомендованные сообщения

Создайте аккаунт или войдите в него для комментирования

Важная информация

Аккаунт

Навигация

Поиск

Настроить push-уведомления браузера

Chrome (Android)

Chrome (компьютер)

Safari (iOS 16.4+)

Safari (macOS)

Edge (Android)

Edge (компьютер)

Firefox (Android)

Firefox (компьютер)