Mastodon
/
hyperspace-desktop-client-windows-linux-macos
mirror of https://github.com/hyperspacedev/hyperspace
1
0
Fork 0
Code Issues Releases Wiki Activity

adds back original padding when masonry disabled

This commit is contained in:
Travis Kohlbeck 2019-12-22 16:05:24 -05:00
parent 6ef1daaec9
commit 313ff79116
2 changed files with 21 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/pages/Home.tsx
View File

@ -158,9 +158,13 @@ class HomePage extends Component<any, IHomePageState> {
render() { render() {
const { classes } = this.props; const { classes } = this.props;
const containerClasses = `${classes.pageLayoutMaxConstraints}${
this.state.isMasonryLayout
? ' ' + classes.pageLayoutMasonry
: ''
}`;
return ( return (
<div className={classes.pageLayoutMaxConstraints}> <div className={containerClasses}>
{this.state.backlogPosts ? ( {this.state.backlogPosts ? (
<div className={classes.pageTopChipContainer}> <div className={classes.pageTopChipContainer}>
<div className={classes.pageTopChips}> <div className={classes.pageTopChips}>
@ -216,13 +220,11 @@ class HomePage extends Component<any, IHomePageState> {
<div> <div>
{this.state.posts.map((post: Status) => { {this.state.posts.map((post: Status) => {
return ( return (
<div className={classes.masonryGrid_item}> <Post
<Post key={post.id}
key={post.id} post={post}
post={post} client={this.client}
client={this.client} />
/>
</div>
); );
})} })}
</div> </div>

16
src/pages/PageLayout.styles.tsx
View File

@ -33,22 +33,22 @@ export const styles = (theme: Theme) =>
marginLeft: 250, marginLeft: 250,
marginTop: 88, marginTop: 88,
padding: theme.spacing.unit * 3, padding: theme.spacing.unit * 3,
paddingLeft: theme.spacing.unit * 3, paddingLeft: theme.spacing.unit * 16,
paddingRight: theme.spacing.unit * 3 paddingRight: theme.spacing.unit * 16,
}, },
[theme.breakpoints.up("lg")]: { [theme.breakpoints.up("lg")]: {
marginLeft: 250, marginLeft: 250,
marginTop: 88, marginTop: 88,
padding: theme.spacing.unit * 3, padding: theme.spacing.unit * 3,
paddingLeft: theme.spacing.unit * 3, paddingLeft: theme.spacing.unit * 32,
paddingRight: theme.spacing.unit * 3 paddingRight: theme.spacing.unit * 32,
}, },
[theme.breakpoints.up("xl")]: { [theme.breakpoints.up("xl")]: {
marginLeft: 250, marginLeft: 250,
marginTop: 88, marginTop: 88,
padding: theme.spacing.unit * 3, padding: theme.spacing.unit * 3,
paddingLeft: theme.spacing.unit * 3, paddingLeft: theme.spacing.unit * 40,
paddingRight: theme.spacing.unit * 3 paddingRight: theme.spacing.unit * 40,
}, },
backgroundColor: theme.palette.background.default, backgroundColor: theme.palette.background.default,
minHeight: isDarwinApp() ? "100vh" : "auto" minHeight: isDarwinApp() ? "100vh" : "auto"
@ -324,6 +324,10 @@ export const styles = (theme: Theme) =>
}, },
backgroundColor: theme.palette.primary.main backgroundColor: theme.palette.primary.main
}, },
pageLayoutMasonry: {
paddingLeft: theme.spacing.unit * 3,
paddingRight: theme.spacing.unit * 3,
},
masonryGrid: { masonryGrid: {
display: 'flex', display: 'flex',
width: 'auto', width: 'auto',