bootstrap 5 WIP

This commit is contained in:
Eugene Pankov 2023-02-04 20:50:11 +01:00
parent 0a2011acba
commit 153d11cfe2
No known key found for this signature in database
GPG Key ID: 5896FCBBDD1CF4F4
44 changed files with 244 additions and 695 deletions

View File

@ -53,6 +53,10 @@ a, button {
&>.form-control, &>.input-group {
width: 33%;
}
&>.form-check {
display: flex;
}
}
input[type=range] {
@ -175,19 +179,19 @@ ngb-typeahead-window {
// Windows high contrast mode
@media screen and (forced-colors: active) {
.custom-switch .custom-control-label::before {
.form-switch .form-check-label::before {
background: buttonface;
}
.custom-switch .custom-control-label::after {
.form-switch .form-check-label::after {
background: buttontext;
}
.custom-switch .custom-control-input:checked ~ .custom-control-label::before {
.form-switch .form-check-input:checked ~ .form-check-label::before {
background: activetext;
}
.custom-switch .custom-control-input:checked ~ .custom-control-label::after {
.form-switch .form-check-input:checked ~ .form-check-label::after {
background: canvas;
}

View File

@ -54,7 +54,6 @@
"ngx-sortablejs": "^11.1.0",
"ngx-toastr": "^14.0.0",
"node-abi": "^3.25.0",
"node-sass": "^7.0.3",
"npmlog": "6.0.2",
"npx": "^10.2.2",
"patch-package": "^6.4.7",
@ -66,6 +65,7 @@
"pug-loader": "^2.4.0",
"pug-static-loader": "2.0.0",
"raw-loader": "4.0.2",
"sass": "^1.58.0",
"sass-loader": "^12.6.0",
"shell-quote": "^1.7.4",
"shelljs": "0.8.5",

View File

@ -18,7 +18,7 @@
"license": "MIT",
"devDependencies": {
"@ngx-translate/core": "^14.0.0",
"bootstrap": "^4.1.3",
"bootstrap": "^5.3.0-alpha.1",
"deepmerge": "^4.1.1",
"fuzzy-search": "^3.2.1",
"js-yaml": "^4.0.0",

View File

@ -6,9 +6,9 @@ import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'
@Component({
selector: 'checkbox',
template: `
<div class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" [(ngModel)]='model'>
<label class="custom-control-label">{{text}}</label>
<div class="form-check form-checkbox">
<input type="checkbox" class="form-check-input" [(ngModel)]='model'>
<label class="form-check-label">{{text}}</label>
</div>
`,
providers: [

View File

@ -14,6 +14,6 @@
[(ngModel)]='remember',
text='Remember'
)
button.btn.btn-primary.ml-auto(
button.btn.btn-primary.ms-auto(
(click)='ok()',
) OK

View File

@ -21,14 +21,14 @@
[icon]='option.icon',
[color]='option.color'
)
.title.mr-2 {{getOptionText(option)}}
.title.me-2 {{getOptionText(option)}}
.description.no-wrap.text-muted(
*ngIf='option.description !== getOptionText(option)'
) {{option.description}}
.ml-auto
.no-wrap.badge.badge-secondary.text-muted.ml-2(*ngIf='selectedIndex == i && canEditSelected()')
.ms-auto
.no-wrap.badge.text-bg-secondary.text-muted.ms-2(*ngIf='selectedIndex == i && canEditSelected()')
span Backspace
i.fas.fa-pencil.ml-1
.no-wrap.badge.badge-secondary.text-muted.ml-2(*ngIf='selectedIndex == i')
i.fas.fa-pencil.ms-1
.no-wrap.badge.text-bg-secondary.text-muted.ms-2(*ngIf='selectedIndex == i')
span Enter
i.fas.fa-arrow-right.ml-1
i.fas.fa-arrow-right.ms-1

View File

@ -15,7 +15,7 @@ import { SelfPositioningComponent } from './selfPositioning.component'
(cdkDragStarted)='onTabDragStart(tab)'
(cdkDragEnded)='onTabDragEnd()'
>
<i class="fa fa-window-maximize mr-3"></i>
<i class="fa fa-window-maximize me-3"></i>
<label>{{tab.title}}</label>
</div>
`,

View File

@ -12,7 +12,7 @@ div
span {{command.label}}
footer.d-flex.align-items-center
.btn-group.mr-auto
.btn-group.me-auto
button.btn.btn-dark((click)='homeBase.openGitHub()')
i.fab.fa-github
span GitHub

View File

@ -6,9 +6,9 @@ import { CheckboxComponent } from './checkbox.component'
@Component({
selector: 'toggle',
template: `
<div class="custom-control custom-switch">
<input type="checkbox" class="custom-control-input" [(ngModel)]='model'>
<label class="custom-control-label"></label>
<div class="form-check form-switch">
<input type="checkbox" class="form-check-input" [(ngModel)]='model'>
<label class="cform-check-label"></label>
</div>
`,
styles: [require('./toggle.component.scss')],

View File

@ -1,6 +1,6 @@
.d-flex.align-items-center
.dropdown-header(translate) File transfers
button.btn.btn-link.ml-auto((click)='removeAll(); $event.stopPropagation()') !{require('../icons/times.svg')}
button.btn.btn-link.ms-auto((click)='removeAll(); $event.stopPropagation()') !{require('../icons/times.svg')}
.transfer(*ngFor='let transfer of transfers', (click)='showTransfer(transfer)')
.icon(*ngIf='isDownload(transfer)') !{require('../icons/download.svg')}
.icon(*ngIf='!isDownload(transfer)') !{require('../icons/upload.svg')}

View File

@ -1,7 +1,7 @@
.modal-body
.d-flex.align-items-center.mb-3
h3.m-0(translate) Vault is locked
.ml-auto(ngbDropdown, placement='bottom-right')
.ms-auto(ngbDropdown, placement='bottom-right')
button.btn.btn-link(ngbDropdownToggle, (click)='$event.stopPropagation()')
span(
*ngIf='rememberFor',
@ -29,6 +29,5 @@
(keyup.enter)='ok()',
(keyup.esc)='cancel()',
)
.input-group-append
button.btn.btn-secondary((click)='ok()', *ngIf='passphrase')
i.fas.fa-check
button.btn.btn-secondary((click)='ok()', *ngIf='passphrase')
i.fas.fa-check

View File

@ -19,10 +19,9 @@ $tab-border-radius: 5px;
$button-hover-bg: rgba(0, 0, 0, .125);
$button-active-bg: rgba(0, 0, 0, .25);
$theme-colors: (
"primary": $orange,
"secondary": $base0
);
$primary: #fd7e14;
$secondary: #495057;
$content-bg: rgba($white, 0.65);
$content-bg-solid: $white;
@ -257,8 +256,8 @@ multi-hotkey-input {
}
.item:has(.duplicate) {
background-color: theme-color('danger');
border: 1px solid theme-color('danger');
background-color: map-get($theme-colors, 'danger');
border: 1px solid map-get($theme-colors, 'danger');
}
.add {
@ -272,8 +271,8 @@ multi-hotkey-input {
}
.add:has(.duplicate), .item:has(.duplicate) .body, .item:has(.duplicate) .remove {
&:hover { background: darken(theme-color('danger'), 5%); }
&:active { background: darken(theme-color('danger'), 15%); }
&:hover { background: darken(map-get($theme-colors, 'danger'), 5%); }
&:active { background: darken(map-get($theme-colors, 'danger'), 15%); }
}
}
@ -303,7 +302,7 @@ hotkey-input-modal {
}
}
.form-group label {
.mb-3 label {
margin-bottom: 2px;
}
@ -370,7 +369,7 @@ toggle {
}
&.active .body .toggle {
background: theme-colors(primary) !important;
background: map-get($theme-colors, primary) !important;
}
}

View File

@ -163,8 +163,8 @@ multi-hotkey-input {
}
.item:has(.duplicate) {
background-color: theme-color('danger');
border: 1px solid theme-color('danger');
background-color: map-get($theme-colors, 'danger');
border: 1px solid map-get($theme-colors, 'danger');
}
.add {
@ -178,8 +178,8 @@ multi-hotkey-input {
}
.add:has(.duplicate), .item:has(.duplicate) .body, .item:has(.duplicate) .remove {
&:hover { background: darken(theme-color('danger'), 5%); }
&:active { background: darken(theme-color('danger'), 15%); }
&:hover { background: darken(map-get($theme-colors, 'danger'), 5%); }
&:active { background: darken(map-get($theme-colors, 'danger'), 15%); }
}
}
@ -209,7 +209,7 @@ hotkey-input-modal {
}
}
.form-group label {
.mb-3 label {
margin-bottom: 2px;
}
@ -375,9 +375,9 @@ search-panel {
font-size: 18px;
}
@include hover-focus {
color: $nav-tabs-link-active-color;
}
// @include hover-focus {
// color: $nav-tabs-link-active-color;
// }
&.disabled {
color: $nav-link-disabled-color;

View File

@ -175,13 +175,12 @@ $badge-padding-y: 4px;
$badge-padding-x: 6px;
$custom-control-indicator-size: 1.2rem;
$custom-control-indicator-bg: $body-bg;
$custom-control-indicator-border-color: lighten($body-bg, 25%);
$custom-control-indicator-checked-bg: theme-color("primary");
$custom-control-indicator-checked-color: $body-bg;
$custom-control-indicator-checked-border-color: transparent;
$custom-control-indicator-active-bg: rgba(255, 255, 0, 0.5);
$form-check-input-border: lighten($body-bg, 25%);
$form-check-input-width: 1.4em;
$form-switch-width: 2.5em;
$form-switch-color: lighten($body-bg, 25%);
$form-switch-focus-color: lighten($body-bg, 40%);
$form-switch-checked-color: map-get($theme-colors, "primary");
$modal-content-bg: $content-bg-solid;

View File

@ -33,10 +33,10 @@ base64-js@^1.3.1:
resolved "https://registry.yarnpkg.com/base64-js/-/base64-js-1.5.1.tgz#1b1b440160a5bf7ad40b650f095963481903930a"
integrity sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==
bootstrap@^4.1.3:
version "4.5.3"
resolved "https://registry.yarnpkg.com/bootstrap/-/bootstrap-4.5.3.tgz#c6a72b355aaf323920be800246a6e4ef30997fe6"
integrity sha512-o9ppKQioXGqhw8Z7mah6KdTYpNQY//tipnkxppWhPbiSWdD+1raYsnhwEZjkTHYbGee4cVQ0Rx65EhOY/HNLcQ==
bootstrap@^5.3.0-alpha.1:
version "5.3.0-alpha1"
resolved "https://registry.yarnpkg.com/bootstrap/-/bootstrap-5.3.0-alpha1.tgz#380629c4367893f02f7879a01ea3ae0f94e2e70e"
integrity sha512-ABZpKK4ObS3kKlIqH+ZVDqoy5t/bhFG0oHTAzByUdon7YIom0lpCeTqRniDzJmbtcWkNe800VVPBiJgxSYTYew==
buffer@^6.0.3:
version "6.0.3"

View File

@ -1,5 +1,5 @@
ng-container(*ngIf='!argvMode')
.form-group
.mb-3
label(translate) Command line
.input-group
.input-group-prepend
@ -15,7 +15,7 @@ ng-container(*ngIf='!argvMode')
)
ng-container(*ngIf='argvMode')
.form-group
.mb-3
label(translate) Program
.input-group
.input-group-prepend
@ -30,7 +30,7 @@ ng-container(*ngIf='argvMode')
[(ngModel)]='_model.command',
)
.form-group
.mb-3
label(translate) Arguments
.input-group(
*ngFor='let arg of _model.args; index as i; trackBy: trackByIndex',
@ -45,5 +45,5 @@ ng-container(*ngIf='argvMode')
.mt-2
button.btn.btn-secondary((click)='_model.args.push("")')
i.fas.fa-plus.mr-2
i.fas.fa-plus.me-2
span(translate) Add

View File

@ -10,11 +10,11 @@
.d-flex
button.btn.btn-secondary((click)='addEnvironmentVar()')
i.fas.fa-plus.mr-2
i.fas.fa-plus.me-2
span(translate) Add
.ml-auto
.ms-auto
.text-muted(translate) Substitutions allowed.
.d-flex.ml-1(*ngIf='shouldShowExample()')
.d-flex.ms-1(*ngIf='shouldShowExample()')
.text-muted(translate) Example:
a.ml-1((click)='addExample()', href='#') extend PATH
a.ms-1((click)='addExample()', href='#') extend PATH

View File

@ -7,7 +7,7 @@ command-line-editor([model]='profile.options')
[(ngModel)]='profile.options.runAsAdministrator',
)
.form-group
.mb-3
label(translate) Working directory
.input-group
@ -20,7 +20,7 @@ command-line-editor([model]='profile.options')
button.btn.btn-secondary((click)='pickWorkingDirectory()')
i.fas.fa-folder-open
.form-group
.mb-3
label(translate) Environment
environment-editor(
type='text',

View File

@ -11,7 +11,7 @@ h3.mb-3(translate) Shell
)
.alert.alert-info.d-flex.align-items-center(*ngIf='config.store.terminal.useConPTY && isConPTYAvailable && !isConPTYStable')
.mr-auto(translate) Windows 10 build 18309 or above is recommended for ConPTY
.me-auto(translate) Windows 10 build 18309 or above is recommended for ConPTY
.alert.alert-info.d-flex.align-items-center(*ngIf='config.store.terminal.profile.startsWith("WSL") && (!config.store.terminal.useConPTY)')
.mr-auto(translate) WSL terminal only supports TrueColor with ConPTY
.me-auto(translate) WSL terminal only supports TrueColor with ConPTY

View File

@ -1,6 +1,6 @@
.d-flex.mb-3
h3(translate) Plugins
button.btn.btn-secondary.btn-sm.ml-auto((click)='openPluginsFolder()')
button.btn.btn-secondary.btn-sm.ms-auto((click)='openPluginsFolder()')
i.fas.fa-folder
span(translate) Plugins folder
@ -43,14 +43,14 @@ ul.nav-tabs.mb-2(ngbNav, #nav='ngbNav')
)
i.fas.fa-fw.fa-cloud-download(*ngIf='busy.get(plugin.name) != BusyState.Installing')
i.fas.fa-fw.fa-circle-notch.fa-spin(*ngIf='busy.get(plugin.name) == BusyState.Installing')
span.ml-2(translate) Get
span.ms-2(translate) Get
button.btn.btn-secondary.btn-block.justify-content-center(
*ngIf='plugin.homepage',
(click)='showPluginHomepage(plugin)'
)
i.fas.fa-fw.fa-external-link-alt
span.ml-2(translate) Homepage
span.ms-2(translate) Homepage
.col-8
ng-container(*ngTemplateOutlet='pluginInfo; context: { plugin }')
@ -75,14 +75,14 @@ ul.nav-tabs.mb-2(ngbNav, #nav='ngbNav')
ng-container(*ngFor='let plugin of installedPlugins$')
ngb-panel
ng-template(ngbPanelTitle)
.text-left.mr-auto
.text-left.me-auto
div
strong {{plugin.name}}
small.text-muted.ml-2(*ngIf='plugin.isBuiltin', translate) Built-in
small.text-warning.ml-2(*ngIf='!isPluginEnabled(plugin)', translate) Disabled
small.text-muted.ms-2(*ngIf='plugin.isBuiltin', translate) Built-in
small.text-warning.ms-2(*ngIf='!isPluginEnabled(plugin)', translate) Disabled
small.d-block.text-muted {{plugin.description}}
button.btn.btn-primary.ml-2(
button.btn.btn-primary.ms-2(
*ngIf='knownUpgrades[plugin.name]',
(click)='upgradePlugin(plugin)',
[disabled]='busy.has(plugin.name)'
@ -133,11 +133,11 @@ ng-template(#pluginInfo, let-plugin='plugin')
.col-4
strong(translate) Author
.col-8
.badge.badge-success(*ngIf='plugin.isOfficial')
.badge.text-bg-success(*ngIf='plugin.isOfficial')
i.fas.fa-check
span.ml-1(translate) Official
span.ms-1(translate) Official
a.btn.btn-link.px-0.w-auto((click)='showPluginInfo(plugin)', *ngIf='!plugin.isOfficial')
span {{plugin.author}}
i.fas.fa-fw.fa-external-link-alt.ml-2
i.fas.fa-fw.fa-external-link-alt.ms-2
.mb-4([ngbNavOutlet]='nav')

View File

@ -4,7 +4,7 @@ ul.nav-tabs(ngbNav, #nav='ngbNav')
ng-template(ngbNavContent)
.row
.col-6(ng:if='hostApp.platform !== Platform.Web')
.form-group
.mb-3
label(translate) Device
input.form-control(
type='text',
@ -15,7 +15,7 @@ ul.nav-tabs(ngbNav, #nav='ngbNav')
)
.col-6
.form-group
.mb-3
label(translate) Baud rate
input.form-control(
type='number',

View File

@ -1,11 +1,11 @@
terminal-toolbar([tab]='this')
i.fas.fa-xs.fa-circle.text-success.mr-2(*ngIf='session && session.open')
i.fas.fa-xs.fa-circle.text-danger.mr-2(*ngIf='!session || !session.open')
i.fas.fa-xs.fa-circle.text-success.me-2(*ngIf='session && session.open')
i.fas.fa-xs.fa-circle.text-danger.me-2(*ngIf='!session || !session.open')
strong {{profile.options.port}} ({{profile.options.baudrate}})
.mr-auto
.me-auto
button.btn.btn-sm.btn-link.mr-3((click)='changeBaudRate()', *ngIf='session && session.open && hostApp.platform !== Platform.Web')
button.btn.btn-sm.btn-link.me-3((click)='changeBaudRate()', *ngIf='session && session.open && hostApp.platform !== Platform.Web')
span(translate) Change baud rate
button.btn.btn-sm.btn-link((click)='reconnect()', *ngIf='!session || !session.open')

View File

@ -38,7 +38,7 @@ ul.nav-tabs(ngbNav, #nav='ngbNav')
ng-container(*ngIf='config.store.configSync.token')
.alert.alert-danger(*ngIf='connectionSuccessful === false')
i.fas.fa-exclamation-triangle
span.ml-2(translate='Connection failed: {error}', [translateParams]='{error: connectionError}')
span.ms-2(translate='Connection failed: {error}', [translateParams]='{error: connectionError}')
ng-container(*ngIf='connectionSuccessful')
.form-line
@ -47,7 +47,7 @@ ul.nav-tabs(ngbNav, #nav='ngbNav')
div(*ngIf='configs === null')
i.fas.fa-fw.fa-circle-notch.fa-spin
span.ml-2(translate) Loading configs...
span.ms-2(translate) Loading configs...
ng-container(*ngIf='configs !== null')
.list-group-light
@ -57,39 +57,39 @@ ul.nav-tabs(ngbNav, #nav='ngbNav')
)
i.fas.fa-fw.text-success([class.fa-check]='isActiveConfig(cfg)')
i.fas.fa-fw.fa-file
.ml-2.d-flex.flex-column.align-items-start
.ms-2.d-flex.flex-column.align-items-start
div {{cfg.name}}
small.text-muted(
translate='Modified on {date}',
[translateParams]='{date: cfg.modified_at|date:"medium"}'
)
.mr-auto
button.btn.btn-link.ml-1(
.me-auto
button.btn.btn-link.ms-1(
(click)='uploadAndSync(cfg)',
[class.hover-reveal]='!isActiveConfig(cfg)'
)
i.fas.fa-arrow-up
span.ml-2(*ngIf='isActiveConfig(cfg)', translate) Upload
span.ml-2(*ngIf='!isActiveConfig(cfg)', translate) Replace
button.btn.btn-link.ml-1(
span.ms-2(*ngIf='isActiveConfig(cfg)', translate) Upload
span.ms-2(*ngIf='!isActiveConfig(cfg)', translate) Replace
button.btn.btn-link.ms-1(
(click)='downloadAndSync(cfg)',
[class.hover-reveal]='!isActiveConfig(cfg)'
)
i.fas.fa-arrow-down
span.ml-2(translate) Download
button.btn.btn-link.ml-1(
span.ms-2(translate) Download
button.btn.btn-link.ms-1(
(click)='delete(cfg)',
[class.hover-reveal]='!isActiveConfig(cfg)'
)
i.fas.fa-trash
span.ml-2(translate) Delete
span.ms-2(translate) Delete
a.list-group-item.list-group-item-action.d-flex.align-items-center(
href='#',
(click)='uploadAsNew()'
)
i.fas.fa-fw
i.fas.fa-fw.fa-cloud-upload-alt
.ml-2(translate) Upload as a new config
.ms-2(translate) Upload as a new config
ng-container(*ngIf='hasMatchingRemoteConfig()')
.form-line

View File

@ -10,7 +10,7 @@
.modal-body
.row
.col-12.col-lg-4
.form-group(*ngIf='!defaultsMode')
.mb-3(*ngIf='!defaultsMode')
label(translate) Name
input.form-control(
type='text',
@ -18,7 +18,7 @@
[(ngModel)]='profile.name',
)
.form-group(*ngIf='!defaultsMode')
.mb-3(*ngIf='!defaultsMode')
label(translate) Group
input.form-control(
type='text',
@ -28,7 +28,7 @@
[ngbTypeahead]='groupTypeahead',
)
.form-group(*ngIf='!defaultsMode')
.mb-3(*ngIf='!defaultsMode')
label(translate) Icon
.input-group
input.form-control(
@ -47,7 +47,7 @@
ng-template(#rt,let-r='result',let-t='term')
i([class]='"fa-fw " + r')
ngb-highlight.ml-2([result]='r', [term]='t')
ngb-highlight.ms-2([result]='r', [term]='t')
.form-line
.header

View File

@ -6,13 +6,13 @@ h3.mb-3(translate) Hotkeys
i.fas.fa-fw.fa-search
input.form-control(type='search', [placeholder]='"Search hotkeys"|translate', [(ngModel)]='hotkeyFilter')
.form-group.hotkeys-table
.mb-3.hotkeys-table
ng-container(*ngFor='let hotkey of hotkeyDescriptions')
.row.align-items-center(*ngIf='!hotkeyFilter || hotkeyFilterFn(hotkey, hotkeyFilter)')
.col-8.py-2
span {{hotkey.name|translate}}
span.ml-2.text-muted ({{hotkey.id}})
.col-4.pr-5
span.ms-2.text-muted ({{hotkey.id}})
.col-4.pe-5
multi-hotkey-input(
[hotkeys]='getHotkeys(hotkey.id) || []',
(hotkeysChange)='setHotkeys(hotkey.id, $event)'

View File

@ -23,12 +23,11 @@ ul.nav-tabs(ngbNav, #nav='ngbNav')
.d-flex.mb-3
.input-group
.input-group-prepend
.input-group-text
i.fas.fa-fw.fa-search
.input-group-text
i.fas.fa-fw.fa-search
input.form-control(type='search', [placeholder]='"Filter"|translate', [(ngModel)]='filter')
button.btn.btn-primary.flex-shrink-0.ml-3((click)='newProfile()')
button.btn.btn-primary.flex-shrink-0.ms-3((click)='newProfile()')
i.fas.fa-fw.fa-plus
span(translate) New profile
@ -40,20 +39,20 @@ ul.nav-tabs(ngbNav, #nav='ngbNav')
)
.fa.fa-fw.fa-chevron-right(*ngIf='group.collapsed')
.fa.fa-fw.fa-chevron-down(*ngIf='!group.collapsed')
span.ml-3.mr-auto {{group.name || ("Ungrouped"|translate)}}
button.btn.btn-sm.btn-link.hover-reveal.ml-2(
span.ms-3.me-auto {{group.name || ("Ungrouped"|translate)}}
button.btn.btn-sm.btn-link.hover-reveal.ms-2(
*ngIf='group.editable && group.name',
(click)='$event.stopPropagation(); editGroup(group)'
)
i.fas.fa-pencil-alt
button.btn.btn-sm.btn-link.hover-reveal.ml-2(
button.btn.btn-sm.btn-link.hover-reveal.ms-2(
*ngIf='group.editable && group.name',
(click)='$event.stopPropagation(); deleteGroup(group)'
)
i.fas.fa-trash-alt
ng-container(*ngIf='!group.collapsed')
ng-container(*ngFor='let profile of group.profiles')
.list-group-item.pl-5.d-flex.align-items-center(
.list-group-item.ps-5.d-flex.align-items-center(
*ngIf='isProfileVisible(profile)',
[class.list-group-item-action]='!profile.isBuiltin',
(click)='profile.isBuiltin ? null : editProfile(profile)'
@ -64,23 +63,23 @@ ul.nav-tabs(ngbNav, #nav='ngbNav')
)
.no-wrap {{profile.name}}
.text-muted.no-wrap.ml-2 {{getDescription(profile)}}
.text-muted.no-wrap.ms-2 {{getDescription(profile)}}
.mr-auto
.me-auto
button.btn.btn-link.hover-reveal.ml-1((click)='$event.stopPropagation(); launchProfile(profile)')
button.btn.btn-link.hover-reveal.ms-1((click)='$event.stopPropagation(); launchProfile(profile)')
i.fas.fa-play
button.btn.btn-link.hover-reveal.ml-1((click)='$event.stopPropagation(); newProfile(profile)')
button.btn.btn-link.hover-reveal.ms-1((click)='$event.stopPropagation(); newProfile(profile)')
i.fas.fa-copy
button.btn.btn-link.hover-reveal.ml-1(
button.btn.btn-link.hover-reveal.ms-1(
*ngIf='!profile.isBuiltin',
(click)='$event.stopPropagation(); deleteProfile(profile)'
)
i.fas.fa-trash-alt
.ml-1(class='badge badge-{{getTypeColorClass(profile)}}') {{getTypeLabel(profile)}}
.ms-1(class='badge text-bg-{{getTypeColorClass(profile)}}') {{getTypeLabel(profile)}}
li(ngbNavItem)
a(ngbNavLink, translate) Advanced

View File

@ -2,7 +2,7 @@
ul.nav-pills(ngbNav, #nav='ngbNav', [activeId]='activeTab', orientation='vertical')
li(ngbNavItem='application')
a(ngbNavLink)
i.fas.fa-fw.fa-window-maximize.mr-2
i.fas.fa-fw.fa-window-maximize.me-2
span(translate) Application
ng-template(ngbNavContent)
.content-box
@ -71,7 +71,7 @@
.title(translate) Language
a.description((click)='homeBase.openTranslations()')
span(translate) Help translate Tabby
i.fas.fa-external-link-square-alt.ml-1
i.fas.fa-external-link-square-alt.ms-1
select.form-control([(ngModel)]='config.store.language', (ngModelChange)='saveConfiguration(true)')
option([ngValue]='null', translate) Automatic
option(
@ -117,7 +117,7 @@
ng-container(*ngFor='let provider of settingsProviders')
li(*ngIf='provider.prioritized', [ngbNavItem]='provider.id')
a.d-flex.align-items-center(ngbNavLink)
i(class='fas fa-fw mr-2 fa-{{provider.icon}}')
i(class='fas fa-fw me-2 fa-{{provider.icon}}')
span {{provider.title|translate}}
ng-template(ngbNavContent)
settings-tab-body([provider]='provider')
@ -127,14 +127,14 @@
ng-container(*ngFor='let provider of settingsProviders')
li(*ngIf='!provider.prioritized', [ngbNavItem]='provider.id')
a.d-flex.align-items-center(ngbNavLink)
i(class='fas fa-fw mr-2 fa-{{provider.icon || "puzzle-piece"}}')
i(class='fas fa-fw me-2 fa-{{provider.icon || "puzzle-piece"}}')
span {{provider.title|translate}}
ng-template(ngbNavContent)
settings-tab-body([provider]='provider')
li(ngbNavItem='config-file')
a.d-flex.align-items-center(ngbNavLink)
i.fas.fa-fw.fa-code.mr-2
i.fas.fa-fw.fa-code.me-2
span(translate) Config file
ng-template.test(ngbNavContent)
.d-flex.flex-column.w-100.h-100
@ -152,20 +152,20 @@
)
.mt-3.d-flex
button.btn.btn-primary((click)='saveConfigFile()', *ngIf='isConfigFileValid()')
i.fas.fa-check.mr-2
i.fas.fa-check.me-2
span(translate) Save and apply
button.btn.btn-primary(disabled, *ngIf='!isConfigFileValid()')
i.fas.fa-exclamation-triangle.mr-2
i.fas.fa-exclamation-triangle.me-2
span(translate) Invalid syntax
button.btn.btn-secondary.ml-auto(
button.btn.btn-secondary.ms-auto(
(click)='showConfigDefaults = !showConfigDefaults',
translate
) Show defaults
button.btn.btn-secondary.ml-3(
button.btn.btn-secondary.ms-3(
*ngIf='platform.getConfigPath()',
(click)='showConfigFile()'
)
i.fas.fa-external-link-square-alt.mr-2
i.fas.fa-external-link-square-alt.me-2
span(translate) Show config file
div([ngbNavOutlet]='nav')

View File

@ -8,7 +8,7 @@
div(*ngIf='vault.isEnabled()')
.d-flex.align-items-center.mb-3
h3.m-0(translate) Vault
.d-flex.ml-auto(ngbDropdown, *ngIf='vault.isEnabled()')
.d-flex.ms-auto(ngbDropdown, *ngIf='vault.isEnabled()')
button.btn.btn-secondary(ngbDropdownToggle, translate) Options
div(ngbDropdownMenu)
a(ngbDropdownItem, (click)='changePassphrase()')
@ -24,9 +24,9 @@ div(*ngIf='vault.isEnabled()')
h3.m-3(translate) Vault is empty
.list-group
.list-group-item.d-flex.align-items-center.p-1.pl-3(*ngFor='let secret of vaultContents.secrets')
.list-group-item.d-flex.align-items-center.p-1.ps-3(*ngFor='let secret of vaultContents.secrets')
i.fas.fa-key
.mr-auto {{getSecretLabel(secret)}}
.me-auto {{getSecretLabel(secret)}}
.hover-reveal(ngbDropdown)
button.btn.btn-link(ngbDropdownToggle)

View File

@ -146,7 +146,7 @@ h3.mt-4(translate) Docking
)
span(translate) Bottom
.ml-5.form-line(*ngIf='docking && config.store.appearance.dock != "off"')
.ms-5.form-line(*ngIf='docking && config.store.appearance.dock != "off"')
.header
.title(translate) Display on
.description(translate) Snaps the window to a side of the screen
@ -171,7 +171,7 @@ h3.mt-4(translate) Docking
)
| {{screen.name}}
.ml-5.form-line(*ngIf='docking && config.store.appearance.dock != "off"')
.ms-5.form-line(*ngIf='docking && config.store.appearance.dock != "off"')
.header
.title(translate) Dock always on top
.description(translate) Keep docked terminal always on top
@ -180,7 +180,7 @@ h3.mt-4(translate) Docking
(ngModelChange)='saveConfiguration(); docking.dock()',
)
.ml-5.form-line(*ngIf='docking && config.store.appearance.dock != "off"')
.ms-5.form-line(*ngIf='docking && config.store.appearance.dock != "off"')
.header
.title(translate) Docked terminal size
.description(translate) Window dimension away from the edge
@ -193,7 +193,7 @@ h3.mt-4(translate) Docking
step='0.01'
)
.ml-5.form-line(*ngIf='docking && config.store.appearance.dock != "off"')
.ms-5.form-line(*ngIf='docking && config.store.appearance.dock != "off"')
.header
.title(translate) Docked terminal space
.description(translate) Window dimension along the edge
@ -206,7 +206,7 @@ h3.mt-4(translate) Docking
step='0.01'
)
.ml-5.form-line(*ngIf='docking && config.store.appearance.dock != "off"')
.ms-5.form-line(*ngIf='docking && config.store.appearance.dock != "off"')
.header
.title(translate) Hide window on focus loss
.description(translate) Hides the docked terminal when you click away.

View File

@ -6,16 +6,16 @@
strong(translate) Warning: remote host's key has suddenly changed!
div(translate) You could be under a man-in-the-middle attack right now, or the host key could have just been changed.
.form-group(*ngIf='isMismatched')
.mb-3(*ngIf='isMismatched')
.d-flex.align-items-center
label(translate) Last known host key fingerprint
.badge.badge-danger.ml-auto {{ selector.type }}
.badge.text-bg-danger.ms-auto {{ selector.type }}
code {{knownHost.digest}}
.form-group
.mb-3
.d-flex.align-items-center
label(translate) Current host key fingerprint
.badge.badge-success.ml-auto {{ selector.type }}
.badge.text-bg-success.ms-auto {{ selector.type }}
code {{digest}}
.modal-footer

View File

@ -1,6 +1,6 @@
.d-flex
strong(translate) Keyboard-interactive auth
.ml-2 {{prompt.name}}
.ms-2 {{prompt.name}}
.prompt-text {{prompt.prompts[step].prompt}}
@ -18,7 +18,7 @@ input.form-control.mt-2(
*ngIf='step > 0',
(click)='previous()'
)
.ml-auto
.ms-auto
button.btn.btn-primary(
(click)='next()'
)

View File

@ -1,6 +1,6 @@
.modal-body
label(translate) Name for the new directory
.form-group.w-100.mr-2
.mb-3.w-100.me-2
input.form-control(
type='text',
[(ngModel)]='directoryName',

View File

@ -18,11 +18,11 @@
.breadcrumb-spacer.flex-grow-1.h-100((dblclick)='editPath()')
button.btn.btn-link.btn-sm.d-flex((click)='openCreateDirectoryModal()')
i.fas.fa-plus.mr-1
i.fas.fa-plus.me-1
div(translate) Create directory
button.btn.btn-link.btn-sm.d-flex((click)='upload()')
i.fas.fa-upload.mr-1
i.fas.fa-upload.me-1
div(translate) Upload
button.btn.btn-link.btn-close((click)='close()') !{require('../../../tabby-core/src/icons/times.svg')}
@ -32,7 +32,7 @@
*ngIf='shouldShowCWDTip && !cwdDetectionAvailable',
(click)='platform.openExternal("https://tabby.sh/go/cwd-detection")'
)
.mr-auto
.me-auto
strong(translate) Working directory detection
div(translate) Learn how to allow Tabby to detect remote shell's working directory.
button.close((click)='dismissCWDTip()')
@ -55,7 +55,7 @@
)
i.fa-fw([class]='getIcon(item)')
div {{item.name}}
.mr-auto
.me-auto
.size(*ngIf='!item.isDirectory') {{item.size|filesize}}
.date {{item.modified|date:'medium'}}
.mode {{getModeString(item)}}

View File

@ -5,12 +5,12 @@
strong(*ngIf='fw.type === PortForwardType.Local', translate) Local
strong(*ngIf='fw.type === PortForwardType.Remote', translate) Remote
strong(*ngIf='fw.type === PortForwardType.Dynamic', translate, translateContext='[Dynamic] port forwarding') id.port-forwarding.dynamic
.ml-3 {{fw.host}}:{{fw.port}}
.ml-2 &rarr;
.ml-2(*ngIf='fw.type !== PortForwardType.Dynamic') {{fw.targetAddress}}:{{fw.targetPort}}
.ml-2(*ngIf='fw.type === PortForwardType.Dynamic', translate) SOCKS proxy
.ms-3 {{fw.host}}:{{fw.port}}
.ms-2 &rarr;
.ms-2(*ngIf='fw.type !== PortForwardType.Dynamic') {{fw.targetAddress}}:{{fw.targetPort}}
.ms-2(*ngIf='fw.type === PortForwardType.Dynamic', translate) SOCKS proxy
div {{fw.description}}
button.btn.btn-link.hover-reveal.ml-auto((click)='remove(fw)')
button.btn.btn-link.hover-reveal.ms-auto((click)='remove(fw)')
i.fas.fa-trash-alt
h5(translate) Add a port forward
@ -40,7 +40,7 @@ h5(translate) Add a port forward
input.form-control(type='text', placeholder='Description', [(ngModel)]='newForward.description')
.d-flex
.btn-group.mr-auto(
.btn-group.me-auto(
[(ngModel)]='newForward.type',
ngbRadioGroup
)
@ -67,5 +67,5 @@ h5(translate) Add a port forward
span(translate, translateContext='[Dynamic] port forwarding') id.port-forwarding.dynamic
button.btn.btn-primary((click)='addForward()')
i.fas.fa-check.mr-2
i.fas.fa-check.me-2
span(translate) Forward port

View File

@ -3,7 +3,7 @@ ul.nav-tabs(ngbNav, #nav='ngbNav')
a(ngbNavLink, translate) General
ng-template(ngbNavContent)
.d-flex.w-100.mt-3
.form-group.mr-2(
.mb-3.me-2(
ngbDropdown
)
label(translate) Connection
@ -35,21 +35,21 @@ ul.nav-tabs(ngbNav, #nav='ngbNav')
div(translate) HTTP proxy
.text-muted(translate) Using CONNECT method
.form-group.w-100(*ngIf='connectionMode === "proxyCommand"')
.mb-3.w-100(*ngIf='connectionMode === "proxyCommand"')
label(translate) Proxy command
input.form-control(
type='text',
[(ngModel)]='profile.options.proxyCommand',
)
.form-group.w-100.mr-2(*ngIf='connectionMode !== "proxyCommand"')
.mb-3.w-100.me-2(*ngIf='connectionMode !== "proxyCommand"')
label(translate) Host
input.form-control(
type='text',
[(ngModel)]='profile.options.host',
)
.form-group(*ngIf='connectionMode !== "proxyCommand"')
.mb-3(*ngIf='connectionMode !== "proxyCommand"')
label(translate) Port
input.form-control(
type='number',
@ -57,7 +57,7 @@ ul.nav-tabs(ngbNav, #nav='ngbNav')
[(ngModel)]='profile.options.port',
)
.form-group(*ngIf='connectionMode === "jumpHost"')
.mb-3(*ngIf='connectionMode === "jumpHost"')
label(translate) Jump host
select.form-control([(ngModel)]='profile.options.jumpHost')
option([ngValue]='null', translate) Select
@ -65,14 +65,14 @@ ul.nav-tabs(ngbNav, #nav='ngbNav')
.d-flex.w-100(*ngIf='connectionMode === "socksProxy"')
.form-group.w-100.mr-2
.mb-3.w-100.me-2
label(translate) SOCKS proxy host
input.form-control(
type='text',
[(ngModel)]='profile.options.socksProxyHost',
)
.form-group
.mb-3
label(translate) SOCKS proxy port
input.form-control(
type='number',
@ -81,14 +81,14 @@ ul.nav-tabs(ngbNav, #nav='ngbNav')
)
.d-flex.w-100(*ngIf='connectionMode === "httpProxy"')
.form-group.w-100.mr-2
.mb-3.w-100.me-2
label(translate) HTTP proxy host
input.form-control(
type='text',
[(ngModel)]='profile.options.httpProxyHost',
)
.form-group
.mb-3
label(translate) HTTP proxy port
input.form-control(
type='number',
@ -96,7 +96,7 @@ ul.nav-tabs(ngbNav, #nav='ngbNav')
[(ngModel)]='profile.options.httpProxyPort',
)
.form-group
.mb-3
label(translate) Username
input.form-control(
type='text',
@ -104,7 +104,7 @@ ul.nav-tabs(ngbNav, #nav='ngbNav')
[(ngModel)]='profile.options.user',
)
.form-group
.mb-3
label(translate) Authentication method
.btn-group.mt-1.w-100(
@ -137,19 +137,19 @@ ul.nav-tabs(ngbNav, #nav='ngbNav')
.title(translate) Password
.description(*ngIf='!hasSavedPassword', translate) Save a password in the keychain
.description(*ngIf='hasSavedPassword', translate) There is a saved password for this connection
button.btn.btn-success.ml-4(*ngIf='!hasSavedPassword', (click)='setPassword()')
button.btn.btn-success.ms-4(*ngIf='!hasSavedPassword', (click)='setPassword()')
i.fas.fa-key
span(translate) Set password
button.btn.btn-danger.ml-4(*ngIf='hasSavedPassword', (click)='clearSavedPassword()')
button.btn.btn-danger.ms-4(*ngIf='hasSavedPassword', (click)='clearSavedPassword()')
i.fas.fa-trash-alt
span(translate) Forget
.form-group(*ngIf='!profile.options.auth || profile.options.auth === "publicKey"')
.mb-3(*ngIf='!profile.options.auth || profile.options.auth === "publicKey"')
label(translate) Private keys
.list-group.mb-2
.list-group-item.d-flex.align-items-center.p-1.pl-3(*ngFor='let path of profile.options.privateKeys')
.list-group-item.d-flex.align-items-center.p-1.ps-3(*ngFor='let path of profile.options.privateKeys')
i.fas.fa-key
.no-wrap.mr-auto {{path}}
.no-wrap.me-auto {{path}}
button.btn.btn-link((click)='removePrivateKey(path)')
i.fas.fa-trash
button.btn.btn-secondary((click)='addPrivateKey()')

View File

@ -1,9 +1,9 @@
terminal-toolbar([tab]='this')
i.fas.fa-xs.fa-circle.text-success.mr-2(*ngIf='session && session.open')
i.fas.fa-xs.fa-circle.text-danger.mr-2(*ngIf='!session || !session.open')
strong.mr-auto {{profile.options.user}}@{{profile.options.host}}:{{profile.options.port}}
i.fas.fa-xs.fa-circle.text-success.me-2(*ngIf='session && session.open')
i.fas.fa-xs.fa-circle.text-danger.me-2(*ngIf='!session || !session.open')
strong.me-auto {{profile.options.user}}@{{profile.options.host}}:{{profile.options.port}}
.mr-2(
.me-2(
ngbDropdown,
container='body',
*ngIf='session && !session.supportsWorkingDirectory()',
@ -13,16 +13,16 @@ terminal-toolbar([tab]='this')
i.far.fa-lightbulb.text-primary
.bg-dark(ngbDropdownMenu)
a.d-flex.align-items-center(ngbDropdownItem, (click)='platform.openExternal("https://tabby.sh/go/cwd-detection")')
.mr-auto
.me-auto
strong(translate) Working directory detection
div(translate) Learn how to allow Tabby to detect remote shell's working directory.
i.fas.fa-arrow-right.ml-4
i.fas.fa-arrow-right.ms-4
button.btn.btn-sm.btn-link.mr-2((click)='reconnect()')
button.btn.btn-sm.btn-link.me-2((click)='reconnect()')
i.fas.fa-redo
span(translate) Reconnect
button.btn.btn-sm.btn-link.mr-2((click)='openSFTP()', *ngIf='session && session.open')
button.btn.btn-sm.btn-link.me-2((click)='openSFTP()', *ngIf='session && session.open')
i.far.fa-folder-open
span SFTP

View File

@ -2,14 +2,14 @@ ul.nav-tabs(ngbNav, #nav='ngbNav')
li(ngbNavItem)
a(ngbNavLink, translate) General
ng-template(ngbNavContent)
.form-group
.mb-3
label(translate) Host
input.form-control(
type='text',
[(ngModel)]='profile.options.host',
)
.form-group
.mb-3
label(translate) Port
input.form-control(
type='number',

View File

@ -1,8 +1,8 @@
terminal-toolbar([tab]='this')
i.fas.fa-xs.fa-circle.text-success.mr-2(*ngIf='session && session.open')
i.fas.fa-xs.fa-circle.text-danger.mr-2(*ngIf='!session || !session.open')
strong.mr-auto {{profile.options.host}}:{{profile.options.port}}
i.fas.fa-xs.fa-circle.text-success.me-2(*ngIf='session && session.open')
i.fas.fa-xs.fa-circle.text-danger.me-2(*ngIf='!session || !session.open')
strong.me-auto {{profile.options.host}}:{{profile.options.port}}
button.btn.btn-sm.btn-link.mr-2((click)='reconnect()')
button.btn.btn-sm.btn-link.me-2((click)='reconnect()')
i.fas.fa-redo
span(translate) Reconnect

View File

@ -2,7 +2,7 @@
.bg-dark.p-3.mb-4(*ngIf='model')
.d-flex.align-items-center
span {{model.name}}
.mr-auto
.me-auto
a.btn-link((click)='selectScheme(null); $event.preventDefault()', href='#', translate) Clear
color-scheme-preview([scheme]='model')
@ -24,8 +24,8 @@
.d-flex.w-100.align-items-center
i.fas.fa-fw([class.fa-check]='model?.name === scheme.name')
.ml-2
.ms-2
.mr-auto {{scheme.name}}
.me-auto {{scheme.name}}
color-scheme-preview([scheme]='scheme')

View File

@ -3,12 +3,12 @@
.d-flex.align-items-center(*ngIf='!editing')
span {{getCurrentSchemeName()}}
.mr-auto
.me-auto
.btn-toolbar
button.btn.btn-secondary((click)='editScheme()')
i.fas.fa-pen
span(translate) Edit
.mr-1
.me-1
button.btn.btn-danger(
(click)='deleteScheme(config.store.terminal.colorScheme)',
*ngIf='currentCustomScheme'
@ -17,11 +17,11 @@
span(translate) Delete
div(*ngIf='editing')
.form-group
.mb-3
label(translate) Name
input.form-control(type='text', [(ngModel)]='config.store.terminal.colorScheme.name')
.form-group
.mb-3
color-picker(
[(model)]='config.store.terminal.colorScheme.foreground',
(modelChange)='config.save()',
@ -69,11 +69,11 @@
color-scheme-preview([scheme]='config.store.terminal.colorScheme')
.btn-toolbar.d-flex.mt-2(*ngIf='editing')
.mr-auto
.me-auto
button.btn.btn-primary((click)='saveScheme()')
i.fas.fa-check
span(translate) Save
.mr-1
.me-1
button.btn.btn-secondary((click)='cancelEditing()')
i.fas.fa-times
span(translate) Cancel
@ -97,11 +97,11 @@
.d-flex.w-100.align-items-center
i.fas.fa-fw([class.fa-check]='(currentCustomScheme || currentStockScheme) === scheme')
.ml-2
.ms-2
.mr-auto
.me-auto
span {{scheme.name}}
.badge.badge-info.ml-2(*ngIf='customColorSchemes.includes(scheme)', translate) Custom
.badge.text-bg-info.ms-2(*ngIf='customColorSchemes.includes(scheme)', translate) Custom
div
.d-flex

View File

@ -27,7 +27,7 @@ ng-container(*ngIf='state.resultCount > 0')
[fastHtmlBind]='icons.arrowDown'
)
.mr-2
.me-2
button.btn.btn-link(
(click)='options.caseSensitive = !options.caseSensitive; saveSearchOptions()',
@ -53,7 +53,7 @@ button.btn.btn-link(
[fastHtmlBind]='icons.wholeWord'
)
.mr-2
.me-2
button.btn.btn-link(
(click)='close.emit()',

View File

@ -196,7 +196,7 @@ div.mt-4
span(translate) Audible
.alert.alert-info.d-flex.align-items-center(*ngIf='config.store.terminal.bell != "audible" && (config.store.terminal.profile || "").startsWith("wsl")')
.mr-auto(translate) WSL terminal bell can only be muted via Volume Mixer
.me-auto(translate) WSL terminal bell can only be muted via Volume Mixer
button.btn.btn-secondary((click)='openWSLVolumeMixer()', translate) Show Mixer
.mt-4

View File

@ -3,7 +3,7 @@
small {{options.detail}}
.modal-footer
.ml-auto
.ms-auto
button.btn(
*ngFor='let button of options.buttons; index as i',
[autofocus]='i === options.defaultId',

543
yarn.lock

File diff suppressed because it is too large Load Diff