diff --git a/remix-debugger/src/ui/ButtonNavigator.js b/remix-debugger/src/ui/ButtonNavigator.js index 98765177b3..f438d69236 100644 --- a/remix-debugger/src/ui/ButtonNavigator.js +++ b/remix-debugger/src/ui/ButtonNavigator.js @@ -29,7 +29,7 @@ var css = csjs` ${styles.rightPanel.debuggerTab.button_Debugger} } .navigator { - color: ${styles.rightPanel.debuggerTab.button_Debugger_icon_Color}; + color: ${styles.rightPanel.debuggerTab.text_Primary}; } .navigator:hover { color: ${styles.rightPanel.debuggerTab.button_Debugger_icon_HoverColor}; diff --git a/remix-debugger/src/ui/CodeListView.js b/remix-debugger/src/ui/CodeListView.js index c1d01a2666..784d6cbfe4 100644 --- a/remix-debugger/src/ui/CodeListView.js +++ b/remix-debugger/src/ui/CodeListView.js @@ -2,7 +2,6 @@ var style = require('./styles/basicStyles') var yo = require('yo-yo') var remixLib = require('remix-lib') -var ui = remixLib.helpers.ui var DropdownPanel = require('./DropdownPanel') var EventManager = remixLib.EventManager var csjs = require('csjs-inject') @@ -57,10 +56,10 @@ CodeListView.prototype.indexChanged = function (index) { } } this.itemSelected = this.codeView.children[index] - this.itemSelected.setAttribute('style', ui.formatCss({'background-color': '#eeeeee'})) + this.itemSelected.setAttribute('style', 'background-color: ' + styles.rightPanel.debuggerTab.text_BgHighlight) this.itemSelected.setAttribute('selected', 'selected') if (this.itemSelected.firstChild) { - this.itemSelected.firstChild.setAttribute('style', ui.formatCss({'margin-left': '2px'})) + this.itemSelected.firstChild.setAttribute('style', 'margin-left: 2px') } this.codeView.scrollTop = this.itemSelected.offsetTop - parseInt(this.codeView.offsetTop) } diff --git a/remix-debugger/src/ui/DropdownPanel.js b/remix-debugger/src/ui/DropdownPanel.js index c898254373..99c6817fdf 100644 --- a/remix-debugger/src/ui/DropdownPanel.js +++ b/remix-debugger/src/ui/DropdownPanel.js @@ -1,7 +1,6 @@ 'use strict' var yo = require('yo-yo') var remixLib = require('remix-lib') -var ui = remixLib.helpers.ui var styleDropdown = require('./styles/dropdownPanel') var TreeView = require('./TreeView') var EventManager = remixLib.EventManager @@ -26,13 +25,29 @@ var css = csjs` } .eyeButton { ${styles.rightPanel.debuggerTab.button_Debugger} - color: ${styles.rightPanel.debuggerTab.button_Debugger_icon_Color}; margin: 3px; float: right; } .eyeButton:hover { color: ${styles.rightPanel.debuggerTab.button_Debugger_icon_HoverColor}; } + .dropdownpanel { + ${styles.rightPanel.debuggerTab.dropdown_Debugger} + width: 100%; + } + .dropdownrawcontent { + 'padding': '2px', + 'word-break': 'break-all' + } + .message { + 'padding': '2px', + 'word-break': 'break-all' + } + .refresh { + margin-left: 4px; + margin-top: 4px; + animation: spin 2s linear infinite; + } ` function DropdownPanel (_name, _opts) { @@ -69,7 +84,7 @@ DropdownPanel.prototype.setLoading = function () { DropdownPanel.prototype.setUpdating = function () { if (this.view) { - this.view.querySelector('.dropdownpanel .dropdowncontent').style.color = 'gray' + this.view.querySelector('.dropdownpanel .dropdowncontent').style.color = styles.appProperties.additionalText_Color } } @@ -77,7 +92,7 @@ DropdownPanel.prototype.update = function (_data, _header) { if (this.view) { this.view.querySelector('.dropdownpanel .fa-refresh').style.display = 'none' this.view.querySelector('.dropdownpanel .dropdowncontent').style.display = 'block' - this.view.querySelector('.dropdownpanel .dropdowncontent').style.color = 'black' + this.view.querySelector('.dropdownpanel .dropdowncontent').style.color = styles.appProperties.mainText_Color this.view.querySelector('.dropdownpanel .dropdownrawcontent').innerText = JSON.stringify(_data, null, '\t') this.view.querySelector('.dropdownpanel button.btn').style.display = 'block' this.view.querySelector('.title span').innerText = _header || ' ' @@ -115,17 +130,17 @@ DropdownPanel.prototype.render = function (overridestyle) { to {transform:rotate(359deg);} } -