Adding to each tab an icon

avatar cansado Pro Mar 24. 2008. 12:08 pm #1
I need to apply one CSS CLASS to each tab instead 1 for all. I think that I have to modify "helpers/proyect_website.php adding a CSS in:

add_tabbed_navigation_item(new TabbedNavigationItem(
  PROJECT_TAB_OVERVIEW, 
  lang('overview'), 
  get_url('project')
));


But i dont know how. Maybe inserting an image directly?

Thanks,
avatar ChrisGreenhough May 27. 2009. 10:07 am #2
Hi cansado,

Do you need to insert an image or a class here? My quick and dirty approach would have been trying to use css attribute selectors, but in fact the system makes it even easier than that since each of the tabs has an ID. Therefore you can style each one individually anyway in the CSS file without editing any of the php, such as…
li#page_tab_tickets { background-image: url(tab_image.gif) };

… if you want it on the list item, or… 
li#page_tab_tickets a { background-image: url(tab_image.gif) };

… if you want it on the link element itself.

Hope that helps.
avatar Ilija Studen Staff May 27. 2009. 10:10 am #3
Hi Chris,

Thanks for sharing. Original question is for activeCollab 0.7.1 and the solution you proposed will work only with activeCollab 1.0 and later.
avatar ChrisGreenhough May 27. 2009. 10:26 am #4
Ah. That I did not realise. Thanks. :-)
avatar Ilija Studen Staff May 27. 2009. 10:56 am #5
Not a problem :) I just wanted to point it out to avoid any confusion if someone stumbles upon this topic in the future.