2 Qs about Latest Topics widget

by Diana March 6th 2016, 1:04 am

1. Is it possible in any way for topics' titles appearing in the Latest Topics widget to have different colours as assigned when making the topic? You know how you can have different colours for your titles, I want them to be different in the Latest Topics section aswell, not just in the forum part.

2. How can I get the same scrollbar in my Latest Topic widget like on here? It would be very handy.

my forum: http://velvet.forum.co.ee/

by **Ape** March 6th 2016, 3:23 am

Diana wrote:1. Is it possible in any way for topics' titles appearing in the Latest Topics widget to have different colours as assigned when making the topic? You know how you can have different colours for your titles, I want them to be different in the Latest Topics section aswell, not just in the forum part.

2. How can I get the same scrollbar in my Latest Topic widget like on here? It would be very handy.

my forum: http://velvet.forum.co.ee/

1 No sorry the data has the same name on the codes so you can only see one color

as for 2 well Ange Tuteur made the code and its added in the templats so i can not get the code for you.

Sadly Ange Tuteur has now left the team and will not be in as much as he was before.

so the chance of you asking him for the code will be really small

by An March 6th 2016, 3:03 pm

Can you post your mod_recent_topics template here for Q2? It's in the Templates under Portal. All you need to do is add a container and/or class around the classical row, then use CSS to add a height limit and enable overflow.

by Diana March 6th 2016, 8:49 pm

Code::  {MARQUEE_JS_SRC} <table class="forumline genmed" width="100%" border="0" cellspacing="1" cellpadding="0"> <tr> <td class="catLeft" height="25"> <span class="genmed module-title">{L_RECENT_TOPICS}</span> </td> </tr> <tr> <td class="row1" style="height:{SCROLL_HEIGHT}px;"> <div class="marquee" align="left" data-direction='{SCROLL_WAY}' data-duration='{SCROLL_DELAY}' data-pauseOnHover="true" style="overflow:hidden;height:{SCROLL_HEIGHT}px;">  » <a href="{scrolling_row.recent_topic_row.U_TITLE}" title="{scrolling_row.recent_topic_row.L_TITLE}">{scrolling_row.recent_topic_row.L_TITLE}</a><br /> <img src="{ICON_TIME}" alt="" />{scrolling_row.recent_topic_row.S_POSTTIME} {BY}   <a href="{scrolling_row.recent_topic_row.switch_poster.U_POSTER}">{scrolling_row.recent_topic_row.switch_poster.S_POSTER}</a><br /><br />   {scrolling_row.recent_topic_row.switch_poster_guest.S_POSTER}<br /><br />   </div> </td> </tr> </table> <script> $(".marquee").marquee(); </script>   <table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0"> <tr> <td class="catHead" height="25"><span class="genmed"><b><center>{L_RECENT_TOPICS}</center></b></span></td> </tr> <tr> <td class="row1" align="left"><span class="gensmall">  » <a href="{classical_row.recent_topic_row.U_TITLE}">{classical_row.recent_topic_row.L_TITLE}</a><br /><img src="{ICON_TIME}" alt="" />{BY}   <a href="{classical_row.recent_topic_row.switch_poster.U_POSTER}">{classical_row.recent_topic_row.switch_poster.S_POSTER}</a>   {classical_row.recent_topic_row.switch_poster_guest.S_POSTER}  {ON} {classical_row.recent_topic_row.S_POSTTIME}<br /><br />   </span></td> </tr> </table>

by An March 6th 2016, 10:19 pm

Here you go, change the template to the one below.

Code::  {MARQUEE_JS_SRC} <table class="forumline genmed" width="100%" border="0" cellspacing="1" cellpadding="0"> <tr> <td class="catLeft" height="25"> <span class="genmed module-title">{L_RECENT_TOPICS}</span> </td> </tr> <tr> <td class="row1" style="height:{SCROLL_HEIGHT}px;"> <div class="marquee" align="left" data-direction='{SCROLL_WAY}' data-duration='{SCROLL_DELAY}' data-pauseOnHover="true" style="overflow:hidden;height:{SCROLL_HEIGHT}px;">  » <a href="{scrolling_row.recent_topic_row.U_TITLE}" title="{scrolling_row.recent_topic_row.L_TITLE}">{scrolling_row.recent_topic_row.L_TITLE}</a><br /> <img src="{ICON_TIME}" alt="" />{scrolling_row.recent_topic_row.S_POSTTIME} {BY}   <a href="{scrolling_row.recent_topic_row.switch_poster.U_POSTER}">{scrolling_row.recent_topic_row.switch_poster.S_POSTER}</a><br /><br />   {scrolling_row.recent_topic_row.switch_poster_guest.S_POSTER}<br /><br />   </div> </td> </tr> </table> <script> $(".marquee").marquee(); </script>   <table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0"> <tr> <td class="catHead" height="25"><span class="genmed"><b><center>{L_RECENT_TOPICS}</center></b></span></td> </tr> <tr> <td class="row1" align="left"><div id="recent_topic_list" class="gensmall">  » <a href="{classical_row.recent_topic_row.U_TITLE}">{classical_row.recent_topic_row.L_TITLE}</a><br /><img src="{ICON_TIME}" alt="" />{BY}   <a href="{classical_row.recent_topic_row.switch_poster.U_POSTER}">{classical_row.recent_topic_row.switch_poster.S_POSTER}</a>   {classical_row.recent_topic_row.switch_poster_guest.S_POSTER}  {ON} {classical_row.recent_topic_row.S_POSTTIME}<br /><br />   </div></td> </tr> </table>

Add the CSS below to your stylesheet.

Code:: #recent_topic_list { height:200px; overflow-y:auto; } #recent_topic_list::-webkit-scrollbar { width:6px; } #recent_topic_list::-webkit-scrollbar-track { background:rgba(0, 0, 0, 0.1); } #recent_topic_list::-webkit-scrollbar-thumb { background:#999; }