diff --git a/assets/css/browser-solidity.css b/assets/css/browser-solidity.css index ea3abce161..665e40f0b0 100644 --- a/assets/css/browser-solidity.css +++ b/assets/css/browser-solidity.css @@ -60,7 +60,8 @@ float: right; height: 90%; background-color: white; - padding-right: 1%; + padding-right: 5%; + padding-left: 5%; } #righthand-panel #menu { diff --git a/src/app/support-tab.js b/src/app/support-tab.js new file mode 100644 index 0000000000..c6e72a2bbc --- /dev/null +++ b/src/app/support-tab.js @@ -0,0 +1,95 @@ +var yo = require('yo-yo') + +// -------------- styling ---------------------- +var csjs = require('csjs-inject') +var styleGuide = require('./style-guide') +var styles = styleGuide() + +var css = csjs` + .supportTabView { + height: 100vh; + padding: 2%; + margin-top: 1em; + padding-bottom: 3em; + display: flex; + flex-direction: column; + overflow: hidden; + } + .chat extends ${styles.displayBox} { + display: flex; + flex-direction: column; + align-items: center; + height: 100%; + } + .chatTitle { + cursor: pointer; + height: 40px; + width: 92%; + display: flex; + align-items: center; + justify-content: center; + border-radius: 3px; + background-color: white; + border: 2px dotted ${styles.colors.lightGrey}; + } + .chatTitle:hover { + background-color: ${styles.colors.lightYellow}; + } + .icon { + height: 70%; + margin-right: 2%; + } + .chatTitleText { + font-size: 13px; + font-weight: bold; + } + .chatTitleText { + opacity: 0.8; + } + .chatIframe { + width: 102%; + height: 80%; + border: 2px dotted ${styles.colors.lightGrey}; + overflow: hidden; + transform: + scale(0.9); + } + .infoBox extends ${styles.infoTextBox}{ + + } +` + +var infoText = yo` +