I'm new to PW and have just been asked to solve a UX problem on an existing customer installation. There is a Repeater (Version 1.0.6) element (of Youtube videos), and you can arrange them as you see fit, and there is a button at the bottom to add a new video, which happens once a month. The customer is annoyed that the new item is added at the bottom and not at the top. They don't want to have to drag it to the top when the monthly update is due. UX wise, they have a point.
Now, I did find a solution in this forum, which involves CSS to be added to the parent element of all the videos:
element.style {
display: flex;
flex-direction: column-reverse;
}
This will put the button at the top and also display the new video at the top as required.
The problem is that there is a <div> element missing as a parent for just the videos.
Now my problem must be one of the most basic problems that there can possibly be in PW:
What are some ways (clean preferred, but will do dirty if necessary) to add this missing wrapper element that will allow me to include the CSS that will solve the problem?