diff --git a/client/app/scripts/components/global-style.js b/client/app/scripts/components/global-style.js index 540cfbaea..8c4a380b3 100644 --- a/client/app/scripts/components/global-style.js +++ b/client/app/scripts/components/global-style.js @@ -1100,8 +1100,7 @@ const GlobalStyle = createGlobalStyle` } } - &-embedded &-inner { top: ${scopeTheme('terminalHeaderHeight')}; } - &-app &-inner { top: 0; } + &-embedded { .terminal-inner { top: ${scopeTheme('terminalHeaderHeight')}; } } &-inner { cursor: text; font-family: ${props => props.theme.fontFamilies.monospace}; @@ -1109,6 +1108,7 @@ const GlobalStyle = createGlobalStyle` bottom: 0; left: 0; right: 0; + top: 0; background-color: ${color('black')}; padding: 8px; box-sizing: content-box; diff --git a/client/app/scripts/components/terminal-app.js b/client/app/scripts/components/terminal-app.js index d8819aa5f..889998974 100644 --- a/client/app/scripts/components/terminal-app.js +++ b/client/app/scripts/components/terminal-app.js @@ -1,7 +1,12 @@ import React from 'react'; import { connect } from 'react-redux'; +import { ThemeProvider } from 'styled-components'; +import commonTheme from 'weaveworks-ui-components/lib/theme'; + import Terminal from './terminal'; +import GlobalStyle from './global-style'; +import defaultTheme from '../themes/default'; import { receiveControlPipeFromParams, hitEsc } from '../actions/app-actions'; const ESC_KEY_CODE = 27; @@ -50,16 +55,21 @@ class TerminalApp extends React.Component { const style = {borderTop: `4px solid ${this.state.titleBarColor}`}; return ( -
- {this.props.controlPipe && ( - - )} -
+ + <> + +
+ {this.props.controlPipe && ( + + )} +
+ +
); } }