This commit is contained in:
Eugene Pankov 2017-04-28 21:37:39 +02:00
parent 8be70110fe
commit c7828e55f2
4 changed files with 55 additions and 30 deletions

View File

@ -16,37 +16,39 @@ title-bar(*ngIf='config.store.appearance.frame == "full" && config.store.appeara
(closeClicked)='app.closeTab(tab)', (closeClicked)='app.closeTab(tab)',
) )
button.btn.btn-secondary( .btn-group
*ngFor='let button of getLeftToolbarButtons()', button.btn.btn-secondary.btn-tab-bar(
[title]='button.title', *ngFor='let button of getLeftToolbarButtons()',
(click)='button.click()', [title]='button.title',
) (click)='button.click()',
i.fa([class]='"fa fa-" + button.icon') )
i.fa([class]='"fa fa-" + button.icon')
.drag-space .drag-space
button.btn.btn-secondary( .btn-group
*ngFor='let button of getRightToolbarButtons()', button.btn.btn-secondary.btn-tab-bar(
[title]='button.title', *ngFor='let button of getRightToolbarButtons()',
(click)='button.click()', [title]='button.title',
) (click)='button.click()',
i.fa([class]='"fa fa-" + button.icon') )
i.fa([class]='"fa fa-" + button.icon')
button.btn.btn-secondary.btn-minimize( .btn-group.window-controls(
*ngIf='config.store.appearance.frame == "thin"', *ngIf='config.store.appearance.frame == "thin"',
(click)='hostApp.minimize()',
) )
i.fa.fa-window-minimize button.btn.btn-secondary.btn-minimize.btn-tab-bar(
button.btn.btn-secondary.btn-maximize( (click)='hostApp.minimize()',
*ngIf='config.store.appearance.frame == "thin"', )
(click)='hostApp.toggleMaximize()', i.fa.fa-window-minimize
) button.btn.btn-secondary.btn-maximize.btn-tab-bar(
i.fa.fa-window-maximize (click)='hostApp.toggleMaximize()',
button.btn.btn-secondary.btn-close( )
*ngIf='config.store.appearance.frame == "thin"', i.fa.fa-window-maximize
(click)='hostApp.quit()', button.btn.btn-secondary.btn-close.btn-tab-bar(
) (click)='hostApp.quit()',
i.fa.fa-close )
i.fa.fa-close
start-page(*ngIf='app.tabs.length == 0') start-page(*ngIf='app.tabs.length == 0')

View File

@ -5,6 +5,7 @@
flex-direction: column; flex-direction: column;
overflow: hidden; overflow: hidden;
-webkit-user-select: none; -webkit-user-select: none;
-webkit-user-drag: none;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
cursor: default; cursor: default;
animation: 0.5s ease-out fadeIn; animation: 0.5s ease-out fadeIn;
@ -29,7 +30,7 @@ $tab-border-radius: 4px;
height: $tabs-height; height: $tabs-height;
display: flex; display: flex;
&>button { .btn-tab-bar {
line-height: $tabs-height + 2px; line-height: $tabs-height + 2px;
cursor: pointer; cursor: pointer;
@ -69,6 +70,10 @@ $tab-border-radius: 4px;
flex: 1 0 25%; flex: 1 0 25%;
-webkit-app-region: drag; -webkit-app-region: drag;
} }
&.window-controls {
flex: 0 0 none;
}
} }
.tabs-content { .tabs-content {

View File

@ -82,13 +82,14 @@ title-bar {
} }
} }
$border-color: #141414;
app-root { app-root {
&> .content { &> .content {
background: $body-bg2; background: $body-bg2;
.tab-bar { .tab-bar {
&>button { .btn-tab-bar {
&:not(:hover):not(:active) { &:not(:hover):not(:active) {
background: $body-bg2; background: $body-bg2;
} }
@ -105,6 +106,9 @@ app-root {
tab-header { tab-header {
background: $body-bg2; background: $body-bg2;
border-left: 1px solid transparent;
border-right: 1px solid transparent;
margin-bottom: -1px;
.index { .index {
color: #555; color: #555;
@ -121,6 +125,8 @@ app-root {
&.active { &.active {
background: $body-bg; background: $body-bg;
border-left: 1px solid $border-color;
border-right: 1px solid $border-color;
} }
} }
} }
@ -129,15 +135,21 @@ app-root {
&.tabs-on-top .tab-bar { &.tabs-on-top .tab-bar {
tab-header { tab-header {
border-top: 1px solid transparent; border-top: 1px solid transparent;
border-bottom: 1px solid $border-color;
&.active { &.active {
border-top: 1px solid $teal; border-top: 1px solid $teal;
border-bottom: 1px solid transparent;
} }
&.has-activity:not(.active) { &.has-activity:not(.active) {
border-top: 1px solid $green; border-top: 1px solid $green;
} }
} }
&>.btn-group, .drag-space {
border-bottom: 1px solid $border-color;
}
} }
&:not(.tabs-on-top) .tab-bar { &:not(.tabs-on-top) .tab-bar {
@ -145,15 +157,21 @@ app-root {
tab-header { tab-header {
border-bottom: 1px solid transparent; border-bottom: 1px solid transparent;
border-top: 1px solid $border-color;
&.active { &.active {
border-bottom: 1px solid $teal; border-bottom: 1px solid $teal;
border-top: 1px solid transparent;
} }
&.has-activity:not(.active) { &.has-activity:not(.active) {
border-bottom: 1px solid $green; border-bottom: 1px solid $green;
} }
} }
&>.btn-group, .drag-space {
border-top: 1px solid $border-color;
}
} }
} }
} }

View File

@ -5,6 +5,6 @@ module.exports = [
require('./terminus-terminal/webpack.config.js'), require('./terminus-terminal/webpack.config.js'),
require('./terminus-clickable-links/webpack.config.js'), require('./terminus-clickable-links/webpack.config.js'),
require('./terminus-community-color-schemes/webpack.config.js'), require('./terminus-community-color-schemes/webpack.config.js'),
require('./terminus-plugin-manager/webpack.config.js'), //require('./terminus-plugin-manager/webpack.config.js'),
require('./terminus-theme-hype/webpack.config.js'), require('./terminus-theme-hype/webpack.config.js'),
] ]