diff --git a/src/app/components/side-panel.js b/src/app/components/side-panel.js index 8b1c848e425..30c6dd36429 100644 --- a/src/app/components/side-panel.js +++ b/src/app/components/side-panel.js @@ -10,6 +10,8 @@ const css = csjs` .swapitTitle { text-transform: uppercase; white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; } .swapitTitle i{ padding-left: 6px; @@ -21,6 +23,7 @@ const css = csjs` display: flex; justify-content: space-between; align-items: center; + justify-content: flex-start; } .swapitHeader h6 { margin: 0; @@ -33,6 +36,9 @@ const css = csjs` height: calc(100% - 35px); overflow: auto; } + .titleInfo { + padding-left: 10px; + } ` const options = { @@ -56,7 +62,7 @@ export class SidePanel extends AbstractPanel { yo.update(this.header, this.renderHeader()) } - /** The header of the swap panel */ + /** The header of the side panel */ renderHeader () { let name = ' - ' let docLink = '' @@ -64,14 +70,15 @@ export class SidePanel extends AbstractPanel { const { profile } = this.store.getOne(this.active) name = profile.displayName ? profile.displayName : profile.name const docsRoot = 'https://remix.readthedocs.io/en/latest/' - docLink = profile.documentation ? yo`` : '' + docLink = profile.documentation ? yo`` : '' } return yo` -
-
${name}${docLink}
- -
` +
+
${name}
+ ${docLink} +
+ ` } render () { diff --git a/src/app/components/vertical-icons.js b/src/app/components/vertical-icons.js index 8d7d4b068c5..8b7e8be1ee0 100644 --- a/src/app/components/vertical-icons.js +++ b/src/app/components/vertical-icons.js @@ -78,7 +78,7 @@ export class VerticalIcons { this.icons[name] = yo`
${name} @@ -196,9 +196,22 @@ export class VerticalIcons { * @param {string} name Name of profile of the module to activate */ select (name) { + this.updateActivations(name) + this.events.emit('showContent', name) + } + + /** + * Toggles the side panel for plugin + * @param {string} name Name of profile of the module to activate + */ + toggle (name) { + this.updateActivations(name) + this.events.emit('toggleContent', name) + } + + updateActivations (name) { this.removeActive() this.addActive(name) - this.events.emit('showContent', name) } onThemeChanged (themeType) { @@ -210,10 +223,11 @@ export class VerticalIcons { } } - _iconClick (name) { - this.removeActive() - this.addActive(name) - this.events.emit('toggleContent', name) + /** + * Show the home page + */ + showHome () { + globalRegistry.get('appmanager').api.ensureActivated('home') } render () { @@ -221,7 +235,7 @@ export class VerticalIcons {
@@ -345,15 +359,15 @@ export class VerticalIcons { this.view = yo`
- ${home} - ${this.iconKind['fileexplorer']} - ${this.iconKind['compile']} - ${this.iconKind['run']} - ${this.iconKind['testing']} - ${this.iconKind['analysis']} - ${this.iconKind['debugging']} - ${this.iconKind['other']} - ${this.iconKind['settings']} + ${home} + ${this.iconKind['fileexplorer']} + ${this.iconKind['compile']} + ${this.iconKind['run']} + ${this.iconKind['testing']} + ${this.iconKind['analysis']} + ${this.iconKind['debugging']} + ${this.iconKind['other']} + ${this.iconKind['settings']}
` return this.view diff --git a/src/app/debugger/debuggerUI/TxBrowser.js b/src/app/debugger/debuggerUI/TxBrowser.js index d58c9e5a957..f9c9f74bddc 100644 --- a/src/app/debugger/debuggerUI/TxBrowser.js +++ b/src/app/debugger/debuggerUI/TxBrowser.js @@ -94,7 +94,7 @@ TxBrowser.prototype.render = function () { />
- +
diff --git a/src/app/files/file-explorer.js b/src/app/files/file-explorer.js index 007073f3516..b4b24f2841c 100644 --- a/src/app/files/file-explorer.js +++ b/src/app/files/file-explorer.js @@ -522,12 +522,12 @@ fileExplorer.prototype.renderMenuItems = function () { items = this.menuItems.map(({action, title, icon}) => { if (action === 'uploadFile') { return yo` - + ` } else { return yo` diff --git a/src/app/tabs/run-tab.js b/src/app/tabs/run-tab.js index ef55fcbff9a..98d4587156e 100644 --- a/src/app/tabs/run-tab.js +++ b/src/app/tabs/run-tab.js @@ -18,7 +18,7 @@ import { BaseApi } from 'remix-plugin' const profile = { name: 'run', - displayName: 'Deploy and run transactions', + displayName: 'Deploy & run transactions', methods: [], events: [], icon: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzFfY29weSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4Ig0KCSB5PSIwcHgiIHdpZHRoPSI3NDIuNTQ1cHgiIGhlaWdodD0iNjc2Ljg4NnB4IiB2aWV3Qm94PSIwIC0wLjIwNCA3NDIuNTQ1IDY3Ni44ODYiDQoJIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAtMC4yMDQgNzQyLjU0NSA2NzYuODg2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwb2x5Z29uIHN0cm9rZT0iI0ZGRkZGRiIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBwb2ludHM9IjI5NS45MTEsMC43MTEgNDg4LjkxMSwzMDQuMTg2IDQ4OC45MTEsMzk3LjE4MSAyOTMuOTExLDY3Ni41NTYgDQoJCTc0MS43ODYsMzQ5Ljk0MyAJIi8+DQoJPHBvbHlnb24gc3Ryb2tlPSIjRkZGRkZGIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHBvaW50cz0iNDE3LjA4Myw0MDYuNTg5IDIwOS43OTEsNTE5LjQ5NCAxLjg0Niw0MDYuMjM0IDIwOS43OTEsNjc1Ljg2MyAJIi8+DQoJPHBvbHlnb24gc3Ryb2tlPSIjRkZGRkZGIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHBvaW50cz0iNDE3LjA4MywzMTguNzA3IDIwOS43OTEsMC43MTEgMS44NDYsMzE4LjQyOCAyMDkuNzkxLDQzMS42ODkgCSIvPg0KPC9nPg0KPC9zdmc+DQo=', diff --git a/src/app/ui/landing-page/landing-page.js b/src/app/ui/landing-page/landing-page.js index d9e16377a0a..0ff5c6e798f 100644 --- a/src/app/ui/landing-page/landing-page.js +++ b/src/app/ui/landing-page/landing-page.js @@ -96,9 +96,12 @@ export class LandingPage extends BaseApi { let load = function (service, item, examples, info) { let compilerImport = new CompilerImport() let fileProviders = globalRegistry.get('fileproviders').api - const msg = yo`
Enter the ${item} you would like to load. -
${info}
-
e.g ${examples.map((url) => { return yo`` })}
` + const msg = yo` +
+ Enter the ${item} you would like to load. +
${info}
+
e.g ${examples.map((url) => { return yo`` })}
+
` modalDialogCustom.prompt(`Import from ${service}`, msg, null, (target) => { if (target !== '') { diff --git a/src/app/ui/tooltip.js b/src/app/ui/tooltip.js index aff0d478ede..b568326021f 100644 --- a/src/app/ui/tooltip.js +++ b/src/app/ui/tooltip.js @@ -23,7 +23,7 @@ class Toaster { }, 2000) animation(this.tooltip, css.animateTop.className) } - render (tooltipText, action, opts) { + render (tooltipText, actionElement, opts) { opts = defaultOptions(opts) let canShorten = true if (tooltipText instanceof Element) { @@ -53,7 +53,7 @@ class Toaster { ${shortTooltipText} ${button} - ${action} + ${actionElement} + ` - var close = yo`` + var close = yo`` title.querySelector('.btn-group').appendChild(close) var contractActionsWrapper = yo`