3a0c852088
Tweaks to visual output and code organisation related to styles of: - sidebar (category grid, data view/edit, section headers and action buttons) - header/menu - map controls (search box) - layout (sidebar, menu, header sizes)
31 lines
841 B
TypeScript
31 lines
841 B
TypeScript
import React from 'react';
|
|
import { Link } from 'react-router-dom';
|
|
import { BackIcon } from '../components/icons';
|
|
|
|
|
|
import './container-header.css';
|
|
|
|
interface ContainerHeaderProps {
|
|
cat?: string;
|
|
backLink?: string;
|
|
title: string;
|
|
}
|
|
|
|
const ContainerHeader: React.FunctionComponent<ContainerHeaderProps> = (props) => (
|
|
<header className={`section-header view ${props.cat ? props.cat : ''} ${props.cat ? `background-${props.cat}` : ''}`}>
|
|
<h2 className="h2">
|
|
{props.backLink &&
|
|
<Link className="icon-button back" to={props.backLink}>
|
|
<BackIcon />
|
|
</Link>
|
|
}
|
|
{props.title}
|
|
</h2>
|
|
<nav className="section-header-actions">
|
|
{props.children}
|
|
</nav>
|
|
</header>
|
|
);
|
|
|
|
export default ContainerHeader;
|