Losing divider among f7-list-item in some cases (F7Vue v8)

[stanleyxu2005]

I’m experiencing a weird visual bug in F7Vue v8.0.x.

The dividers will disappear, if related f7-list-item contains attribute link AND there is a f7-block-header before f7-list.

Workarounds

1. if I remove attribute link
2. if I change f7-block-header to f7-block-title
3. If I remove f7-block-header

Code snippet

    <f7-block-header>Settings</f7-block-header>
    <f7-list strong outline dividers>
      <f7-list-item :title="UseDarkTheme_Label" link @click="handleClick">
        <template #media>
          <f7-icon f7="circle_righthalf_fill" />
        </template>
      </f7-list-item>
      <f7-list-item :title="UseDarkTheme_Label" link @click="handleClick">
        <template #media>
          <f7-icon f7="circle_righthalf_fill" />
        </template>
      </f7-list-item>

I’m guessing some less rules might not generated correctly in combination of link and block-header

[stanleyxu2005]

It’s hard to explain, but I tracked down to the mixin .hairline()

If I remove this rule, the divider will come back.

.list-dividers .item-inner:after {
…
/* transform-origin: 50% 100%; */
}