Browse Source
Grey border for passed steps, and remove weird left border
master
meriadec
7 years ago
No known key found for this signature in database
GPG Key ID: 1D2FC2305E2CB399
1 changed files with
1 additions and
14 deletions
-
src/components/DeviceInteraction/components.js
|
|
@ -26,7 +26,7 @@ export const DeviceInteractionStepContainer = styled(Box).attrs({ |
|
|
|
min-height: 80px; |
|
|
|
border: 1px solid ${p => p.theme.colors.fog}; |
|
|
|
border-color: ${p => |
|
|
|
p.isError ? p.theme.colors.alertRed : p.isActive || p.isSuccess ? p.theme.colors.wallet : ''}; |
|
|
|
p.isError ? p.theme.colors.alertRed : p.isActive ? p.theme.colors.wallet : ''}; |
|
|
|
border-top-color: ${p => (p.isFirst || p.isActive ? '' : 'transparent')}; |
|
|
|
border-bottom-color: ${p => (p.isPrecedentActive ? 'transparent' : '')}; |
|
|
|
border-bottom-left-radius: ${p => (p.isLast ? `${radii[1]}px` : 0)}; |
|
|
@ -39,19 +39,6 @@ export const DeviceInteractionStepContainer = styled(Box).attrs({ |
|
|
|
${rgba(p.isError ? p.theme.colors.alertRed : p.theme.colors.wallet, 0.2)} 0 0 3px 2px |
|
|
|
` |
|
|
|
: 'none'}; |
|
|
|
|
|
|
|
&:after { |
|
|
|
content: ''; |
|
|
|
position: absolute; |
|
|
|
left: -2px; |
|
|
|
top: 0; |
|
|
|
bottom: 0; |
|
|
|
width: 2px; |
|
|
|
box-shadow: ${p => |
|
|
|
p.isActive && !p.isSuccess |
|
|
|
? `${p.theme.colors[p.isError ? 'alertRed' : 'wallet']} 2px 0 0` |
|
|
|
: 'none'}; |
|
|
|
} |
|
|
|
` |
|
|
|
|
|
|
|
export const IconContainer = ({ children }: { children: any }) => ( |
|
|
|