Repository navigation
iOS: sheet modal misses top margin when having toolbar #4370
Description
- Framework7 version: 9.0.3
- Platform and Target: Chrome Browser, PWA/WebApp in iOS style mode
Describe the bug
When adding a bottom sheet with a toolbar at the top, the iOS layout misses a top margin, see the screenshot and code below.
To Reproduce
Steps to reproduce the behavior:
- Create a new Framework7 app
- Add a bottom sheet
- Add a toolbar
- See error on iOS theme
Expected behavior
I expect both themes to show toolbar properly.
Actual Behavior
While Android works fine, iOS theme shows missing top margin.
Screenshots
iOS theme:
MD theme:
Additional context
The HTML markup used is as follows:
<template>
<div class="sheet-modal height-auto">
<div class="toolbar">
<div class="toolbar-inner">
<div class="left margin-left-half">Neuen Ort erstellen</div>
<div class="right">
<a class="link" @click="${discardLocation}">Abbrechen</a>
</div>
</div>
</div>
<div class="sheet-modal-inner">
<div class="page-content">
<!-- <div class="block-title">Neuen Ort erstellen</div> -->
<form class="form-store-data" id="formLocationEdit">
<div class="list list-strong-ios list-dividers-ios inset-ios margin-top-half margin-bottom-half">
<ul>
<li class="item-content item-input item-input-with-info">
<div class="item-inner">
<div class="item-input-wrap">
<input type="text" placeholder="Hallen- oder Raum-Name" name="locName" required validate />
<span class="input-clear-button"></span>
<div class="item-input-info">Name des Ortes</div>
</div>
</div>
</li>
<li class="item-content item-input item-input-with-info">
<div class="item-inner">
<div class="item-input-wrap">
<input type="text" placeholder="Musterstr. 12" name="locStreet" required validate />
<span class="input-clear-button"></span>
<div class="item-input-info">Straße und Hausnummer</div>
</div>
</div>
</li>
</ul>
</div>
Activity
nolimits4web commentedon May 19, 2026
This issue was incorrectly closed on 2026-05-19 by a compromised credential (Shai-Hulud npm supply-chain worm). Reopening — apologies for the noise.
fix(sheet): reserve toolbar space in default bottom sheets