Skip to content
This repository has been archived by the owner on Mar 1, 2024. It is now read-only.

Commit

Permalink
Merge pull request #260 from alanbueno/feat/optional-header-alignment
Browse files Browse the repository at this point in the history
 feat(*): Add SiteHeader center alignment capability
  • Loading branch information
jonthomp authored Jul 4, 2018
2 parents 8f11777 + 61250b8 commit cc9b1ff
Show file tree
Hide file tree
Showing 3 changed files with 24 additions and 4 deletions.
10 changes: 10 additions & 0 deletions src/components/Container.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
@charset "UTF-8";
/**
Container customization
*/

.container.center {
display: flex;
align-items: center;
justify-content: center;
}
9 changes: 7 additions & 2 deletions src/components/Container.react.js
Original file line number Diff line number Diff line change
@@ -1,13 +1,18 @@
// @flow

import * as React from "react";
import cn from "classnames";

import "./Container.css";

type Props = {|
+children?: React.Node,
+className?: string,
|};

function Container(props: Props): React.Node {
return <div className={"container"}>{props.children}</div>;
function Container({ className, children }: Props): React.Node {
const classes = cn("container", className);
return <div className={classes}>{children}</div>;
}

export default Container;
9 changes: 7 additions & 2 deletions src/components/Site/SiteHeader.react.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,11 @@ import type { Props as AccountDropdownProps } from "../AccountDropdown/AccountDr
export type Props = {|
+children?: React.Node,
/**
* href attributefor the logo
* header alignment
*/
+align?: string,
/**
* href attribute for the logo
*/
+href?: string,
/**
Expand Down Expand Up @@ -38,6 +42,7 @@ export type Props = {|
const SiteHeader = ({
children,
href,
align,
imageURL,
alt,
notificationsTray: notificationsTrayFromProps,
Expand All @@ -55,7 +60,7 @@ const SiteHeader = ({

return (
<div className="header py-4">
<Container>
<Container className={align}>
<div className="d-flex">
{children || (
<React.Fragment>
Expand Down

0 comments on commit cc9b1ff

Please sign in to comment.