Layout pages: Safe area fixes & related code improvements (#2959)

Signed-off-by: Florian Hotze <dev@florianhotze.com>
pull/2963/head
Florian Hotze 2024-12-31 16:52:12 +01:00 committed by GitHub
parent 0706f3a2b7
commit f424e2b914
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 4 additions and 19 deletions

View File

@ -23,15 +23,6 @@
</f7-card>
</template>
<style lang="stylus">
// Fix safe-area issues where oh-card is used inside a block or masonry layout, where the safe areas are already respected by the parent block
.oh-col >
.oh-masonry-item >
.oh-card
margin-left var(--f7-card-margin-horizontal)
margin-right var(--f7-card-margin-horizontal)
</style>
<script>
import mixin from '../widget-mixin'
import { actionsMixin } from '@/components/widgets/widget-actions'

View File

@ -322,13 +322,5 @@ html
.item-inner
padding-right var(--f7-list-item-padding-horizontal)
// Fix safe area issues with oh-cell components, where safe areas are already respected by the wrapping oh-block
.oh-cell
margin-top var(--f7-card-expandable-margin-vertical)
margin-bottom var(--f7-card-expandable-margin-vertical)
margin-left var(--f7-card-expandable-margin-horizontal)
margin-right var(--f7-card-expandable-margin-horizontal)
// Fix safe area issues inside block-narrow, where safe areas are already respected by the wrapping block-narrow
// Fix is in nomini.css due to CssMinimizerPlugin minimizing app.styl and removing the unit px from 0px,
// Additional safe area fixes are in nomini.css due to CssMinimizerPlugin minimizing app.styl and removing the unit px from 0px,
// which breaks calculcations using the overwritten CSS variables.

View File

@ -1,6 +1,8 @@
/* CSS that shouldn't get minimized */
/* e.g. due to CssMinimizerPlugin removing unit from 0px, which breaks calculations */
.block-narrow {
/* Fix safe area issues inside block-narrow, oh-grid-cells, oh-grid-row & oh-masonry, where safe areas are already respected by component or its parents itself */
.block-narrow, .oh-cell, .oh-row, .oh-masonry-item {
--f7-safe-area-left: 0px;
--f7-safe-area-outer-left: 0px;
--f7-safe-area-right: 0px;