Page 1 of 1

Change group style

Posted: 31 Mar 2015, 16:27
by BeanHaas
Hi,

I have a timeline with the group "Rooms" and I need to change the background color of each "Room" depending on the % of ocupation.

Room 1 - 40% (background-color: yellow)
Room 2 - 85% (background-color: red)
Room 3 - 10% (background-color: green)

Is there a way to do it?

Thanks in advance.

Re: Change group style

Posted: 05 Apr 2015, 12:20
by Oleg
What is the problem? You can use

Code: Select all

    <f:facet name="group">  
        <h:panelGroup style="background-color: #{room.color}">  
             #{room.name}
        <h:panelGroup> 
    </f:facet>
You model class Room should provide a method getColor() which returns a color as String depending on % of ocupation.

Re: Change group style

Posted: 09 Apr 2015, 22:09
by BeanHaas
Thank you Oleg!

I wasn't using <h:panelGroup>.
I've tried changing the style (div.timeline-groups-text) but somehow it wasn't working well.

Re: Change group style

Posted: 25 May 2021, 02:48
by tony.herstell
I am struggling to get this going under PF 10.

Code: Select all

 <f:facet name="group">
            <h:panelGroup style="background-color: red !important" styleClass="#{xxxController.getGroupStyle(group)}" >
            		<h:outputText value="#{group}"/>
       		</h:panelGroup>
</f:facet>
Has anything changed?

Re: Change group style

Posted: 25 May 2021, 02:54
by tony.herstell
Prime Icons also do not show up when used inside the Timeline (groups or the text area)

X<i class="pi pi-file"></i>X

the "X's show up; but not the prime icon

elsewhere on the page I am using prime icons and they show up...

Re: Change group style

Posted: 25 May 2021, 02:58
by tony.herstell
I noticed this is "extensions"... but I am using the Timeline supplied in PF10.
Just saying.

Re: Change group style

Posted: 25 May 2021, 03:01
by tony.herstell

Re: Change group style

Posted: 03 Jun 2021, 18:31
by Melloware
Yep I had to fix that cause they turned XSS protection on. Its fixed in 10.0.2.