joyent-portal/packages/ui-toolkit/src/styleguide/wrapper.js

59 lines
1.1 KiB
JavaScript
Raw Normal View History

import React, { Component } from 'react';
import { ThemeProvider, injectGlobal } from 'styled-components';
import theme from '../theme';
import Base from '../base';
import { loadedFontFamily } from '../typography';
const StyledBase = Base.extend`
2017-09-27 17:44:57 +03:00
/* trick prettier */
background-color: transparent;
`;
export default class Wrapper extends Component {
componentWillMount() {
// eslint-disable-next-line no-unused-expressions
injectGlobal`
[hidden] {
display: none;
}
html {
line-height: 1.15;
text-size-adjust: 100%;
}
body {
font-size: 15px;
margin: 0;
padding: 0;
background: ${theme.background};
${loadedFontFamily};
}
html,
body,
#root {
height: 100%;
}
.CodeMirror,
.ReactCodeMirror {
height: 100% !important;
}
.CodeMirror {
border: solid 1px ${theme.grey};
}
`;
}
render() {
return (
<ThemeProvider theme={theme}>
2017-08-28 22:21:08 +03:00
<StyledBase>{this.props.children}</StyledBase>
</ThemeProvider>
);
}
}