XF 2.1 Making pinned content stand out in the forum view?

[iaresee]

I'd like to emphasize or darken the background for pinned threads in a forum so they stand out from the rest of the content:



I'm having trouble finding the right vB Style property to tweak to adjust only the background color for pinned threads.

Is this possible? Can someone steer me in the correct direction? Thanks!

 

[iaresee]

Even better would be if I could add some delination between pinning and unpinned posts like we had in 1.x.

 

[sbj]

Sticky thread simple styling

Customising the look of the stickies seems to be much simpler than in xf1, the following added to EXTRA.less will change the background colour, font style and font colour of the main text (i.e. the links)...

xenforo.com

Unmaintained - Highlight and Separate Sticky Threads

Simple css (extra.less) modifications to highlight/separate sticky threads Separate sticky and normal threads Insert code in template: extra.less /* Border between sticky/normal threads */ .structItemContainer-group--sticky { border-bottom...

xenforo.com

Separate sticky threads from normal ones

Here is how Separate sticky threads from normal ones 1- Go to template forum_view 2- find this code ...

xenforo.com

Unmaintained - [XenGenTr] XenSticky thread

XF2 - [XenGenTr] XenSticky thread It is written for Xenforo 2 and is a free plugin. Plugin task; The task of the plugin is to separate the fixed and normal threads in the thread list. Plugin properties; You can arrange the sorting line as you...

xenforo.com

Separate Sticky and Normal Threads (XF +2.x) by Xon

A template modification to separate Sticky and Normal threads. Sticky/Normal labels are phrased. Based off; Separate Sticky and Normal Threads (XF +1.2) by Xon Phrases seperator_normal_threads seperator_sticky_threads Contributing features...

xenforo.com

 

[iaresee]

@sbj you're a gem. Thank you!

 

[iaresee]

In case someone lands on this thread, my ultimate solution was to edit the forum_view template for my sub-style. In the sticky thread display section:

                    <xf:if is="$stickyThreads is not empty">
                        <div class="structItemContainer-group structItemContainer-group--sticky">
                            <xf:foreach loop="$stickyThreads" value="$thread">
                                <xf:macro template="thread_list_macros" name="item" arg-thread="{$thread}" arg-forum="{$forum}" />
                            </xf:foreach>
                        </div>

                        <xf:ad position="forum_view_below_stickies" arg-forum="{$forum}" />
                    </xf:if>

I added:

<hr class="stickySeparator"/>

Right before the xf:ad element.

End result for the entire block was:

                    <xf:if is="$stickyThreads is not empty">
                        <div class="structItemContainer-group structItemContainer-group--sticky">
                            <xf:foreach loop="$stickyThreads" value="$thread">
                                <xf:macro template="thread_list_macros" name="item" arg-thread="{$thread}" arg-forum="{$forum}" />
                            </xf:foreach>
                        </div>
                        <hr class="stickySeparator"/>

                        <xf:ad position="forum_view_below_stickies" arg-forum="{$forum}" />
                    </xf:if>

And in extra.less I added:

// Controls the style of the separator between sticky and non-sticky content
// See: https://xenforo.com/community/resources/separate-sticky-threads-from-normal-ones.5706/
.stickySeparator {
  height: 30px;
  border-style:none;
  background-color: @xf-pageBg;
  margin: 0px;
}

This got me:



Which is good enough to satisfy my needs.