responsive footer

This commit is contained in:
Barry Gitarts 2019-11-22 11:45:34 -05:00 committed by Barry G
parent a37e01a9e8
commit e36a764256
1 changed files with 20 additions and 5 deletions

View File

@ -10,13 +10,18 @@ import classNames from 'classnames'
import Typography from '@material-ui/core/Typography'
import { Divider} from '@material-ui/core'
const style = () => ({
const style = ({
breakpoints: { up }
}) => ({
main: {
display: 'grid',
gridTemplateColumns: 'repeat(48, [col] 1fr)',
gridTemplateRows: '4rem 3rem repeat(4, 2rem) 4rem',
gridTemplateRows: 'repeat(4, 4rem) repeat(4, 2rem)',
height: '12rem',
marginTop: '5rem',
[up('md')]: {
gridTemplateRows: '4rem 3rem repeat(4, 2rem) 4rem'
}
},
assemble: {
width: '2.5em',
@ -46,10 +51,16 @@ const style = () => ({
gridColumn: '6 / 42'
},
middle: {
gridColumn: '6 / 10',
[up('md')]: {
gridColumn: '18 / 21',
}
},
midRight: {
gridColumn: '34 / 42',
[up('md')]: {
gridColumn: '25 / 32'
}
},
end: {
gridColumn: '34 / 42',
@ -61,9 +72,13 @@ const style = () => ({
height: '2.2rem'
},
header: {
[up('md')]: {
gridRow: 2
},
fontSize: '17px',
fontWeight: 'bold',
color: '#172348'
color: '#172348',
gridRow: 4
},
text: {
color: '#5C667D',