roleypoly/v1
1
0
Fork 0
mirror of https://github.com/roleypoly/roleypoly-v1.git synced 2025-06-16 18:29:08 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

absolutely massive typescript porting time

Browse source
This commit is contained in:
41666 2019-06-02 18:58:15 -05:00
parent 01f238f515
commit 30d08a630f
No known key found for this signature in database
GPG key ID: BC51D07640DC10AF
159 changed files with 2563 additions and 3861 deletions
Download patch file Download diff file Expand all files Collapse all files

59
packages/roleypoly-ui/components/header/common.tsx Normal file
View file

@ -0,0 +1,59 @@
// @flow
import * as React from 'react'
import dynamic from 'next/dynamic'
import styled from 'styled-components'
import * as logo from '../logo'
export type CommonProps = {
children: React.Element<any>,
noBackground: boolean
}
const Header = styled.div`
background-color: ${({ noBackground }: any) => noBackground === false ? 'var(--c-dark)' : 'var(--c-1)'};
transition: background-color 0.3s ease-in-out;
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 5;
`
const HeaderInner = styled.div`
display: flex;
justify-content: center;
align-items: center;
max-width: 960px;
width: 100vw;
margin: 0 auto;
height: 50px;
padding: 3px 5px;
position: relative;
top: -1px;
& > div {
margin: 0 0.5em;
}
`
export const Logotype = styled(logo.Logotype)`
height: 30px;
`
export const Logomark = styled(logo.Logomark)`
width: 40px;
height: 40px;
`
//
const DebugBreakpoints = dynamic(() => import('../../kit/debug-breakpoints'))
const HeaderBarCommon = ({ children, noBackground = false }: CommonProps) => (
<Header noBackground={noBackground}>
{ (process.env.NODE_ENV === 'development') && <DebugBreakpoints />}
<HeaderInner>
{ children }
</HeaderInner>
</Header>
)
export default HeaderBarCommon