Merge pull request #407 from reactioncommerce/236-machikoyasuda-fix-h…

…orizwrap fix(selectableitem): remove cascading div styling
reactioncommerce · Mar 22, 2019 · 5e6d761 · 5e6d761
2 parents a57ac76 + 046ae4a
commit 5e6d761
Show file tree

Hide file tree

Showing 3 changed files with 3 additions and 6 deletions.
diff --git a/package/src/components/SelectableItem/v1/SelectableItem.js b/package/src/components/SelectableItem/v1/SelectableItem.js
@@ -75,7 +75,8 @@ const StyledInput = styled.input`
 const StyledDetail = styled.div`
   ${addTypographyStyles("SelectableItemDetail", "bodyText")}
   align-items: center;
-  display: flex;
+  display: ${(props) => (props.isStacked ? "block" : "flex")};
+  height: auto;
   justify-content: ${(props) => (props.isStacked ? "flex-start" : "center")};
   margin-left: ${(props) => (props.isStacked ? applyTheme("SelectableList.stackedSpacingToLabel")(props) : "0")};
   margin-top: ${(props) => (props.isStacked ? applyTheme("SelectableList.stackedSpacingBelowLabel")(props) : "0")};

diff --git a/package/src/components/SelectableItem/v1/__snapshots__/SelectableItem.test.js.snap b/package/src/components/SelectableItem/v1/__snapshots__/SelectableItem.test.js.snap
@@ -118,6 +118,7 @@ exports[`basic snapshot with empty props 1`] = `
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
+  height: auto;
   -webkit-box-pack: center;
   -webkit-justify-content: center;
   -ms-flex-pack: center;

diff --git a/package/src/components/SelectableList/v1/SelectableList.js b/package/src/components/SelectableList/v1/SelectableList.js
@@ -109,11 +109,6 @@ const HorizontalWrapper = styled.div`
   &:last-of-type {
     padding-left: ${applyTheme("SelectableList.horizontalLastItemPaddingLeft")};
   }
-
-  div {
-    display: block;
-    height: auto;
-  }
 `;
 
 class SelectableList extends Component {