Styled divider

src/views/Wallet/components/LeftNavigation/components/CoinMenu/index.js

@@ -44,8 +44,7 @@ class CoinMenu extends Component {
                 <Divider
                     textLeft="Other coins"
                     textRight="(You will be redirected)"
-                    borderTop
+                    hasBorder
-                    borderBottom
                 />
                 {coins.map(coin => (
                     <a key={coin.url} href={coin.url}>

src/views/Wallet/components/LeftNavigation/components/Divider/index.js

@@ -12,20 +12,16 @@ const Wrapper = styled.div`
     font-size: ${FONT_SIZE.SMALLER};
     color: ${colors.TEXT_SECONDARY};
     background: ${colors.LANDING};
-    ${props => props.borderTop && css`
+    ${props => props.hasBorder && css`
-        border-top: 1px solid ${colors.DIVIDER};
+        border: 1px solid ${colors.BODY};
-    `}
-    ${props => props.borderBottom && css`
-        border-bottom: 1px solid ${colors.DIVIDER};
     `}
 `;
 
 const Divider = ({
-    textLeft, textRight, borderTop = false, borderBottom = false,
+    textLeft, textRight, hasBorder = false,
 }) => (
     <Wrapper
-        borderTop={borderTop}
+        hasBorder={hasBorder}
-        borderBottom={borderBottom}
     >
         <p>{textLeft}</p>
         <p>{textRight}</p>
@@ -35,8 +31,7 @@ const Divider = ({
 Divider.propTypes = {
     textLeft: PropTypes.string,
     textRight: PropTypes.string,
-    borderTop: PropTypes.bool,
+    hasBorder: PropTypes.bool,
-    borderBottom: PropTypes.bool,
 };
 
 export default Divider;

src/views/Wallet/components/LeftNavigation/components/StickyContainer/index.js

@@ -22,11 +22,9 @@ const AsideWrapper = styled.aside`
     min-width: 320px;
     overflow: hidden;
     background: ${colors.MAIN};
-    border-right: 1px solid ${colors.DIVIDER};
 
     .fixed {
         position: fixed;
-        border-right: 1px solid ${colors.DIVIDER};
     }
 
     .fixed-bottom {
@@ -35,7 +33,6 @@ const AsideWrapper = styled.aside`
             position: fixed;
             bottom: 0;
             background: ${colors.MAIN};
-            border-right: 1px solid ${colors.DIVIDER};
         }
     }
 `;

src/views/Wallet/components/LeftNavigation/index.js

@@ -28,7 +28,6 @@ const Footer = styled.div`
     width: 320px;
     bottom: 0;
     background: ${colors.MAIN};
-    border-right: 1px solid ${colors.DIVIDER};
 `;
 
 const Body = styled.div`
@@ -42,7 +41,7 @@ const Help = styled.div`
     text-align: center;
     width: 319px;
     padding: 8px 0px;
-    border-top: 1px solid ${colors.DIVIDER};
+    border-top: 1px solid ${colors.BACKGROUND};
 `;
 
 const A = styled.a`