hunk.code_window:   [alignToControl(placement)]: '100%',
     backgroundColor: colors.neutral0,
     borderRadius: borderRadius,
     boxShadow: `0 0 0 1px ${colors.neutral10a}, 0 4px 11px ${colors.neutral10a}`,
     marginBottom: spacing.menuGutter,
     marginTop: spacing.menuGutter,
  
hunk.labels: add keep keep keep keep keep
hunk.after_edit:   display: 'flex',
     flexDirection: 'column',
     maxHeight: maxHeight,
  
hunk.file_path: src/components/Menu.js
hunk.type: add
file: // @flow
  
  import React from 'react';
  
  // const smallDevice = '@media (max-width: 769px)';
  const largeDevice = '@media (min-width: 770px)';
  
  const Wrapper = props => (
    <div
      css={{
        backgroundColor: '#FAFBFC',
        borderTop: '1px solid #EBECF0',
        color: '#7A869A',
        fontSize: '0.85em',
        zIndex: 1,
      }}
      {...props}
    />
  );
  const Container = props => (
    <div
      css={{
        boxSizing: 'border-box',
        maxWidth: 800,
        marginLeft: 'auto',
        marginRight: 'auto',
        paddingLeft: 20,
        paddingRight: 20,
  
        [largeDevice]: {
          alignItems: 'center',
          display: 'flex',
          justifyContent: 'space-between',
          paddingBottom: 20,
          paddingTop: 20,
        },
      }}
      {...props}
    />
  );
  const A = props => (
    <a
      {...props}
      css={{
        color: '#505F79',
        textDecoration: 'none',
  
        ':hover': {
          textDecoration: 'underline',
        },
      }}
      target="_blank"
    />
  );
  
  export default function Footer() {
    return (
      <Wrapper>
        <Container>
          <p>Copyright © Jed Watson, 2018. MIT Licensed.</p>
          <p>
            Thanks to <A href="https://www.thinkmill.com.au">Thinkmill</A> and{' '}
            <A href="https://www.atlassian.com">Atlassian</A> for supporting this
            project.
          </p>
        </Container>
      </Wrapper>
    );
  }
  