Fix cell align when isSelected is used. (#21227)

WordPress · Mar 30, 2020 · 4ed16bb · 4ed16bb
1 parent 1722dbf
commit 4ed16bb
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 7 deletions.
diff --git a/packages/components/src/mobile/bottom-sheet/cell.native.js b/packages/components/src/mobile/bottom-sheet/cell.native.js
@@ -130,7 +130,7 @@ class BottomSheetCell extends Component {
  ? cellLabelLeftAlignNoIconStyle
  : cellLabelCenteredStyle;
  const defaultLabelStyle =
- showValue || customActionButton
+ showValue || customActionButton || icon
  ? cellLabelStyle
  : defaultMissingIconAndValue;
 
@@ -319,12 +319,6 @@ class BottomSheetCell extends Component {
  <Text style={ [ defaultLabelStyle, labelStyle ] }>
  { label }
  </Text>
- { isSelected && (
- <Icon
- icon={ check }
- fill={ platformStyles.isSelected.color }
- />
- ) }
  </View>
  { customActionButton && (
  <TouchableOpacity
@@ -337,6 +331,12 @@ class BottomSheetCell extends Component {
  </TouchableOpacity>
  ) }
  </View>
+ { isSelected && (
+ <Icon
+ icon={ check }
+ fill={ platformStyles.isSelected.color }
+ />
+ ) }
  { showValue && getValueComponent() }
  { children }
  </View>

diff --git a/packages/components/src/mobile/bottom-sheet/styles.native.scss b/packages/components/src/mobile/bottom-sheet/styles.native.scss
@@ -93,6 +93,7 @@
  flex-direction: row;
  min-height: 48;
  align-items: center;
+ justify-content: space-between;
 }
 
 .clipToBounds {