From f424e2b9148cf0eae710113f6be671647ed022dc Mon Sep 17 00:00:00 2001
From: Florian Hotze <dev@florianhotze.com>
Date: Tue, 31 Dec 2024 16:52:12 +0100
Subject: [PATCH] Layout pages: Safe area fixes & related code improvements
 (#2959)

Signed-off-by: Florian Hotze <dev@florianhotze.com>
---
 .../web/src/components/widgets/standard/oh-card.vue    |  9 ---------
 bundles/org.openhab.ui/web/src/css/app.styl            | 10 +---------
 bundles/org.openhab.ui/web/src/css/nomini.css          |  4 +++-
 3 files changed, 4 insertions(+), 19 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/components/widgets/standard/oh-card.vue b/bundles/org.openhab.ui/web/src/components/widgets/standard/oh-card.vue
index 860f7c2ad..0e22ebc7e 100644
--- a/bundles/org.openhab.ui/web/src/components/widgets/standard/oh-card.vue
+++ b/bundles/org.openhab.ui/web/src/components/widgets/standard/oh-card.vue
@@ -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'
diff --git a/bundles/org.openhab.ui/web/src/css/app.styl b/bundles/org.openhab.ui/web/src/css/app.styl
index d82e2f545..bb03fe245 100644
--- a/bundles/org.openhab.ui/web/src/css/app.styl
+++ b/bundles/org.openhab.ui/web/src/css/app.styl
@@ -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.
diff --git a/bundles/org.openhab.ui/web/src/css/nomini.css b/bundles/org.openhab.ui/web/src/css/nomini.css
index 93c44cb2e..3634e0423 100644
--- a/bundles/org.openhab.ui/web/src/css/nomini.css
+++ b/bundles/org.openhab.ui/web/src/css/nomini.css
@@ -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;