From 2ca6135c06ee9cf64eeae5ac7374805fab895f5c Mon Sep 17 00:00:00 2001 From: Eugene Pankov Date: Fri, 21 Dec 2018 20:43:11 +0100 Subject: [PATCH] ui tweaks --- terminus-core/src/theme.scss | 10 +++ .../pluginsSettingsTab.component.pug | 75 ++++++++++--------- .../components/sshSettingsTab.component.pug | 19 +++-- .../components/shellSettingsTab.component.pug | 4 +- 4 files changed, 63 insertions(+), 45 deletions(-) diff --git a/terminus-core/src/theme.scss b/terminus-core/src/theme.scss index 1115afec..326aa4a4 100644 --- a/terminus-core/src/theme.scss +++ b/terminus-core/src/theme.scss @@ -51,6 +51,7 @@ $input-disabled-bg: #333; $input-color: $body-color; $input-color-placeholder: #333; $input-border-color: #344; +$input-border-width: 0; //$input-box-shadow: inset 0 1px 1px rgba($black,.075); $input-border-radius: 0; $custom-select-border-radius: 0; @@ -346,6 +347,15 @@ ngb-tabset .tab-content { } } +.list-group.list-group-flush .list-group-item:not(.list-group-item-action) { + background: transparent; + border-color: rgba(0, 0, 0, 0.2); + + &:not(:last-child) { + border-bottom: none; + } +} + select.form-control { -webkit-appearance: none; background-image: url("data:image/svg+xml;utf8,"); diff --git a/terminus-plugin-manager/src/components/pluginsSettingsTab.component.pug b/terminus-plugin-manager/src/components/pluginsSettingsTab.component.pug index f950da21..39a91277 100644 --- a/terminus-plugin-manager/src/components/pluginsSettingsTab.component.pug +++ b/terminus-plugin-manager/src/components/pluginsSettingsTab.component.pug @@ -8,41 +8,44 @@ button.btn.btn-outline-info.btn-sm.pull-right((click)='openPluginsFolder()') h3.mb-1 Installed -.mb-3.d-flex.w-100.align-items-center(*ngFor='let plugin of pluginManager.installedPlugins|orderBy:"name"') - button.btn.btn-outline-danger.active.mr-2( - *ngIf='config.store.pluginBlacklist.includes(plugin.name)', - (click)='enablePlugin(plugin)' - ) - i.fa.fa-fw.fa-pause - button.btn.btn-outline-secondary.mr-2( - *ngIf='!config.store.pluginBlacklist.includes(plugin.name)', - (click)='disablePlugin(plugin)' - ) - i.fa.fa-fw.fa-check +.list-group.list-group-flush.mt-2 + .list-group-item.d-flex.align-items-center(*ngFor='let plugin of pluginManager.installedPlugins|orderBy:"name"') + .mr-auto.d-flex.flex-column + div + strong {{plugin.name}} + small.text-muted.ml-1(*ngIf='!plugin.isBuiltin') {{plugin.version}} / {{plugin.author}} + small.text-warning.ml-1(*ngIf='config.store.pluginBlacklist.includes(plugin.name)') Disabled + a.text-muted.mb-0((click)='showPluginInfo(plugin)') + small {{plugin.description}} - .mr-auto.d-flex.flex-column - div - strong {{plugin.name}} - small.text-muted.ml-1 {{plugin.version}} / {{plugin.author}} - a.text-muted.mb-0((click)='showPluginInfo(plugin)') - small {{plugin.description}} + button.btn.btn-primary.ml-2( + *ngIf='npmInstalled && knownUpgrades[plugin.name]', + (click)='upgradePlugin(plugin)', + [disabled]='busy[plugin.name] != undefined' + ) + i.fa.fa-fw.fa-arrow-up(*ngIf='busy[plugin.name] != BusyState.Installing') + i.fa.fa-fw.fa-circle-o-notch.fa-spin(*ngIf='busy[plugin.name] == BusyState.Installing') + span Upgrade ({{knownUpgrades[plugin.name].version}}) - button.btn.btn-primary.ml-2( - *ngIf='npmInstalled && knownUpgrades[plugin.name]', - (click)='upgradePlugin(plugin)', - [disabled]='busy[plugin.name] != undefined' - ) - i.fa.fa-fw.fa-arrow-up(*ngIf='busy[plugin.name] != BusyState.Installing') - i.fa.fa-fw.fa-circle-o-notch.fa-spin(*ngIf='busy[plugin.name] == BusyState.Installing') - span Upgrade ({{knownUpgrades[plugin.name].version}}) - - button.btn.btn-outline-danger.ml-2( - (click)='uninstallPlugin(plugin)', - *ngIf='!plugin.isBuiltin && npmInstalled', - [disabled]='busy[plugin.name] != undefined' - ) - i.fa.fa-fw.fa-trash-o(*ngIf='busy[plugin.name] != BusyState.Uninstalling') - i.fa.fa-fw.fa-circle-o-notch.fa-spin(*ngIf='busy[plugin.name] == BusyState.Uninstalling') + button.btn.btn-primary.ml-2( + *ngIf='config.store.pluginBlacklist.includes(plugin.name)', + (click)='enablePlugin(plugin)' + ) + i.fa.fa-fw.fa-play + + button.btn.btn-secondary.ml-2( + *ngIf='!config.store.pluginBlacklist.includes(plugin.name)', + (click)='disablePlugin(plugin)' + ) + i.fa.fa-fw.fa-pause + + button.btn.btn-danger.ml-2( + (click)='uninstallPlugin(plugin)', + *ngIf='!plugin.isBuiltin && npmInstalled', + [disabled]='busy[plugin.name] != undefined' + ) + i.fa.fa-fw.fa-trash-o(*ngIf='busy[plugin.name] != BusyState.Uninstalling') + i.fa.fa-fw.fa-circle-o-notch.fa-spin(*ngIf='busy[plugin.name] == BusyState.Uninstalling') .text-center.mt-5(*ngIf='npmMissing') h4 npm not installed @@ -71,10 +74,10 @@ div(*ngIf='npmInstalled') ) - .mb-4(*ngIf='availablePlugins$') + .list-group.list-group-flush.mb-4(*ngIf='availablePlugins$') ng-container(*ngFor='let plugin of (availablePlugins$|async|orderBy:"name")') - .d-flex.w-100.align-items-center.mb-3(*ngIf='!isAlreadyInstalled(plugin)') - button.btn.btn-primary.mr-2( + .list-group-item.d-flex.align-items-center(*ngIf='!isAlreadyInstalled(plugin)') + button.btn.btn-primary.mr-3( (click)='installPlugin(plugin)', [disabled]='busy[plugin.name] != undefined' ) diff --git a/terminus-ssh/src/components/sshSettingsTab.component.pug b/terminus-ssh/src/components/sshSettingsTab.component.pug index af09e18a..830ed2d7 100644 --- a/terminus-ssh/src/components/sshSettingsTab.component.pug +++ b/terminus-ssh/src/components/sshSettingsTab.component.pug @@ -1,8 +1,10 @@ h3 Connections -.list-group.mt-3.mb-3 +.list-group.list-group-flush.mt-3.mb-3 ng-container(*ngFor='let group of childGroups') - .list-group-item.list-group-item-action.d-flex.align-items-center((click)='groupCollapsed[group.name] = !groupCollapsed[group.name]') + .list-group-item.list-group-item-action.d-flex.align-items-center( + (click)='groupCollapsed[group.name] = !groupCollapsed[group.name]' + ) .fa.fa-fw.fa-chevron-right(*ngIf='groupCollapsed[group.name]') .fa.fa-fw.fa-chevron-down(*ngIf='!groupCollapsed[group.name]') span.ml-3.mr-auto {{group.name || "Ungrouped"}} @@ -11,15 +13,16 @@ h3 Connections button.btn.btn-outline-danger.ml-1((click)='deleteGroup(group)') i.fa.fa-trash-o ng-container(*ngIf='!groupCollapsed[group.name]') - .list-group-item.pl-5.d-flex.align-items-center(*ngFor='let connection of group.connections') + .list-group-item.list-group-item-action.pl-5.d-flex.align-items-center( + *ngFor='let connection of group.connections', + (click)='editConnection(connection)' + ) .mr-auto div {{connection.name}} .text-muted {{connection.host}} - button.btn.btn-outline-info.ml-2((click)='editConnection(connection)') - i.fa.fa-pencil - button.btn.btn-outline-danger.ml-1((click)='deleteConnection(connection)') + button.btn.btn-outline-danger.ml-1((click)='$event.stopPropagation(); deleteConnection(connection)') i.fa.fa-trash-o -button.btn.btn-outline-primary((click)='createConnection()') - div.fa.fa-fw.fa-globe +button.btn.btn-primary((click)='createConnection()') + i.fa.fa-fw.fa-plus span.ml-2 Add connection diff --git a/terminus-terminal/src/components/shellSettingsTab.component.pug b/terminus-terminal/src/components/shellSettingsTab.component.pug index 01b6c22e..ab526fab 100644 --- a/terminus-terminal/src/components/shellSettingsTab.component.pug +++ b/terminus-terminal/src/components/shellSettingsTab.component.pug @@ -62,6 +62,8 @@ h3.mt-3 Saved Profiles i.fa.fa-trash-o div(ngbDropdown, placement='top-left') - button.btn.btn-outline-primary(ngbDropdownToggle) New profile + button.btn.btn-primary(ngbDropdownToggle) + i.fa.fa-fw.fa-plus + | New profile div(ngbDropdownMenu) button.dropdown-item(*ngFor='let shell of shells', (click)='newProfile(shell)') {{shell.name}}