Rewrite sass styling MX8 listviews

0
We are busy upgrading from MX7 to MX8 and this is mainly in the custom styling. I came across a problem where we want to hide a link button if it is the first or the last item in a list. Since the classes for listviews have changed, this doesn't work anymore and I can't get it to work by rewriting based on the documentation. This is the code: .mx-listview-item:first-child .hide-if-first-in-list, .mx-listview-item:last-child .hide-if-last-in-list { opacity: 0; pointer-events: none; } @for $i from 1 through 5 { .mx-listview.hide-id#{$i}>.mx-listview-list>.mx-listview-item:first-child .hide-if-first-in-list-id#{$i}, .mx-listview.hide-id#{$i}>.mx-listview-list>.mx-listview-item:last-child .hide-if-last-in-list-id#{$i} { opacity: 0; pointer-events: none; } } mx-listview-list and mx-listview-item don't exist anymore. Documentation says to rewrite it like .mx-listview li, but we do a lot of things here and just replacing the last bit with li doesn't seem to work. Anyone a clue how to rewrite this?   Thanks in advance!
asked
1 answers
1

I quickly checked how we do something similar and I think you need something like: 

.mx-listview > ul > li:first-child{
  //something specific for the first child
}

The rest looks a bit complex just to hide a button in case it is the first or last child but I do not know the context enough of course.

 

answered