Nemcio/SCM-Manager
1
0
Fork 0
mirror of https://github.com/scm-manager/scm-manager.git synced 2025-11-08 06:25:45 +01:00
Code Issues Packages Projects Releases Activity

added small top spacing for page actions

Browse Source
This commit is contained in:
Florian Scholdei
2019-02-20 14:21:01 +01:00
parent fe9f97f6c9
commit 095ae81f80
1 changed files with 18 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
scm-ui-components/packages/ui-components/src/layout/Page.js
View File

@@ -4,6 +4,8 @@ import Loading from "./../Loading";
import ErrorNotification from "./../ErrorNotification"; import ErrorNotification from "./../ErrorNotification";
import Title from "./Title"; import Title from "./Title";
import Subtitle from "./Subtitle"; import Subtitle from "./Subtitle";
import injectSheet from "react-jss";
import classNames from "classnames";
type Props = { type Props = {
title?: string, title?: string,
@@ -11,7 +13,16 @@ type Props = {
loading?: boolean, loading?: boolean,
error?: Error, error?: Error,
showContentOnError?: boolean, showContentOnError?: boolean,
children: React.Node children: React.Node,
// context props
classes: Object
};
const styles = {
spacing: {
marginTop: "1.25rem"
}
}; };
class Page extends React.Component<Props> { class Page extends React.Component<Props> {
@@ -29,7 +40,7 @@ class Page extends React.Component<Props> {
} }
renderPageHeader() { renderPageHeader() {
const { title, subtitle, children } = this.props; const { title, subtitle, children, classes } = this.props;
let content = null; let content = null;
let pageActionsExists = false; let pageActionsExists = false;
@@ -39,7 +50,9 @@ class Page extends React.Component<Props> {
pageActionsExists = true; pageActionsExists = true;
} }
}); });
let underline = pageActionsExists ? <hr className="header-with-actions" /> : null; let underline = pageActionsExists ? (
<hr className="header-with-actions" />
) : null;
return ( return (
<> <>
@@ -49,7 +62,7 @@ class Page extends React.Component<Props> {
<Subtitle subtitle={subtitle} /> <Subtitle subtitle={subtitle} />
</div> </div>
<div className="column is-two-fifths"> <div className="column is-two-fifths">
<div className="is-pulled-right">{content}</div> <div className={classNames(classes.spacing, "is-pulled-right")}>{content}</div>
</div> </div>
</div> </div>
{underline} {underline}
@@ -77,4 +90,4 @@ class Page extends React.Component<Props> {
} }
} }
export default Page; export default injectSheet(styles)(Page);