From 7c1fffbb43f2f781daf84e3f94389b083f959723 Mon Sep 17 00:00:00 2001
From: Mozafar Haider <mozafar@dhis2.org>
Date: Mon, 3 Jun 2024 10:40:52 +0100
Subject: [PATCH] fix: manual updates for css logical properties

using css2logical tool
---
 src/components/Layout/styles/Chip.module.css  | 30 ++++++++++++----
 .../styles/OutlierTablePlugin.module.css      | 35 +++++++++++++++----
 2 files changed, 52 insertions(+), 13 deletions(-)

diff --git a/src/components/Layout/styles/Chip.module.css b/src/components/Layout/styles/Chip.module.css
index 9f79bd3097..e9a938bb4a 100644
--- a/src/components/Layout/styles/Chip.module.css
+++ b/src/components/Layout/styles/Chip.module.css
@@ -36,11 +36,17 @@
 }
 
 .fixedDimensionIcon {
-    padding: 0 4px;
+    padding-block-start: 0;
+    padding-block-end: 0;
+    padding-inline-start: 4px;
+    padding-inline-end: 4px;
 }
 
 .leftIconWrapper {
-    padding: 0 4px;
+    padding-block-start: 0;
+    padding-block-end: 0;
+    padding-inline-start: 4px;
+    padding-inline-end: 4px;
     display: flex;
     align-items: center;
 }
@@ -55,8 +61,14 @@
 .lockIconWrapper {
     background: #cbe7e5;
     block-size: 20px;
-    padding: 0 2px 0 3px;
-    margin: 0 0 0 2px;
+    padding-block-start: 0;
+    padding-block-end: 0;
+    padding-inline-start: 3px;
+    padding-inline-end: 2px;
+    margin-block-start: 0;
+    margin-block-end: 0;
+    margin-inline-start: 2px;
+    margin-inline-end: 0;
     display: flex;
     align-items: center;
     justify-content: center;
@@ -89,7 +101,10 @@
     border-end-end-radius: 0px;
     align-items: center;
     min-block-size: 20px;
-    margin: 0 2px 0 0;
+    margin-block-start: 0;
+    margin-block-end: 0;
+    margin-inline-start: 0;
+    margin-inline-end: 2px;
 }
 
 .chipRight {
@@ -112,7 +127,10 @@
     margin-inline-start: 4px;
     min-inline-size: 12px;
     text-align: center;
-    padding: 2px 2px 1px 2px;
+    padding-block-start: 2px;
+    padding-block-end: 1px;
+    padding-inline-start: 2px;
+    padding-inline-end: 2px;
     overflow: hidden;
     white-space: nowrap;
     text-overflow: ellipsis;
diff --git a/src/components/VisualizationPlugin/styles/OutlierTablePlugin.module.css b/src/components/VisualizationPlugin/styles/OutlierTablePlugin.module.css
index 46a6d19914..f86e5c7023 100644
--- a/src/components/VisualizationPlugin/styles/OutlierTablePlugin.module.css
+++ b/src/components/VisualizationPlugin/styles/OutlierTablePlugin.module.css
@@ -3,7 +3,10 @@
     gap: var(--spacers-dp4);
     min-inline-size: 0;
     inline-size: 100%;
-    margin: 0 var(--spacers-dp4) var(--spacers-dp4);
+    margin-block-start: 0;
+    margin-block-end: var(--spacers-dp4);
+    margin-inline-start: var(--spacers-dp4);
+    margin-inline-end: var(--spacers-dp4);
 }
 .visualizationContainer {
     display: flex;
@@ -28,13 +31,22 @@
     line-height: 12px;
 }
 .dataTable .headerCell.sizeComfortable {
-    padding: 8px 4px 6px 8px;
+    padding-block-start: 8px;
+    padding-block-end: 6px;
+    padding-inline-start: 8px;
+    padding-inline-end: 4px;
 }
 .dataTable .headerCell.sizeNormal {
-    padding: 4px 4px 2px 6px;
+    padding-block-start: 4px;
+    padding-block-end: 2px;
+    padding-inline-start: 6px;
+    padding-inline-end: 4px;
 }
 .dataTable .headerCell.sizeCompact {
-    padding: 3px 2px 1px 6px;
+    padding-block-start: 3px;
+    padding-block-end: 1px;
+    padding-inline-start: 6px;
+    padding-inline-end: 2px;
 }
 
 /* Table body cells in various sizes */
@@ -54,11 +66,20 @@
     white-space: nowrap;
 }
 .dataTable .cell.sizeComfortable {
-    padding: 10px 8px 8px;
+    padding-block-start: 10px;
+    padding-block-end: 8px;
+    padding-inline-start: 8px;
+    padding-inline-end: 8px;
 }
 .dataTable .cell.sizeNormal {
-    padding: 7px 6px 5px;
+    padding-block-start: 7px;
+    padding-block-end: 5px;
+    padding-inline-start: 6px;
+    padding-inline-end: 6px;
 }
 .dataTable .cell.sizeCompact {
-    padding: 6px 6px 4px;
+    padding-block-start: 6px;
+    padding-block-end: 4px;
+    padding-inline-start: 6px;
+    padding-inline-end: 6px;
 }