From 779e18257235e1f5f3ab2784220fad6310345829 Mon Sep 17 00:00:00 2001
From: Antonis Lilis <antonis.lilis@automattic.com>
Date: Tue, 30 Jun 2020 15:50:41 +0300
Subject: [PATCH] Reduce spacing between label and slider control

---
 .../src/mobile/bottom-sheet/cellRowStyles.android.scss     | 6 ++++++
 .../src/mobile/bottom-sheet/cellRowStyles.ios.scss         | 6 ++++++
 .../src/mobile/bottom-sheet/range-cell.native.js           | 3 ++-
 .../src/mobile/bottom-sheet/range-cell.native.scss         | 7 -------
 4 files changed, 14 insertions(+), 8 deletions(-)
 create mode 100644 packages/components/src/mobile/bottom-sheet/cellRowStyles.android.scss
 create mode 100644 packages/components/src/mobile/bottom-sheet/cellRowStyles.ios.scss

diff --git a/packages/components/src/mobile/bottom-sheet/cellRowStyles.android.scss b/packages/components/src/mobile/bottom-sheet/cellRowStyles.android.scss
new file mode 100644
index 00000000000000..77b3be4d844fa8
--- /dev/null
+++ b/packages/components/src/mobile/bottom-sheet/cellRowStyles.android.scss
@@ -0,0 +1,6 @@
+.cellRowStyles {
+	min-height: 48px;
+	margin-bottom: -37px;
+	width: 100%;
+	justify-content: space-between;
+}
diff --git a/packages/components/src/mobile/bottom-sheet/cellRowStyles.ios.scss b/packages/components/src/mobile/bottom-sheet/cellRowStyles.ios.scss
new file mode 100644
index 00000000000000..bd76f06e7d1abd
--- /dev/null
+++ b/packages/components/src/mobile/bottom-sheet/cellRowStyles.ios.scss
@@ -0,0 +1,6 @@
+.cellRowStyles {
+	min-height: 48px;
+	margin-bottom: -27px;
+	width: 100%;
+	justify-content: space-between;
+}
diff --git a/packages/components/src/mobile/bottom-sheet/range-cell.native.js b/packages/components/src/mobile/bottom-sheet/range-cell.native.js
index 96867a38630719..1cacba888e73c7 100644
--- a/packages/components/src/mobile/bottom-sheet/range-cell.native.js
+++ b/packages/components/src/mobile/bottom-sheet/range-cell.native.js
@@ -24,6 +24,7 @@ import { withPreferredColorScheme } from '@wordpress/compose';
  */
 import Cell from './cell';
 import styles from './range-cell.scss';
+import rowStyles from './cellRowStyles.scss';
 import borderStyles from './borderStyles.scss';
 
 class BottomSheetRangeCell extends Component {
@@ -179,7 +180,7 @@ class BottomSheetRangeCell extends Component {
 			<Cell
 				{ ...cellProps }
 				cellContainerStyle={ styles.cellContainerStyles }
-				cellRowContainerStyle={ styles.cellRowStyles }
+				cellRowContainerStyle={ rowStyles.cellRowStyles }
 				accessibilityRole={ 'none' }
 				value={ '' }
 				editable={ false }
diff --git a/packages/components/src/mobile/bottom-sheet/range-cell.native.scss b/packages/components/src/mobile/bottom-sheet/range-cell.native.scss
index 21a7051d20ced9..c98f9013c85cee 100644
--- a/packages/components/src/mobile/bottom-sheet/range-cell.native.scss
+++ b/packages/components/src/mobile/bottom-sheet/range-cell.native.scss
@@ -31,10 +31,3 @@
 	flex-direction: column;
 	align-items: flex-start;
 }
-
-.cellRowStyles {
-	min-height: 48px;
-	margin-bottom: -13px;
-	width: 100%;
-	justify-content: space-between;
-}