Перейти к публикации
View in the app

A better way to browse. Learn more.

Дизайн и модификация Invision Community

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Сузить шапку и navbar ips 4.x

Опубликовано:

Добрый! Подскажите, как сузить шапку в 4 ?

 

Безымянный.png

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

Опубликовано:

Открыть шаблон Core / front / global / globalTemplate

Найти:

		<div id='ipsLayout_header' class='ipsClearfix'>
		{template="updateWarning" app="core" group="global" params=""}
		{{if !\in_array('ipsLayout_minimal', \IPS\Output::i()->bodyClasses )}}{template="mobileNavBar" app="core" group="global" params=""}{{endif}}
		<header>
			<div class='ipsLayout_container'>
				{template="logo" app="core" group="global" params=""}
				{{if !\in_array('ipsLayout_minimal', \IPS\Output::i()->bodyClasses )}}{template="userBar" app="core" group="global" params=""}{{endif}}
			</div>
		</header>
		{template="navBar" app="core" group="global" params=""}
	</div>

Обернуть в:

<div class='ipsLayout_container'>		</div>

Найти:

			<header>
			<div class='ipsLayout_container'>
				{template="logo" app="core" group="global" params=""}
				{{if !\in_array('ipsLayout_minimal', \IPS\Output::i()->bodyClasses )}}{template="userBar" app="core" group="global" params=""}{{endif}}
			</div>
		</header>

Заменить:

			<header>
			<div class='ipsLayout_container1'>
				{template="logo" app="core" group="global" params=""}
				{{if !\in_array('ipsLayout_minimal', \IPS\Output::i()->bodyClasses )}}{template="userBar" app="core" group="global" params=""}{{endif}}
			</div>
		</header>

Ну или просто удалить div с ipsLayout_container.

В итоге получится:

  		<div class='ipsLayout_container'>
     	<div id='ipsLayout_header' class='ipsClearfix'>
         	{template="updateWarning" app="core" group="global" params=""}
         	{{if !\in_array('ipsLayout_minimal', \IPS\Output::i()->bodyClasses )}}{template="mobileNavBar" app="core" group="global" params=""}{{endif}}
         	<header>
             	<div class='ipsLayout_container1'>
                 	{template="logo" app="core" group="global" params=""}
                 	{{if !\in_array('ipsLayout_minimal', \IPS\Output::i()->bodyClasses )}}{template="userBar" app="core" group="global" params=""}{{endif}}
             	</div>
         	</header>
         	{template="navBar" app="core" group="global" params=""}
     	</div>
   	</div>

 

В CSS добавить, например в custom.css:

#elSiteTitle {
margin-left: 15px;
}

 

2019-06-03_15-34-22.png

Опубликовано:
  • Автор

Спасибо. Но, навигация сужена, лого нормально

Безымянный.jpg

Опубликовано:
  • Автор

поправил верхний пост

Опубликовано:

Видимо какие-либо ещё есть модификации, нужно смотреть. Вот стандартный шаблон, те правки что присылал + с изменением цвета навигации и добавлением padding-left:

2019-06-03_16-24-04.png

Опубликовано:
  • Автор

У Вас на скрине аналогично уехала навигация в правую сторону... :(

Опубликовано:

У Вас на скрине аналогично уехала навигация в правую сторону... :(

 

Я написал выше, что padding-left специально добавил для тега

Опубликовано:
  • Автор

Из-за того, что я указал резиновую ширину 95% в настройках

Опубликовано:

В custom.css добавить

[data-pagelocation="front"] #ipsLayout_header {
{{if theme.enable_fluid_width}}
	{{if theme.fluid_width_size}}
		max-width: calc({theme="fluid_width_size"}% - 30px);
	{{else}}
		max-width: calc(100% - 30px);
	{{endif}}
{{else}}
	max-width: calc(1340px - 30px);
{{endif}}
margin: 0 auto;
}

[data-pagelocation="front"] header .ipsLayout_container, [data-pagelocation="front"] .ipsNavBar_primary.ipsLayout_container {
max-width: 100%;
}

Без правок html

Опубликовано:
  • Автор

Спасибо

Опубликовано:

Убрать

- 30px

calc тоже не нужен будет.

Опубликовано:
  • Автор

Спасибо

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

Сейчас на странице 0

  • Нет пользователей, просматривающих эту страницу.

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.