I’ve played around with f7 a little bit now and made some progress. Using it, the above mentioned problem of vertical alignment doesn’t appear anymore.
However, for some reason it starts a new column:
component: oh-list-card
config:
title: Titel
slots:
default:
- component: f7-card-content
slots:
default:
- component: f7-row
config:
class:
- align-items-left
slots:
default:
- component: f7-col
config:
class:
- align-items-left
slots: {}
- component: oh-list-item
config:
class:
- align-items-left
icon: oh:network
iconUseState: true
item: BennetPC_Online
- component: f7-col
config: {}
slots:
default:
- component: oh-list-item
config:
class:
- align-items-left
listButton: true
action: popup
title: Bennet-PC
actionModal: page:z_BennetPC_Online
- component: f7-col
config:
class:
- align-items-left
slots:
default:
- component: oh-label-item
config:
item: BennetPC_Zuletztgesehen
My other problem is the accordion:
when I copy the code above in your accordion example (replace one item), it doesn’t work any more:
component: oh-list-card
config:
title: This is just the card title not the list widget
accordionList: true
slots:
default:
- component: oh-list-item
config:
title: At least one list item must be visible for the list widget to be drawn
slots:
accordion:
- component: oh-list
config: {}
slots:
? default
- component: f7-card-content
slots:
default:
- component: f7-row
config:
class:
- align-items-left
slots:
default:
- component: f7-col
config:
class:
- align-items-left
slots: {}
- component: oh-list-item
config:
class:
- align-items-left
icon: oh:network
iconUseState: true
item: BennetPC_Online
- component: f7-col
config: {}
slots:
default:
- component: oh-list-item
config:
class:
- align-items-left
listButton: true
action: popup
title: Bennet-PC
actionModal: page:z_BennetPC_Online
- component: f7-col
config:
class:
- align-items-left
slots:
default:
- component: oh-label-item
config:
item: BennetPC_Zuletztgesehen
- component: oh-list-item
config:
title: B
- component: oh-list-item
config:
title: C
- component: oh-list
config:
accordionList: true
thisDoesNotWork: This list is not rendered because it has no child items and
there is nothing to show
- component: oh-list
config:
accordionList: true
slots:
default:
- component: oh-list-item
config:
title: But you can nest accordions lists as long as there are items to be drawn
slots:
accordion:
- component: oh-list
config: {}
slots:
default:
- component: oh-list-item
config:
title: E
- component: oh-list-item
config:
title: F
- component: oh-list-item
config:
title: G
Do you have an explanation/solution for me (again 
)?