| 1 | const baseStyle = {
|
| 2 | height: '50px',
|
| 3 | width: '240px',
|
| 4 | border: 'none',
|
| 5 | textAlign: 'center',
|
| 6 | verticalAlign: 'center',
|
| 7 | boxShadow: '0 2px 4px 0 rgba(0,0,0,.25)',
|
| 8 | fontSize: '16px',
|
| 9 | lineHeight: '48px',
|
| 10 | display: 'block',
|
| 11 | borderRadius: '1px',
|
| 12 | transition: 'background-color .218s, border-color .218s, box-shadow .218s',
|
| 13 | fontFamily: 'Roboto,arial,sans-serif',
|
| 14 | cursor: 'pointer',
|
| 15 | userSelect: 'none'
|
| 16 | }
|
| 17 |
|
| 18 | export const darkStyle = {
|
| 19 | backgroundColor: '#4285f4',
|
| 20 | color: '#fff',
|
| 21 | ...baseStyle
|
| 22 | }
|
| 23 |
|
| 24 | export const lightStyle = {
|
| 25 | backgroundColor: '#fff',
|
| 26 | color: 'rgba(0,0,0,.54)',
|
| 27 | ...baseStyle
|
| 28 | }
|
| 29 |
|
| 30 | export const iconStyle = {
|
| 31 | width: '48px',
|
| 32 | height: '48px',
|
| 33 | textAlign: 'center',
|
| 34 | verticalAlign: 'center',
|
| 35 | display: 'block',
|
| 36 | marginTop: '1px',
|
| 37 | marginLeft: '1px',
|
| 38 | float: 'left',
|
| 39 | backgroundColor: '#fff',
|
| 40 | borderRadius: '1px',
|
| 41 | whiteSpace: 'nowrap'
|
| 42 | }
|
| 43 |
|
| 44 | export const svgStyle = {
|
| 45 | width: '48px',
|
| 46 | height: '48px',
|
| 47 | display: 'block'
|
| 48 | }
|
| 49 |
|
| 50 | export const hoverStyle = {
|
| 51 | boxShadow: '0 0 3px 3px rgba(66,133,244,.3)',
|
| 52 | transition: 'background-color .218s, border-color .218s, box-shadow .218s'
|
| 53 | }
|
| 54 |
|
| 55 |
|
| 56 |
|
| 57 |
|
| 58 |
|
| 59 | export const disabledStyle = {
|
| 60 | backgroundColor: 'rgba(37, 5, 5, .08)',
|
| 61 | color: 'rgba(0, 0, 0, .40)',
|
| 62 | cursor: 'not-allowed'
|
| 63 | }
|
| 64 |
|
| 65 | export const disabledIconStyle = {
|
| 66 | backgroundColor: 'transparent'
|
| 67 | }
|