Skip to content

Commit

Permalink
Prettify
Browse files Browse the repository at this point in the history
  • Loading branch information
@flekschas
flekschas committed Feb 21, 2019
1 parent 45d7817 commit 2f9d1b2
Show file tree
Hide file tree
Showing 2 changed files with 87 additions and 49 deletions.
13 changes: 9 additions & 4 deletions src/components/ButtonLikeLink.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,12 +8,17 @@ import './ButtonLikeLink.scss';
const isMailTo = url => url.substr(0, 7) === 'mailto:';

const ButtonLikeLink = props => (
<div className={`flex-c flex-a-c button-like-link ${props.className}`} style={props.style}>
<div
className={`flex-c flex-a-c button-like-link ${props.className}`}
style={props.style}
>
{props.external ? (
<a
href={props.to}
target={props.newWindow && !isMailTo(props.to) ? '_blank' : ''}
rel={props.newWindow && !isMailTo(props.to) ? 'noopener noreferrer' : ''}
rel={
props.newWindow && !isMailTo(props.to) ? 'noopener noreferrer' : ''
}
>
{props.children}
</a>
Expand All @@ -27,7 +32,7 @@ ButtonLikeLink.defaultProps = {
className: '',
external: false,
newWindow: false,
style: {},
style: {}
};

ButtonLikeLink.propTypes = {
Expand All @@ -36,7 +41,7 @@ ButtonLikeLink.propTypes = {
to: PropTypes.string.isRequired,
external: PropTypes.bool,
newWindow: PropTypes.bool,
style: PropTypes.obj,
style: PropTypes.obj
};

export default ButtonLikeLink;
123 changes: 78 additions & 45 deletions src/components/Footer.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,46 +3,47 @@ import React from 'react';
import { NavLink } from 'react-router-dom';

// Components
import ButtonLikeLink from './ButtonLikeLink'
import ButtonLikeLink from './ButtonLikeLink';
import Icon from './Icon';

// Styles
import './Footer.scss';

const runByOrganization = typeof window.HGAC_RUN_BY_ORGANIZATION === "string"
? window.HGAC_RUN_BY_ORGANIZATION // from compiled `config.js`
: null;
const runByOrganization =
typeof window.HGAC_RUN_BY_ORGANIZATION === 'string'
? window.HGAC_RUN_BY_ORGANIZATION // from compiled `config.js`
: null;

const runByOrganizationUrl = typeof window.HGAC_RUN_BY_ORGANIZATION_URL === "string"
? window.HGAC_RUN_BY_ORGANIZATION_URL // from compiled `config.js`
: null;
const runByOrganizationUrl =
typeof window.HGAC_RUN_BY_ORGANIZATION_URL === 'string'
? window.HGAC_RUN_BY_ORGANIZATION_URL // from compiled `config.js`
: null;

const runBySlogan = typeof window.HGAC_RUN_BY_SLOGAN === "string"
? window.HGAC_RUN_BY_SLOGAN // from compiled `config.js`
: null;
const runBySlogan =
typeof window.HGAC_RUN_BY_SLOGAN === 'string'
? window.HGAC_RUN_BY_SLOGAN // from compiled `config.js`
: null;

const runByLogoUrl = typeof window.HGAC_RUN_BY_LOGO_URL === "string"
? window.HGAC_RUN_BY_LOGO_URL // from compiled `config.js`
: null;
const runByLogoUrl =
typeof window.HGAC_RUN_BY_LOGO_URL === 'string'
? window.HGAC_RUN_BY_LOGO_URL // from compiled `config.js`
: null;

const runByLogoOnly = !!window.HGAC_RUN_BY_LOGO_ONLY;

const runByContactUrl = typeof window.HGAC_RUN_BY_CONTACT_URL === "string"
? window.HGAC_RUN_BY_CONTACT_URL // from compiled `config.js`
: null;
const runByContactUrl =
typeof window.HGAC_RUN_BY_CONTACT_URL === 'string'
? window.HGAC_RUN_BY_CONTACT_URL // from compiled `config.js`
: null;

const Footer = () => (
<footer className="footer">
{runByOrganization && (
<div id="run-by">
<div className="wrap flex-c flex-v">
<div className="flex-c run-by-slogan">
{runBySlogan || 'Run by'}
</div>
<div className="flex-c run-by-slogan">{runBySlogan || 'Run by'}</div>
<div className="flex-c flex-a-c flex-jc-sb">
<div
className="flex-c flex-a-c"
>
<div className="flex-c flex-a-c">
{runByLogoUrl && (
<img
src={runByLogoUrl}
Expand All @@ -55,20 +56,20 @@ const Footer = () => (
<span
className="run-by-organization"
style={{
marginBottom: !runByLogoUrl ? 0: null
marginBottom: !runByLogoUrl ? 0 : null
}}
>
{runByOrganizationUrl ? (
<a
href={runByOrganizationUrl}
target='_blank'
rel='noopener noreferrer'
>
{runByOrganization}
</a>
) : (
{runByOrganization}
)}
{runByOrganizationUrl ? (
<a
href={runByOrganizationUrl}
target="_blank"
rel="noopener noreferrer"
>
{runByOrganization}
</a>
) : (
{ runByOrganization }
)}
</span>
)}
</div>
Expand All @@ -80,7 +81,7 @@ const Footer = () => (
newWindow={true}
className="run-by-contact"
style={{
marginBottom: !runByLogoUrl ? 0: null
marginBottom: !runByLogoUrl ? 0 : null
}}
>
Contact
Expand All @@ -95,20 +96,52 @@ const Footer = () => (
<div className="flex-c flex-a-c flex-v">
<div className="flex-c">
<Icon iconId="logo-hms" title="Harvard Medical School" />
<Icon iconId="logo-seas" title="Harvard John A. Paulson School of Engineering and Applied Sciences" />
<Icon iconId="logo-mit" title="Massachusetts Institute of Technology" />
<Icon
iconId="logo-seas"
title="Harvard John A. Paulson School of Engineering and Applied Sciences"
/>
<Icon
iconId="logo-mit"
title="Massachusetts Institute of Technology"
/>
</div>
<p className="copyright">&copy; 2018 <NavLink to='/about#copyright'>Harvard College</NavLink>.</p>
<p className="copyright">
&copy; 2018 <NavLink to="/about#copyright">Harvard College</NavLink>.
</p>
</div>

<nav>
<ul className='flex-c flex-jc-e flex-a-s no-list-style'>
<li><NavLink exact to='/' activeClassName='is-active'>Home</NavLink></li>
<li><NavLink exact to='/about' activeClassName='is-active'>About</NavLink></li>
<li><NavLink exact to='/blog' activeClassName='is-active'>Blog</NavLink></li>
<li><NavLink exact to='/examples' activeClassName='is-active'>Examples</NavLink></li>
<li><NavLink exact to='/plugins' activeClassName='is-active'>Plugins</NavLink></li>
<li><NavLink exact to='/docs' activeClassName='is-active'>Docs</NavLink></li>
<ul className="flex-c flex-jc-e flex-a-s no-list-style">
<li>
<NavLink exact to="/" activeClassName="is-active">
Home
</NavLink>
</li>
<li>
<NavLink exact to="/about" activeClassName="is-active">
About
</NavLink>
</li>
<li>
<NavLink exact to="/blog" activeClassName="is-active">
Blog
</NavLink>
</li>
<li>
<NavLink exact to="/examples" activeClassName="is-active">
Examples
</NavLink>
</li>
<li>
<NavLink exact to="/plugins" activeClassName="is-active">
Plugins
</NavLink>
</li>
<li>
<NavLink exact to="/docs" activeClassName="is-active">
Docs
</NavLink>
</li>
</ul>
</nav>
</div>
Expand Down

0 comments on commit 2f9d1b2

Please sign in to comment.