XF 2.2 How can I change format of forum titles only in forum list on main page?

[gogo]

For example, I would like to make these titles a bit larger and always keep bold even if it's marked read.

And it only applies on the forum titles in forum main page.

How do I do it? Thanks.

 

[Paul B]

Add this to the extra.less template:

.node-title
{
    font-size: 20px;
    font-weight: 700;
}

Adjust to suit.

 

[Ottavius]

Brogan, if I just want to keep the titles Bold, can this be done too?

.node-title
{
    font-weight: 700;
}

 

[Paul B]

Yes.

 

[Ottavius]

Thanks!

 

[gogo]

Add this to the extra.less template:

.node-title
{
    font-size: 20px;
    font-weight: 700;
}

Adjust to suit.

But this also make changes to the forum titles (sub-forums) in inner pages, not as I wanted it only applies to forum titles on main page only.

 

[Paul B]

In that case you will need to make the selector more specific.

You can do that using the page template, like so:

[data-template="forum_list"]
.node-title
{
    font-size: 20px;
    font-weight: 700;
}

 

[gogo]

In that case you will need to make the selector more specific.

You can do that using the page template, like so:

[data-template="forum_list"]
.node-title
{
    font-size: 20px;
    font-weight: 700;
}

Oh the data-template tag! I got something like that in my extra.less actually. Why didn't I think of that. Thank you so much!

 

[gogo]

In that case you will need to make the selector more specific.

You can do that using the page template, like so:

[data-template="forum_list"]
.node-title
{
    font-size: 20px;
    font-weight: 700;
}

Just tried. This actually doesn't work. The sub-forum titles on the parent forum page still follow the same format as defined in the code.

 

[Paul B]

Not for me.

I tested it on a demo build and it works as expected.

 

[gogo]

I'll need to check if there's any addon that breaks it then.

 

[Paul B]

Check the contents of the extra.less template.

You may have some malformed code, or code further down which overrides what you are entering.

 

[gogo]

You're right. I just tried it in another version of my test server that works fine.

I'll take a look at the extra.less tomorrow when I'm around with my PC. Thanks.

 

[Sentenza]

In that case you will need to make the selector more specific.

You can do that using the page template, like so:

[data-template="forum_list"]
.node-title
{
    font-size: 20px;
    font-weight: 700;
}

Thank you Brogan!

I need the code to disable the subforums from the forum list. And it works.
But on my mobile phone in portrait format, the subforums are always visible.

Here is my code:

[data-template="forum_list"]
.node-subNodesFlat
{
display: none;
}

 

[gogo]

Thank you Brogan!

I need the code to disable the subforums from the forum list. And it works.
But on my mobile phone in portrait format, the subforums are always visible.

Here is my code:

[data-template="forum_list"]
.node-subNodesFlat
{
display: none;
}

 

[Sentenza]

Thanks, but I wrote that I need to remove it only from the forum list. Therefore the code.

 

[gogo]

Thanks, but I wrote that I need to remove it only from the forum list. Therefore the code.

Yeah. later I realized what you really meant. And I tested your code. It actually works even in mobile view.

 

[Sentenza]

Yeah. later I realized what you really meant. And I tested your code. It actually works even in mobile view.

I have an iPhone XS. In the landscape mode it works. Maybe your display is bigger?

 

[gogo]

My phone is android.

I tested it with a new server.

This is the only code I have in extra.less:






With the code deleted:



The default setting shouldn't have sub-forums shown in mobile view? Maybe you got some other codes that deliberately showed it?

 

[Sentenza]

Yes, but as written it depends on the display size or resolution. In landscape view on the phone ist the display wider and it works.

The code must be extended so that it also applies to the mobile style.