i am using a select field with multiple hard-coded options in a page blueprint directly and it’s being displayed in a pages section with table layout. i would like to change the background color for each item in the table based on it’s value. i am using v4.0.0-beta.2.
may i ask how you got there? because i actually need to do the same for select and multiselect previews. and also adapt it to kirby v4. i cant find much about your solution in the plugin docs.
also it seems like the solution only works for the preview of structure fields, not for pages sections. any idea how to achieve this, too?
I’m glad it worked. Once again, please keep in mind extending core components is something you have to maintain in future versions. Especially if you don’t understand it fully it will almost certainly lead to some frustration.
And it’s true there’s not much information about this in the docs. This is the way I do it:
Use your web browser’s development tools to identify the component you’d like to extend. It will likely have a class name starting with k-.
Head to Kirby’s GitHub Repository and search for the name. (That’s because your installation of Kirby doesn’t include the panel’s source files.)
Write a plugin similar to the one above to extend the component. It’s advisable to not overwrite too many things, though.
For you use case it might make sense to have a look at the k-bubble component that is used all over the panel.
thank you so much, that helps a lot @thguenther! your approach is similar to what i was trying to do. hopefully the new /panel/lab playground will make our lives easier soon. and of course, i will be keeping an eye on the changelog when a new version is being published!
for anyone else trying to achieve this, i came up with an alternative version, where the k-bubbles component will be modified directly. maybe it will help someone someday.