All files / components/card card.styled.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
import styled from 'styled-components'
 
const CardStyled = styled.div`
  position: relative;
  width: ${props => props.width};
  border-radius: 2px;
  padding-top: 2px;
  display: flex;
  flex-flow: column;
  border: solid 1px #e1e3e7;
  box-sizing: border-box;
 
  ${p => p.withBorder && `
      box-shadow: inset 0 2px 0 0 #afcef3;
 
      &.danger{
        box-shadow: inset 0 2px 0 0 #de4246;
      }
 
      &.warning{
        box-shadow: inset 0 2px 0 0 #ffc907;
      }
 
      &.success{
        box-shadow: inset 0 2px 0 0 #8cc152;
      }
 
      &.custom{
        box-shadow: inset 0 2px 0 0 ${p => p.color};
        background:red;
      }
  `}
`
 
CardStyled.defaultProps = {
  width: '360px'
}
 
export default CardStyled