mirror of
https://github.com/c8r/x0.git
synced 2024-09-11 21:57:26 +03:00
Add head option
This commit is contained in:
parent
4166117955
commit
989d02e95c
10
docs/App.js
10
docs/App.js
@ -1,6 +1,5 @@
|
||||
import React from 'react'
|
||||
import connect from 'refunk'
|
||||
import cxs from 'cxs/x'
|
||||
import { Logo } from '@compositor/logo'
|
||||
import pkg from '../package.json'
|
||||
import Style from './Style'
|
||||
@ -27,7 +26,7 @@ const App = connect(props => <React.Fragment>
|
||||
<meta name='twitter:title' content='Compositor x0' />
|
||||
<meta name='twitter:title' content={props.description} />
|
||||
<meta name='twitter:image' content='https://compositor.io/logo/dist/compositor-black.png' />
|
||||
<Style css={props.css} />
|
||||
<Style />
|
||||
<Container>
|
||||
<nav>
|
||||
<Flex wrap align='center'>
|
||||
@ -139,12 +138,13 @@ App.defaultProps = {
|
||||
}
|
||||
|
||||
App.getInitialProps = async ({ Component, html, pathname }) => {
|
||||
const css = cxs.css()
|
||||
cxs.reset()
|
||||
// const css = cxs.css()
|
||||
// cxs.reset()
|
||||
// const head = `<meta name='test'><style>${css}</style>`
|
||||
|
||||
return {
|
||||
hello: 'hi',
|
||||
css
|
||||
// head
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -1,7 +1,7 @@
|
||||
import styled from 'cxs/x'
|
||||
import nano from 'nano-style'
|
||||
import { space, propTypes } from 'styled-system'
|
||||
|
||||
const BlockLink = styled('a')({
|
||||
const BlockLink = nano('a')({
|
||||
display: 'block',
|
||||
color: 'inherit',
|
||||
textDecoration: 'none'
|
||||
|
@ -1,4 +1,4 @@
|
||||
import styled from 'cxs/x'
|
||||
import nano from 'nano-style'
|
||||
import {
|
||||
space,
|
||||
width,
|
||||
@ -7,7 +7,7 @@ import {
|
||||
propTypes
|
||||
} from 'styled-system'
|
||||
|
||||
const Box = styled('div')(space, width, fontSize, color)
|
||||
const Box = nano('div')(space, width, fontSize, color)
|
||||
|
||||
Box.propTypes = {
|
||||
...propTypes.space,
|
||||
|
@ -1,7 +1,7 @@
|
||||
import styled from 'cxs/x'
|
||||
import nano from 'nano-style'
|
||||
import { space, propTypes } from 'styled-system'
|
||||
|
||||
const Btn = styled('a')({
|
||||
const Btn = nano('a')({
|
||||
display: 'inline-block',
|
||||
textDecoration: 'none',
|
||||
fontSize: '12px',
|
||||
|
@ -1,7 +1,7 @@
|
||||
import styled from 'cxs/x'
|
||||
import nano from 'nano-style'
|
||||
import Btn from './Btn'
|
||||
|
||||
const BtnOutline = styled(Btn)({
|
||||
const BtnOutline = nano(Btn)({
|
||||
boxShadow: 'inset 0 0 0 2px',
|
||||
color: 'inherit !important',
|
||||
backgroundColor: 'transparent !important',
|
||||
|
@ -1,7 +1,7 @@
|
||||
import styled from 'cxs/x'
|
||||
import nano from 'nano-style'
|
||||
import Text from './Text'
|
||||
|
||||
const Caps = styled(Text)({
|
||||
const Caps = nano(Text)({
|
||||
textTransform: 'uppercase',
|
||||
letterSpacing: '.2em'
|
||||
})
|
||||
|
@ -1,7 +1,7 @@
|
||||
import styled from 'cxs/x'
|
||||
import nano from 'nano-style'
|
||||
import Box from './Box'
|
||||
|
||||
const Container = styled(Box)({
|
||||
const Container = nano(Box)({
|
||||
maxWidth: '768px'
|
||||
})
|
||||
|
||||
|
@ -1,4 +1,4 @@
|
||||
import styled from 'cxs/x'
|
||||
import nano from 'nano-style'
|
||||
import {
|
||||
alignItems,
|
||||
justifyContent,
|
||||
@ -7,7 +7,7 @@ import {
|
||||
} from 'styled-system'
|
||||
import Box from './Box'
|
||||
|
||||
const Flex = styled(Box)({
|
||||
const Flex = nano(Box)({
|
||||
display: 'flex'
|
||||
}, alignItems, justifyContent, flexWrap)
|
||||
|
||||
|
@ -1,7 +1,7 @@
|
||||
import styled from 'cxs/x'
|
||||
import nano from 'nano-style'
|
||||
import Text from './Text'
|
||||
|
||||
const Mono = styled(Text)({
|
||||
const Mono = nano(Text)({
|
||||
fontFamily: '"Roboto Mono", Menlo, monospace',
|
||||
})
|
||||
|
||||
|
@ -1,7 +1,7 @@
|
||||
import styled from 'cxs/x'
|
||||
import nano from 'nano-style'
|
||||
import { fontSize, space, propTypes } from 'styled-system'
|
||||
|
||||
const NavLink = styled('a')({
|
||||
const NavLink = nano('a')({
|
||||
textDecoration: 'none',
|
||||
display: 'inline-block',
|
||||
fontWeight: 'bold',
|
||||
|
@ -1,7 +1,7 @@
|
||||
import styled from 'cxs/x'
|
||||
import nano from 'nano-style'
|
||||
import { fontSize, color, propTypes } from 'styled-system'
|
||||
|
||||
const Pre = styled('pre')({
|
||||
const Pre = nano('pre')({
|
||||
fontFamily: '"Roboto Mono", Menlo, monospace',
|
||||
margin: 0,
|
||||
padding: 0,
|
||||
|
@ -1,4 +1,4 @@
|
||||
import styled from 'cxs/x'
|
||||
import nano from 'nano-style'
|
||||
import {
|
||||
fontSize,
|
||||
fontWeight,
|
||||
@ -8,7 +8,7 @@ import {
|
||||
propTypes
|
||||
} from 'styled-system'
|
||||
|
||||
const Text = styled('div')({},
|
||||
const Text = nano('div')({},
|
||||
fontSize,
|
||||
fontWeight,
|
||||
textAlign,
|
||||
|
@ -1,7 +1,7 @@
|
||||
import styled from 'cxs/x'
|
||||
import nano from 'nano-style'
|
||||
import { space } from 'styled-system'
|
||||
|
||||
const MonoTitle = styled('h1')({
|
||||
const MonoTitle = nano('h1')({
|
||||
fontFamily: '"Roboto Mono", Menlo, monospace',
|
||||
fontSize: '32px',
|
||||
fontWeight: 600,
|
||||
@ -18,7 +18,7 @@ MonoTitle.defaultProps = {
|
||||
px: 2,
|
||||
}
|
||||
|
||||
const Title = styled('h1')({
|
||||
const Title = nano('h1')({
|
||||
fontSize: '64px',
|
||||
fontWeight: 600,
|
||||
lineHeight: 1.25,
|
||||
|
@ -1,6 +1,6 @@
|
||||
import styled from 'cxs/x'
|
||||
import nano from 'nano-style'
|
||||
|
||||
const Video = styled('video')({
|
||||
const Video = nano('video')({
|
||||
display: 'block',
|
||||
width: '100%',
|
||||
height: 'auto',
|
||||
|
File diff suppressed because one or more lines are too long
@ -21,11 +21,14 @@ const createHTML = ({
|
||||
scripts = []
|
||||
}) => (`<!DOCTYPE html>
|
||||
<meta charset='utf-8'>
|
||||
${getHead(initialProps)}
|
||||
${body}
|
||||
${initialProps ? `<script id='__initial-props__' type='application/json'>${JSON.stringify(initialProps)}</script>` : ''}
|
||||
${scripts.map(src => `<script src='${src}'></script>`)}
|
||||
`)
|
||||
|
||||
const getHead = props => typeof props.head === 'string' ? props.head : ''
|
||||
|
||||
const render = (Component, props, isStatic) =>
|
||||
(isStatic ? renderToStaticMarkup : renderToString)(
|
||||
React.createElement(Component, props)
|
||||
|
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@compositor/x0",
|
||||
"version": "3.0.0-2",
|
||||
"version": "3.0.0-3",
|
||||
"description": "Zero-config React development environment and static site generator",
|
||||
"main": "index.js",
|
||||
"bin": {
|
||||
@ -44,6 +44,7 @@
|
||||
"ava": "^0.24.0",
|
||||
"cxs": "^6.1.0",
|
||||
"isomorphic-fetch": "^2.2.1",
|
||||
"nano-style": "^1.0.0-20",
|
||||
"nyc": "^11.2.1",
|
||||
"refunk": "^2.0.0-1",
|
||||
"styled-system": "^1.0.7"
|
||||
|
Loading…
Reference in New Issue
Block a user