Jump to content

Add a CSS class to Pinned Topic row

Featured Replies

Posted

At the moment there's no class or ID on a pinned topic. This means we cannot easily adjust the appearance via CSS.

This was mentioned here, but not in the correct forum: 

I'm guessing the suggestion wasn't necessarily seen or considered for IPB 4.3, but hopefully it might now be ?

 

1 hour ago, NeedCoffee said:

At the moment there's no class or ID on a pinned topic. This means we cannot easily adjust the appearance via CSS.

This was mentioned here, but not in the correct forum: 

I'm guessing the suggestion wasn't necessarily seen or considered for IPB 4.3, but hopefully it might now be ?

 

Can be done but will need to make changes to the actual template (doing so may require reverting template and re-adding the change with future upgrades)

If happy with that then:

admincp >> themes >> far right of theme name select the </> button

find forums >> forums >> topicRow

in there look for

<li class="ipsDataItem ipsDataItem_responsivePhoto {{if $row->unread()}}ipsDataItem_unread{{endif}} {{if method_exists( $row, 'tableClass' ) && $row->tableClass()}}ipsDataItem_{$row->tableClass()}{{endif}} {{if $row->hidden()}}ipsModerated{{endif}}" data-rowID='{$row->$idField}'>

change to

			<li class="ipsDataItem ipsDataItem_responsivePhoto {{if $row->mapped('pinned')}}pinned{{endif}} {{if $row->unread()}}ipsDataItem_unread{{endif}} {{if method_exists( $row, 'tableClass' ) && $row->tableClass()}}ipsDataItem_{$row->tableClass()}{{endif}} {{if $row->hidden()}}ipsModerated{{endif}}" data-rowID='{$row->$idField}'>

then save

in custom.css add:

.pinned {
  background: #fff;
}

obviously change the #fff to your own choice

  • Author

Thanks very much - that'll work for now, which is great.

Hopefully one of the IPS team will consider just adding a CSS when a topic is pinned, to save all that effort. Will they see this or do we need to tag them?

Can do this without modification to the template. Not the best CSS practice though and will not work in old versions of IE:

.ipsDataItem_main span[title='Pinned'] {
    color: #000;/*Just for fun*/
	/*insert your CSS*/

}

 

57 minutes ago, The Jimmo said:

Can do this without modification to the template. Not the best CSS practice though and will not work in old versions of IE:


.ipsDataItem_main span[title='Pinned'] {
    color: #000;/*Just for fun*/
	/*insert your CSS*/

}

 

Afraid not, wants the background color changed

pinned1.thumb.jpg.4363760f598bfd11d5e821a8a18017da.jpg

18 minutes ago, steve00 said:

Afraid not, wants the background color changed

pinned1.thumb.jpg.4363760f598bfd11d5e821a8a18017da.jpg

Misread, thought background of icon.

A simple jQuery code can do the job if it is important to you :; 

  • 1 month later...

UPDATE TO MY CODE ABOVE:

Use the following code instead of above code

			<li class="ipsDataItem ipsDataItem_responsivePhoto  {{if $row->unread()}}ipsDataItem_unread{{endif}} {{if method_exists( $row, 'tableClass' ) && $row->tableClass()}}ipsDataItem_{$row->tableClass()}{{endif}} {{if $row->hidden()}}ipsModerated{{endif}} {{if $row->mapped('pinned')}}pinned{{endif}}" data-rowID='{$row->$idField}'>

Changed as if pinned topic is unread the that background color over rode the pinned background

  • 7 months later...
On 5/1/2018 at 1:58 PM, NeedCoffee said:

At the moment there's no class or ID on a pinned topic. This means we cannot easily adjust the appearance via CSS.

 

On 5/1/2018 at 3:30 PM, NeedCoffee said:

Hopefully one of the IPS team will consider just adding a CSS when a topic is pinned, to save all that effort.


Yes, I really hope that a simple CSS solution (like in Xenforo) will be introduced without the need to alter the template.

Archived

This topic is now archived and is closed to further replies.

Recently Browsing 0

  • No registered users viewing this page.