Перейти к содержанию

Dusty

Актив
  • Постов

    906
  • Зарегистрирован

  • Посещение

  • Победитель дней

    2

Активность репутации

  1. Спасибо
    Dusty отреагировал в newload за запись, Sticky Sidebar   
    Just go to Template > Core > Front > Global > Sidebar
    and paste this code there:
    {{$adsForceSidebar = ( \IPS\Settings::i()->ads_force_sidebar AND \IPS\core\Advertisement::loadByLocation( 'ad_sidebar' ) );}} {{if (isset( \IPS\Output::i()->sidebar['enabled'] ) and \IPS\Output::i()->sidebar['enabled'] ) && ( ( isset( \IPS\Output::i()->sidebar['contextual'] ) && trim( \IPS\Output::i()->sidebar['contextual'] ) !== '' ) || ( isset( \IPS\Output::i()->sidebar['widgets']['sidebar'] ) && \count( \IPS\Output::i()->sidebar['widgets']['sidebar'] ) ) || ( \IPS\Dispatcher::i()->application instanceof \IPS\Application AND \IPS\Dispatcher::i()->application->canManageWidgets() ) || $adsForceSidebar )}} <div id='ipsLayout_sidebar' class='ipsLayout_sidebar{$position} {{if !( isset( \IPS\Output::i()->sidebar['contextual'] ) && trim( \IPS\Output::i()->sidebar['contextual'] ) !== '' ) && ( !isset( \IPS\Output::i()->sidebar['widgets']['sidebar'] ) || !\count( \IPS\Output::i()->sidebar['widgets']['sidebar'] ) ) && \IPS\Dispatcher::i()->application->canManageWidgets() && !$adsForceSidebar}}ipsLayout_sidebarUnused{{endif}}' data-controller='core.front.widgets.sidebar'> {{if $announcements = \IPS\core\Announcements\Announcement::loadAllByLocation( 'sidebar' ) AND ( ( isset( \IPS\Output::i()->sidebar['contextual'] ) && trim( \IPS\Output::i()->sidebar['contextual'] ) !== '' ) OR ( isset( \IPS\Output::i()->sidebar['widgets']['sidebar'] ) && \count( \IPS\Output::i()->sidebar['widgets']['sidebar'] ) ) )}} {template="announcementSidebar" group="global" app="core" params="$announcements"} {{endif}} <div class='ibtFloatSidebar'> {{if isset( \IPS\Output::i()->sidebar['contextual'] ) && trim( \IPS\Output::i()->sidebar['contextual'] ) !== ''}} <aside id="elContextualTools" class='ipsClearfix' {{if isset( \IPS\Output::i()->sidebar['sticky'] )}}data-ipsSticky{{endif}}> {expression="\IPS\Output::i()->sidebar['contextual']" raw="true"} </aside> {{endif}} {{if $adsForceSidebar OR ( \IPS\core\Advertisement::loadByLocation( 'ad_sidebar' ) AND ( ( isset( \IPS\Output::i()->sidebar['contextual'] ) && trim( \IPS\Output::i()->sidebar['contextual'] ) !== '' ) OR ( isset( \IPS\Output::i()->sidebar['widgets']['sidebar'] ) && \count( \IPS\Output::i()->sidebar['widgets']['sidebar'] ) ) ) )}} <div data-role='sidebarAd'> {advertisement="ad_sidebar"} </div> <br><br> {{endif}} {template="widgetContainer" group="global" app="core" params="'sidebar', 'vertical'"} </div></div> {{endif}} <script> // обработчик "прилипания" контента в правой колонке (function(){ var a = document.querySelector('.ibtFloatSidebar'), b = null, K = null, Z = 0, P = 0, N = 0; // если у P ноль заменить на число, то блок будет прилипать до того, как верхний край окна браузера дойдёт до верхнего края элемента, если у N — нижний край дойдёт до нижнего края элемента. Может быть отрицательным числом window.addEventListener('scroll', Ascroll, false); document.body.addEventListener('scroll', Ascroll, false); function Ascroll() { (function(jQuery) { var c = document.querySelector('#ipsLayout_mainArea'), Rc = c.getBoundingClientRect(), Ra = a.getBoundingClientRect(), R1bottom = Rc.bottom; if (b == null) { var Sa = getComputedStyle(a, ''), s = ''; for (var i = 0; i < Sa.length; i++) { if (Sa[i].indexOf('overflow') == 0 || Sa[i].indexOf('padding') == 0 || Sa[i].indexOf('border') == 0 || Sa[i].indexOf('outline') == 0 || Sa[i].indexOf('box-shadow') == 0 || Sa[i].indexOf('background') == 0) { s += Sa[i] + ': ' +Sa.getPropertyValue(Sa[i]) + '; ' } } b = document.createElement('div'); b.className = "stopSticky"; b.style.cssText = s + ' box-sizing: border-box; width: ' + a.offsetWidth + 'px;'; a.insertBefore(b, a.firstChild); var l = a.childNodes.length; for (var i = 1; i < l; i++) { b.appendChild(a.childNodes[1]); } } //просчитываем высоту колонки a.style.height = b.getBoundingClientRect().height + 'px'; a.style.padding = '0'; a.style.border = '0'; var Rb = b.getBoundingClientRect(), Rh = Ra.top + Rb.height, W = document.documentElement.clientHeight, R1 = Math.round(Rh - R1bottom), R2 = Math.round(Rh - W); if (Ra.bottom < R1bottom) { if((Rc.height > Rb.height) /*&& (Rb.height > W)*/) { // проверка того, что высота колонки больше высоты контента if (Rb.height > W) { if (Ra.top < K) { // скролл вниз //console.log('скролл вниз'); if (R2 + N > R1) { // не дойти до низа //if ((Rb.bottom - W + N < 0) && (Rb.top - P < 0)) { // подцепиться if ((parseInt(Rb.bottom) - W + N) <= 0/* && (Rb.top + W < 0)*/) { // подцепиться b.className = 'startSticky'; b.style.top = W - Rb.height - N + 'px'; Z = N + Ra.top + Rb.height - W; } else { b.className = 'stopSticky'; b.style.top = -Z + 'px'; } } else { b.className = 'stopSticky'; b.style.top = -R1 + 'px'; Z = R1; } } else { // скролл вверх //console.log('скролл вверх'); if (Ra.top - P < 0) { // не дойти до верха if (Rb.top - P >= 0) { // подцепиться b.className = 'startSticky'; b.style.top = P + 'px'; Z = Ra.top - P; } else { b.className = 'stopSticky'; b.style.top = -Z + 'px'; } } else { b.className = ''; b.style.top = ''; Z = 0; } } K = Ra.top; } else { if ((Ra.top - P) <= 0) { if ((Ra.top - P) <= R1) { b.className = 'stopSticky'; b.style.top = -R1 + 'px'; } else { b.className = 'startSticky'; b.style.top = P + 'px'; } } else { b.className = ''; b.style.top = ''; } } } else { // если высота контента меньше высоты колонки, то "прибиваем" колонку к верху Z = 0; b.className = 'stopSticky'; b.style.top = Z + 'px'; } window.addEventListener('resize', function() { a.children[0].style.width = getComputedStyle(a, '').width }, false); } })(jQuery) } })() </script> Then on Custom.css you throw this code there:
    #ipsLayout_mainArea {height: auto;} .startSticky {position: fixed; z-index: 101;} .stopSticky {position: relative; z-index: 101;} And that's it!
    Example:

  2. Спасибо
    Dusty отреагировал в Wave за запись, Изменяем ipsItemControls [IPS 4.2] (Меню управления постами)   
    Изменяем "Меню управления постами" к привычному виду, как на ipb 3.X
    Перейти:  АЦ - Внешний Вид - Темы - Редактировать HTML и CSS(</>) - Шаблоны - globalTemplate

    Находим строку ( Вторая строка в globalTemplate )
    <html lang="{expression="\IPS\Member::loggedIn()->language()->bcp47()"}" dir="{{if member.language()->isrtl}}rtl{{else}}ltr{{endif}}"> Заменяем на
    <html lang="{expression="\IPS\Member::loggedIn()->language()->bcp47()"}" dir="{{if member.language()->isrtl}}rtl{{else}}ltr{{endif}} focus-topic-compact focus-post-bar focus-post-row'> Переходим на вкладку CSS, открываем custom.css 
    В самом конце вставляем этот код ( Для светлого стиля! )
    /* Flex layout */ .ipsApp .cPost{ display: flex; } .cPost .cAuthorPane{ flex: 0 0 auto; } .cPost .ipsColumn_fluid{ flex: 1 1 auto; display: flex; } /* Push bar to the bottom if enabled */ .focus-post-bar .cPost{ align-items: stretch; } /* .focus-post-bar .cPost, .focus-post-bar .cPost .ipsColumn{ height: 100%; } */ .focus-post-bar .cPost .ipsComment_content{ display: flex; flex-direction: column; } .focus-post-bar .cPost .ipsComment_meta{ flex: 0 0 auto; } .focus-post-bar .cPost .cPost_contentWrap{ display: flex; flex-direction: column; justify-content: space-between; flex: 1 1 auto; } .focus-post-bar .cPost [data-role="commentContent"]{ margin-bottom: auto; padding-bottom: 10px; } /* ---------------- Comment controls: bar ---------------- */ .ipsItemControls, html[dir="ltr"] .ipsReact_blurb:not(.ipsHide) + .ipsReact_types, html[dir="rtl"] .ipsReact_blurb:not(.ipsHide) + .ipsReact_types{ border-color: {hextorgb="text_color" opacity="0.1"}; } html[dir="rtl"] .ipsReact_blurb, html[dir="ltr"] .ipsReact_blurb:not(.ipsHide) + .ipsReact_types{ margin-left: 5px; } html[dir="ltr"] .ipsReact_blurb, html[dir="rtl"] .ipsReact_blurb:not(.ipsHide) + .ipsReact_types{ margin-right: 5px; } .focus-post-bar .cTopic .ipsItemControls{ background: #f5f5f5; border-color: rgba(102,102,102,0.13); border-style: solid; border-width: 1px 0 0 0; color: {theme="text_color"}; } @media screen and (min-width:768px){ .cTopic .ipsItemControls{ padding: 1px; } .focus-post-bar .cTopic .ipsItemControls{ width: auto; margin-bottom: -15px; order: 1; } html[dir='ltr'].focus-post-bar .cTopic .ipsItemControls{ margin-left: -200px; margin-right: -15px; padding-left: 200px; } html[dir='rtl'].focus-post-bar .cTopic .ipsItemControls{ margin-right: -200px; margin-left: -15px; padding-right: 200px; } .focus-post-bar .cTopic .cAuthorPane_info:after{ content: ''; display: block; height: 44px; } } @media screen and (max-width:767px){ .cPost .ipsItemControls{ margin-bottom: 0; padding: 5px 0; } .focus-post-bar .cPost .ipsItemControls{ margin-left: -10px; margin-right: -10px; width: auto; padding: 5px; } } /* ---------------- Comment controls: buttons ---------------- */ .focus-post-buttons .cTopic .ipsComment_controls{ color: {theme="normal_button_font"}; padding: 5px 0; line-height: 2.8rem; font-weight: bold; font-size: 0; } .focus-post-buttons .cTopic .ipsComment_controls > li{ font-size: 1.2rem; vertical-align: top; } html[dir="ltr"].focus-post-buttons .cTopic .ipsComment_controls > li{ margin-right: 5px; } html[dir="rtl"].focus-post-buttons .cTopic .ipsComment_controls > li{ margin-left: 5px; } .focus-post-buttons .cTopic .ipsComment_controls a, .focus-post-buttons .cTopic .ipsComment_controls .ipsButton{ border-radius: 3px; text-shadow: rgba(0,0,0,0.2) 0px 1px 1px; background-color: {theme="normal_button"}; font-size: inherit; font-weight: inherit; color: inherit; margin: 0; padding: 0 0.8em; line-height: inherit; display: block; border: 0; text-shadow: inherit; vertical-align: top; } .focus-post-buttons .cTopic .ipsComment_controls a:hover, .focus-post-buttons .cTopic .ipsComment_controls .ipsButton:hover{ background-image: linear-gradient(to bottom, rgba(255,255,255,0.2) 0%, rgba(255,255,255,0.2) 100%); } /* ---------------- Comment controls: button row ---------------- */ .focus-post-row .cTopic .ipsItemControls{ padding: 0; } .focus-post-row .cTopic .ipsComment_controls{ color: #313131; border-width: 0 0 0 1px; border-style: solid; border-color: rgba(102,102,102,0.13); padding: 0; line-height: 44px; font-weight: bold; font-size: 0; } html[dir='rtl'].focus-post-row .cTopic .ipsComment_controls{ border-width: 0 1px 0 0; } @media screen and (max-width:767px){ .focus-post-row .cTopic .ipsComment_controls, html[dir='rtl'].focus-post-row .cTopic .ipsComment_controls{ border-width: 0; } } .focus-post-row .cTopic .ipsComment_controls > li{ font-size: 1.2rem; vertical-align: top; margin: 0; border-width: 0 1px 0 0; border-style: solid; border-color: inherit; } html[dir='rtl'].focus-post-row .cTopic .ipsComment_controls > li{ border-width: 0 0 0 1px; } .focus-post-row .cTopic .ipsComment_controls a, .focus-post-row .cTopic .ipsComment_controls .ipsButton{ background: none; font-size: inherit; font-weight: inherit; color: inherit; margin: 0; padding: 0 1em; line-height: inherit; display: block; border: 0; text-shadow: inherit; vertical-align: top; box-shadow: none; } .focus-post-row .cTopic .ipsComment_controls a:hover, .focus-post-row .cTopic .ipsComment_controls .ipsButton:hover{ color: inherit; background: {hextorgb="text_color" opacity="0.06"}; } Что должно получится

    Если стиль темный
    Находим в custom.css строку (ctrl+f) - .focus-post-bar .cTopic .ipsItemControls
    .focus-post-bar .cTopic .ipsItemControls{ background: #f5f5f5; border-color: rgba(102,102,102,0.13); border-style: solid; border-width: 1px 0 0 0; color: {theme="text_color"}; } Заменяем на 
    .focus-post-bar .cTopic .ipsItemControls{ background: none; border-color: rgba(102,102,102,0.13); border-style: solid; border-width: 1px 0 0 0; color: {theme="text_color"}; }  
×
×
  • Создать...