735aaa668a
* fix: add toc to mobile views and center the branding * add padding to bottom of sidebar * put the mobile branding inline * finesse the padding * make spelling of sign-in email less crazy looking * move mobile sidebar button into header * adds scene to search and 404 pages * fix title alignment * make filter buttons tight * clean up unused imports * lint Co-authored-by: Tom Moor <tom.moor@gmail.com>
57 lines
1.1 KiB
TypeScript
57 lines
1.1 KiB
TypeScript
import * as React from "react";
|
|
import styled from "styled-components";
|
|
import CenteredContent from "~/components/CenteredContent";
|
|
import Header from "~/components/Header";
|
|
import PageTitle from "~/components/PageTitle";
|
|
|
|
type Props = {
|
|
icon?: React.ReactNode;
|
|
title?: React.ReactNode;
|
|
textTitle?: string;
|
|
children: React.ReactNode;
|
|
breadcrumb?: React.ReactNode;
|
|
actions?: React.ReactNode;
|
|
centered?: boolean;
|
|
};
|
|
|
|
function Scene({
|
|
title,
|
|
icon,
|
|
textTitle,
|
|
actions,
|
|
breadcrumb,
|
|
children,
|
|
centered,
|
|
}: Props) {
|
|
return (
|
|
<FillWidth>
|
|
<PageTitle title={textTitle || title} />
|
|
<Header
|
|
hasSidebar
|
|
title={
|
|
icon ? (
|
|
<>
|
|
{icon} {title}
|
|
</>
|
|
) : (
|
|
title
|
|
)
|
|
}
|
|
actions={actions}
|
|
breadcrumb={breadcrumb}
|
|
/>
|
|
{centered !== false ? (
|
|
<CenteredContent withStickyHeader>{children}</CenteredContent>
|
|
) : (
|
|
children
|
|
)}
|
|
</FillWidth>
|
|
);
|
|
}
|
|
|
|
const FillWidth = styled.div`
|
|
width: 100%;
|
|
`;
|
|
|
|
export default Scene;
|