2019-03-27 22:39:25 +01:00
|
|
|
import { Theme, createStyles } from "@material-ui/core";
|
|
|
|
|
|
|
|
export const styles = (theme: Theme) => createStyles({
|
|
|
|
root: {
|
|
|
|
width: '100%',
|
|
|
|
display: 'flex',
|
|
|
|
height: '100%'
|
|
|
|
},
|
|
|
|
pageLayoutConstraints: {
|
|
|
|
marginTop: 72,
|
|
|
|
flexGrow: 1,
|
|
|
|
padding: theme.spacing.unit * 3,
|
2019-04-19 21:26:22 +02:00
|
|
|
paddingLeft: theme.spacing.unit,
|
|
|
|
paddingRight: theme.spacing.unit,
|
2019-03-27 22:39:25 +01:00
|
|
|
[theme.breakpoints.up('md')]: {
|
|
|
|
marginLeft: 250,
|
|
|
|
marginTop: 88,
|
|
|
|
paddingLeft: theme.spacing.unit * 24,
|
|
|
|
paddingRight: theme.spacing.unit * 24
|
|
|
|
},
|
|
|
|
},
|
2019-03-30 22:13:49 +01:00
|
|
|
pageLayoutMaxConstraints: {
|
|
|
|
marginTop: 72,
|
|
|
|
flexGrow: 1,
|
|
|
|
paddingTop: theme.spacing.unit * 2,
|
|
|
|
padding: theme.spacing.unit,
|
|
|
|
[theme.breakpoints.up('md')]: {
|
|
|
|
marginLeft: 250,
|
|
|
|
marginTop: 88,
|
|
|
|
padding: theme.spacing.unit * 3,
|
|
|
|
paddingLeft: theme.spacing.unit * 16,
|
|
|
|
paddingRight: theme.spacing.unit * 16,
|
|
|
|
},
|
|
|
|
[theme.breakpoints.up('lg')]: {
|
2019-03-31 03:20:55 +02:00
|
|
|
marginLeft: 250,
|
|
|
|
marginTop: 88,
|
|
|
|
padding: theme.spacing.unit * 3,
|
|
|
|
paddingLeft: theme.spacing.unit * 32,
|
|
|
|
paddingRight: theme.spacing.unit * 32,
|
|
|
|
},
|
|
|
|
[theme.breakpoints.up('xl')]: {
|
2019-03-30 22:13:49 +01:00
|
|
|
marginLeft: 250,
|
|
|
|
marginTop: 88,
|
|
|
|
padding: theme.spacing.unit * 3,
|
|
|
|
paddingLeft: theme.spacing.unit * 40,
|
|
|
|
paddingRight: theme.spacing.unit * 40,
|
|
|
|
},
|
|
|
|
},
|
2019-03-28 21:46:19 +01:00
|
|
|
pageLayoutMinimalConstraints: {
|
|
|
|
flexGrow: 1,
|
|
|
|
[theme.breakpoints.up('md')]: {
|
|
|
|
marginLeft: 250,
|
|
|
|
},
|
|
|
|
},
|
|
|
|
pageHeroBackground: {
|
|
|
|
position: 'relative',
|
2019-03-30 22:13:49 +01:00
|
|
|
height: 'intrinsic',
|
2019-03-28 21:46:19 +01:00
|
|
|
backgroundColor: theme.palette.primary.dark,
|
|
|
|
width: '100%',
|
|
|
|
color: theme.palette.common.white,
|
|
|
|
zIndex: 1
|
|
|
|
},
|
|
|
|
pageHeroBackgroundImage: {
|
|
|
|
position: 'absolute',
|
|
|
|
bottom: 0,
|
|
|
|
left: 0,
|
|
|
|
backgroundPosition: 'center',
|
|
|
|
backgroundRepeat: 'no-repeat',
|
|
|
|
backgroundSize: 'cover',
|
|
|
|
height: '100%',
|
|
|
|
width: '100%',
|
|
|
|
opacity: 0.40,
|
|
|
|
zIndex: -1
|
|
|
|
},
|
|
|
|
pageHeroContent: {
|
|
|
|
padding: 16,
|
|
|
|
paddingTop: 116,
|
|
|
|
textAlign: 'center',
|
|
|
|
width: '100%',
|
|
|
|
height: '100%',
|
|
|
|
[theme.breakpoints.up('md')]: {
|
|
|
|
paddingLeft: '25%',
|
|
|
|
paddingRight: '25%',
|
|
|
|
},
|
|
|
|
zIndex: 1
|
|
|
|
},
|
2019-03-27 22:39:25 +01:00
|
|
|
pageListConstraints: {
|
|
|
|
paddingLeft: theme.spacing.unit,
|
|
|
|
paddingRight: theme.spacing.unit,
|
|
|
|
[theme.breakpoints.up('sm')]: {
|
|
|
|
paddingLeft: theme.spacing.unit * 2,
|
|
|
|
paddingRight: theme.spacing.unit * 2
|
|
|
|
}
|
2019-03-28 21:46:19 +01:00
|
|
|
},
|
|
|
|
pageProfileAvatar: {
|
|
|
|
width: 128,
|
|
|
|
height: 128,
|
|
|
|
marginLeft: 'auto',
|
|
|
|
marginRight: 'auto',
|
|
|
|
marginBottom: theme.spacing.unit,
|
|
|
|
backgroundColor: theme.palette.primary.main
|
|
|
|
},
|
2019-04-04 02:01:54 +02:00
|
|
|
pageProfileNameEmoji: {
|
|
|
|
height: theme.typography.h4.fontSize,
|
|
|
|
},
|
2019-03-28 21:46:19 +01:00
|
|
|
pageProfileStatsDiv: {
|
|
|
|
display: 'inline-flex',
|
|
|
|
marginTop: theme.spacing.unit * 2,
|
|
|
|
marginBottom: theme.spacing.unit * 2,
|
|
|
|
},
|
|
|
|
pageProfileStat: {
|
|
|
|
marginLeft: theme.spacing.unit,
|
|
|
|
marginRight: theme.spacing.unit
|
|
|
|
},
|
|
|
|
pageProfileFollowButton: {
|
|
|
|
marginTop: theme.spacing.unit,
|
|
|
|
marginLeft: theme.spacing.unit,
|
|
|
|
marginRight: theme.spacing.unit,
|
|
|
|
zIndex: 3
|
|
|
|
},
|
|
|
|
pageContentLayoutConstraints: {
|
2019-04-19 21:26:22 +02:00
|
|
|
paddingLeft: theme.spacing.unit,
|
|
|
|
paddingRight: theme.spacing.unit,
|
2019-03-28 21:46:19 +01:00
|
|
|
paddingTop: theme.spacing.unit * 4,
|
2019-03-30 22:13:49 +01:00
|
|
|
paddingBottom: theme.spacing.unit * 2,
|
2019-03-28 21:46:19 +01:00
|
|
|
[theme.breakpoints.up('md')]: {
|
2019-03-30 22:13:49 +01:00
|
|
|
paddingLeft: theme.spacing.unit * 32,
|
|
|
|
paddingRight: theme.spacing.unit * 32
|
2019-03-28 21:46:19 +01:00
|
|
|
},
|
2019-03-30 22:13:49 +01:00
|
|
|
},
|
|
|
|
errorCard: {
|
|
|
|
padding: theme.spacing.unit * 4,
|
|
|
|
backgroundColor: theme.palette.error.main,
|
2019-03-31 03:20:55 +02:00
|
|
|
},
|
|
|
|
pageTopChipContainer: {
|
|
|
|
zIndex: 24,
|
|
|
|
position: "fixed",
|
|
|
|
width: '100%'
|
|
|
|
},
|
|
|
|
pageTopChips: {
|
|
|
|
textAlign: 'center',
|
|
|
|
[theme.breakpoints.up('md')]: {
|
|
|
|
marginRight: '55%'
|
2019-04-01 00:18:04 +02:00
|
|
|
},
|
|
|
|
[theme.breakpoints.up('xl')]: {
|
|
|
|
marginRight: '50%'
|
2019-03-31 03:20:55 +02:00
|
|
|
}
|
|
|
|
},
|
|
|
|
pageTopChip: {
|
|
|
|
boxShadow: theme.shadows[10]
|
2019-03-31 22:49:09 +02:00
|
|
|
},
|
|
|
|
clearAllButton: {
|
|
|
|
zIndex: 3,
|
|
|
|
position: 'absolute',
|
|
|
|
right: 24,
|
|
|
|
top: 100,
|
|
|
|
[theme.breakpoints.up('md')]: {
|
|
|
|
top: 116,
|
|
|
|
right: theme.spacing.unit * 24,
|
|
|
|
}
|
2019-04-04 02:01:54 +02:00
|
|
|
},
|
2019-04-19 21:12:04 +02:00
|
|
|
mobileOnly: {
|
|
|
|
[theme.breakpoints.up('sm')]: {
|
|
|
|
display: 'none'
|
|
|
|
}
|
|
|
|
},
|
|
|
|
desktopOnly: {
|
|
|
|
display: 'none',
|
|
|
|
[theme.breakpoints.up('sm')]: {
|
|
|
|
display: 'block'
|
|
|
|
}
|
2019-04-21 21:10:16 +02:00
|
|
|
},
|
|
|
|
pageLayoutFooter: {
|
|
|
|
'& a': {
|
|
|
|
color: theme.palette.primary.light
|
|
|
|
}
|
2019-04-27 21:00:01 +02:00
|
|
|
},
|
|
|
|
youHeadingAvatar: {
|
|
|
|
height: 88,
|
|
|
|
width: 88
|
|
|
|
},
|
|
|
|
youPaper: {
|
|
|
|
padding: theme.spacing.unit * 2,
|
|
|
|
},
|
2019-04-27 21:23:33 +02:00
|
|
|
youGrid: {
|
|
|
|
textAlign: "center",
|
|
|
|
'& *': {
|
|
|
|
marginLeft: "auto",
|
|
|
|
marginRight: "auto",
|
|
|
|
}
|
|
|
|
},
|
|
|
|
youGridAvatar: {
|
|
|
|
height: 128,
|
|
|
|
width: 128
|
|
|
|
},
|
|
|
|
youGridImage: {
|
|
|
|
width: 'auto',
|
|
|
|
height: 128
|
|
|
|
},
|
2019-03-27 22:39:25 +01:00
|
|
|
});
|