diff --git a/src/components/MainSideBar/AddAccountButton.js b/src/components/MainSideBar/AddAccountButton.js index 1646fe6f..32a61434 100644 --- a/src/components/MainSideBar/AddAccountButton.js +++ b/src/components/MainSideBar/AddAccountButton.js @@ -11,7 +11,6 @@ import { rgba } from 'styles/helpers' const PlusWrapper = styled(Tabbable).attrs({ p: 1, - cursor: 'default', borderRadius: 1, })` color: ${p => p.theme.colors.smoke}; diff --git a/src/components/ManagerPage/AppSearchBar.js b/src/components/ManagerPage/AppSearchBar.js index f1631991..2a1685b9 100644 --- a/src/components/ManagerPage/AppSearchBar.js +++ b/src/components/ManagerPage/AppSearchBar.js @@ -1,6 +1,7 @@ // @flow import React, { PureComponent, Fragment } from 'react' +import styled from 'styled-components' import type { LedgerScriptParams } from 'helpers/common' @@ -12,6 +13,15 @@ import Search from 'components/base/Search' import SearchIcon from 'icons/Search' import CrossIcon from 'icons/Cross' +const CrossContainer = styled(Box).attrs({ + justify: 'center', + px: 3, +})` + &:hover { + color: ${p => p.theme.colors.dark}; + } +` + type Props = { list: Array, children: (list: Array) => React$Node, @@ -43,7 +53,7 @@ class AppSearchBar extends PureComponent { const { children, list } = this.props const { query, focused } = this.state - const color = focused ? 'black' : 'grey' + const color = focused ? 'dark' : 'grey' return ( @@ -56,15 +66,15 @@ class AppSearchBar extends PureComponent { onBlur={this.handleFocus(false)} placeholder={'Search app'} renderLeft={ - - + + } renderRight={ query ? ( - + - + ) : null } /> diff --git a/src/components/Onboarding/index.js b/src/components/Onboarding/index.js index a13f99e1..557567bc 100644 --- a/src/components/Onboarding/index.js +++ b/src/components/Onboarding/index.js @@ -110,7 +110,6 @@ const CloseContainer = styled(Box).attrs({ p: 4, color: 'fog', })` - cursor: initial; position: absolute; top: 0; right: 0; diff --git a/src/components/Onboarding/steps/Finish.js b/src/components/Onboarding/steps/Finish.js index 4cb6ee93..1618abad 100644 --- a/src/components/Onboarding/steps/Finish.js +++ b/src/components/Onboarding/steps/Finish.js @@ -125,7 +125,7 @@ type SocMed = { } const StyledBox = styled(Box)` - cursor: default; + cursor: default; // this here needs reset because it inherits from cursor: text from parent &:hover { color: ${p => lighten(p.theme.colors.grey, 0.1)}; } diff --git a/src/components/Onboarding/steps/Init.js b/src/components/Onboarding/steps/Init.js index dd243081..362c2463 100644 --- a/src/components/Onboarding/steps/Init.js +++ b/src/components/Onboarding/steps/Init.js @@ -117,7 +117,6 @@ const InitCardContainer = styled(Box).attrs({ horizontal: true, borderRadius: '4px', })` - cursor: initial; border: 1px solid ${p => p.theme.colors.fog}; width: 530px; height: 70px; diff --git a/src/components/Onboarding/steps/SelectDevice.js b/src/components/Onboarding/steps/SelectDevice.js index b6ac1f5a..9676937c 100644 --- a/src/components/Onboarding/steps/SelectDevice.js +++ b/src/components/Onboarding/steps/SelectDevice.js @@ -95,7 +95,7 @@ const DeviceContainer = styled(Box).attrs({ height: 204px; border: ${props => `1px solid ${props.theme.colors[props.isActive ? 'wallet' : 'fog']}`}; &:hover { - cursor: initial; + cursor: default; // this here needs reset because it inherits from cursor: text from parent background: ${p => rgba(p.theme.colors.wallet, 0.04)}; } ` diff --git a/src/components/OperationsList/Operation.js b/src/components/OperationsList/Operation.js index 308a91e7..55539ed1 100644 --- a/src/components/OperationsList/Operation.js +++ b/src/components/OperationsList/Operation.js @@ -17,7 +17,6 @@ const OperationRow = styled(Box).attrs({ horizontal: true, alignItems: 'center', })` - cursor: initial; border-bottom: 1px solid ${p => p.theme.colors.lightGrey}; height: 68px; opacity: ${p => (p.isOptimistic ? 0.5 : 1)}; diff --git a/src/components/TopBar/ItemContainer.js b/src/components/TopBar/ItemContainer.js index 5513056b..2842a14e 100644 --- a/src/components/TopBar/ItemContainer.js +++ b/src/components/TopBar/ItemContainer.js @@ -10,7 +10,7 @@ export default styled(Tabbable).attrs({ px: 3, ml: 0, alignItems: 'center', - cursor: 'default', + cursor: p => (p.disabled ? 'not-allowed' : 'default'), horizontal: true, borderRadius: 1, })` diff --git a/src/components/base/AccountsList/AccountRow.js b/src/components/base/AccountsList/AccountRow.js index cc9ac64b..56216672 100644 --- a/src/components/base/AccountsList/AccountRow.js +++ b/src/components/base/AccountsList/AccountRow.js @@ -121,7 +121,6 @@ const AccountRowContainer = styled(Tabbable).attrs({ })` height: 48px; border-radius: 4px; - cursor: initial; opacity: ${p => (p.isDisabled ? 0.5 : 1)}; pointer-events: ${p => (p.isDisabled ? 'none' : 'auto')}; diff --git a/src/components/base/Button/index.js b/src/components/base/Button/index.js index 303ebc5a..4bf4839e 100644 --- a/src/components/base/Button/index.js +++ b/src/components/base/Button/index.js @@ -168,7 +168,7 @@ const Base = styled.button.attrs({ ${fontFamily}; border: none; border-radius: ${p => p.theme.radii[1]}px; - cursor: default; + cursor: ${p => (p.disabled ? 'not-allowed' : 'default')}; height: ${p => (p.small ? 34 : 40)}px; pointer-events: ${p => (p.disabled ? 'none' : '')}; outline: none; diff --git a/src/components/base/CopyWithFeedback.js b/src/components/base/CopyWithFeedback.js index 31fca50b..bbb29e59 100644 --- a/src/components/base/CopyWithFeedback.js +++ b/src/components/base/CopyWithFeedback.js @@ -66,7 +66,7 @@ const ClickableWrapper = styled(Box).attrs({ color: 'wallet', fontSize: 4, ff: 'Open Sans|SemiBold', - cursor: 'default', + cursor: 'default', // this here needs reset because it inherits from cursor: text from parent })` &:hover { color: ${p => lighten(p.theme.colors.wallet, 0.1)};