DRYer logo
This commit is contained in:
parent
b0bfe70e9d
commit
b0f9aa3900
@ -4,9 +4,35 @@ import './logo.css';
|
||||
|
||||
/**
|
||||
* Logo
|
||||
*
|
||||
* As link to homepage, used in top header
|
||||
*/
|
||||
const Logo = () => (
|
||||
const Logo: React.FunctionComponent = () => (
|
||||
<Link to="/" className="logo navbar-brand" id="top">
|
||||
<LogoGrid />
|
||||
<h1 className="logotype">
|
||||
<span>Colouring</span>
|
||||
<span>London</span>
|
||||
</h1>
|
||||
</Link>
|
||||
);
|
||||
|
||||
/**
|
||||
* MinorLogo
|
||||
*
|
||||
* As plain logo, used in legend
|
||||
*/
|
||||
const MinorLogo: React.FunctionComponent = () => (
|
||||
<div className="logo">
|
||||
<LogoGrid />
|
||||
<h3 className="h3 logotype">
|
||||
<span>Colouring</span>
|
||||
<span>London</span>
|
||||
</h3>
|
||||
</div>
|
||||
)
|
||||
|
||||
const LogoGrid: React.FunctionComponent = () => (
|
||||
<div className="grid">
|
||||
<div className="row">
|
||||
<div className="cell"></div>
|
||||
@ -27,11 +53,6 @@ const Logo = () => (
|
||||
<div className="cell"></div>
|
||||
</div>
|
||||
</div>
|
||||
<h1 className="logotype">
|
||||
<span>Colouring</span>
|
||||
<span>London</span>
|
||||
</h1>
|
||||
</Link>
|
||||
);
|
||||
)
|
||||
|
||||
export default Logo;
|
||||
export { Logo, MinorLogo };
|
||||
|
@ -2,7 +2,7 @@ import React, { Fragment } from 'react';
|
||||
import { NavLink } from 'react-router-dom';
|
||||
import PropTypes from 'prop-types';
|
||||
|
||||
import Logo from './components/logo';
|
||||
import { Logo } from './components/logo';
|
||||
import './header.css';
|
||||
|
||||
/**
|
||||
|
@ -2,6 +2,7 @@ import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
|
||||
import './legend.css';
|
||||
import { MinorLogo } from './components/logo';
|
||||
|
||||
const LEGEND_CONFIG = {
|
||||
location: {
|
||||
@ -145,32 +146,7 @@ class Legend extends React.Component<any, any> { // TODO: add proper types
|
||||
|
||||
return (
|
||||
<div className="map-legend">
|
||||
<div className="logo">
|
||||
<div className="grid">
|
||||
<div className="row">
|
||||
<div className="cell"></div>
|
||||
<div className="cell"></div>
|
||||
<div className="cell"></div>
|
||||
<div className="cell"></div>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="cell"></div>
|
||||
<div className="cell"></div>
|
||||
<div className="cell"></div>
|
||||
<div className="cell"></div>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="cell"></div>
|
||||
<div className="cell"></div>
|
||||
<div className="cell"></div>
|
||||
<div className="cell"></div>
|
||||
</div>
|
||||
</div>
|
||||
<h3 className="h3 logotype">
|
||||
<span>Colouring</span>
|
||||
<span>London</span>
|
||||
</h3>
|
||||
</div>
|
||||
<MinorLogo />
|
||||
<h4 className="h4">{ title } {elements.length?<button className="expander-button btn btn-outline-secondary btn-sm" type="button" onClick={this.handleClick} >^</button>:null}</h4>
|
||||
{
|
||||
details.description?
|
||||
|
Loading…
Reference in New Issue
Block a user