Forum Discussion

Claudius's avatar
12 months ago

Styling event attendance buttons

Events have a sliced buttons with the three attendance options. When the user selects one of the option there's only a small byline further down in the attendance list (Bonus question: why is it part of the attendance list? It's not independent of the tabbed attendance navigation but still shown within those tabs):

User expectation from most other event tools is that there's feedback on the buttons to convey the user's choice. Here's a mockup of what I would like to see:

I was looking at styling the button depending on the user choice, but unfortunately that is not exposed as a class within the path of the button.  The class "lia-occasion-rsvp-response-yes/no/maybe" is exposed in a container which is a child of a sibling to the parent of the button wrapper... and I'm not really in a mood to construct such a complex :has() CSS selector.

I thought about overriding the component to expose the attendance status, but that won't really work as the component is dynamically updated when the button is clicked without reloading the page.

Any ideas on how you would colour the button element depending on user attendance choice? I currently think this most likely will end up as an idea to expose the lia-response class further up in the DOM which will most likely never be actioned since Khoros focus has shifted from Classic to Aurora... 

No RepliesBe the first to reply