captainspud
2013-07-09T18:55:48Z
YAF comes with five default Topic Statuses, each with an associated 16px square icon. On my forum I'd like to use custom icons for the statuses that aren't square, but the forums automatically add this attribute inline to the IMG tag:
Quote:

<a href="/yaf_postst8_test.aspx" class="post_link" title="test">
<img src="/Themes/MyTheme/icon_filename.png" alt="" title="" style="border: 0;width:16px;height:16px" /> &nbsp;Thread title
</a>


This squishes my icons (which are 50px wide) into a square shape, making them illegible. I first tried to change this in CSS:
Quote:

.yafnet tr.topicRow a.post_link img {
border: 1px #f06 solid;
width: 50px;
}


However, inline styling overrides class styling, so the explicitly-defined border and width aren't affected by my code. I then tried to find the spot in the source files where topic listings are generated, but this wasn't very helpful either. I thought I found what I was looking for in TopicLine.ascx, line 44-47:
Quote:

<a href="<%=YafBuildLink.GetLink(ForumPages.posts, linkParams, this.TopicRow["LinkTopicID"])%>"
class="post_link" title="<%=this.Get<IFormatMessage>().GetCleanedTopicMessage(this.TopicRow["FirstMessage"], this.TopicRow["LinkTopicID"]).MessageTruncated%>">
<%=this.FormatTopicName() %>
</a>


However, while this code block clearly writes the <a> tag wrapped around the title text, it never explicitly writes out the <img> tag. I'm guessing the Status image is being added by the FormatTopicName() function, but I haven't been able to figure out where YAF stores its function definitions, so my search has more or less hit a brick wall.

So, in a nutshell:

1. Is there an easier, more direct way to change how YAF writes out the IMG tag for the Topic Status so that the style="" attribute can be edited or, ideally, removed entirely (since I'd ideally like to use different-sized icons)?
2. If not, where in the YAF files can I edit FormatTopicName()?
Sponsor
tha_watcha
2013-07-10T10:02:02Z
Yes it is currently hard coded inline styling (Very lazy coding).

I changed it (in change set 1559ef03df2f ) to an css class and now it can be controlled from the forum.css and overridden by the theme.css

If you are not able to make the changes to the source code and compile yaf you can use the !important attribute to change the width

.yafnet tr.topicRow a.post_link img {
border: 1px #f06 solid;
width: 50px!important;
}
UserPostedImage
captainspud
2013-07-10T15:07:51Z
Thanks, I forgot I could use !important to force a CSS attribute to be used. :)

It still displays wrong on the forum index because the Status icons there aren't wrapped in any specially-classed tags I can reference, but I can live with that for now; the important thing for us was to have them display at the correct size within their actual forum.
Users browsing this topic

    About Us

    The YAF.NET is an open source .NET forum project. YAF.NET is supported by an team of international developers who are build community by building community software.

    Powered by Resharper Donate with PayPal button

    Project Twitter Updates

    Copyright © YetAnotherForum.NET & Ingo Herbote. All rights reserved